Add config option for setting title of the blog sidebar (#770)

* Allow controlling the title of the blog sidebar * Update guides-blog.md
facebook · Jun 15, 2018 · 58fba70 · 58fba70
1 parent 62a2c7c
commit 58fba70
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 3 deletions.
diff --git a/docs/api-site-config.md b/docs/api-site-config.md
@@ -74,6 +74,8 @@ headerLinks: [
 
 `blogSidebarCount` - Control the number of blog posts that show up in the sidebar. See the [adding a blog docs](guides-blog.md#changing-how-many-blog-posts-show-on-sidebar) for more information.
 
+`blogSidebarTitle` - Control the title of the blog sidebar. See the [adding a blog docs](guides-blog.md#changing-the-sidebar-title) for more information.
+
 `cleanUrl` - If `true`, allow URLs with no `html` extension. For example, a request to URL https://docusaurus.io/docs/installation will returns the same result as https://docusaurus.io/docs/installation.html.
 
 `cname` - The CNAME for your website. It will go into a `CNAME` file when your site is built.

diff --git a/docs/guides-blog.md b/docs/guides-blog.md
@@ -80,6 +80,18 @@ Example:
 blogSidebarCount: 'ALL';
 ```
 
+## Changing The Sidebar Title
+
+You can configure a specific sidebar title by adding a `blogSidebarTitle` setting to your `siteConfig.js`.
+
+The option is an object which can have the keys `default` and `all`. Specifying a value for `default` allows you to change the default sidebar title. Specifying a value for `all` allows you to change the sidebar title when the `blogSidebarCount` option is set to `'ALL'`.
+
+Example:
+
+```js
+blogSidebarTitle: { default: 'Recent posts', all: 'All blog posts' },
+```
+
 ## RSS Feed
 
 Docusaurus provides a simple RSS feed for your blog posts. Both RSS and Atom feed formats are supported. This data is automatically to your website page's HTML <HEAD> tag.

diff --git a/lib/core/BlogPostLayout.js b/lib/core/BlogPostLayout.js
@@ -97,6 +97,7 @@ class BlogPostLayout extends React.Component {
   render() {
     let post = this.props.metadata;
     post.path = utils.getPath(post.path, this.props.config.cleanUrl);
+    let blogSidebarTitleConfig = this.props.config.blogSidebarTitle || {};
     return (
       <Site
         className="sideNavVisible"
@@ -124,7 +125,7 @@ class BlogPostLayout extends React.Component {
             </div>
             <div className="blog-recent">
               <a className="button" href={this.props.config.baseUrl + 'blog'}>
-                Recent Posts
+                {blogSidebarTitleConfig.default || 'Recent Posts'}
               </a>
             </div>
           </Container>

diff --git a/lib/core/BlogSidebar.js b/lib/core/BlogSidebar.js
@@ -14,11 +14,12 @@ const MetadataBlog = require('./MetadataBlog.js');
 class BlogSidebar extends React.Component {
   render() {
     let blogSidebarCount = 5;
-    let blogSidebarTitle = 'Recent Posts';
+    let blogSidebarTitleConfig = this.props.config.blogSidebarTitle || {};
+    let blogSidebarTitle = blogSidebarTitleConfig.default || 'Recent Posts';
     if (this.props.config.blogSidebarCount) {
       if (this.props.config.blogSidebarCount == 'ALL') {
         blogSidebarCount = MetadataBlog.length;
-        blogSidebarTitle = 'All Blog Posts';
+        blogSidebarTitle = blogSidebarTitleConfig.all || 'All Blog Posts';
       } else {
         blogSidebarCount = this.props.config.blogSidebarCount;
       }