From 4af25cd597311aaec863c84971ead0e2a79c3852 Mon Sep 17 00:00:00 2001 From: Xuqian Date: Thu, 30 Jul 2020 21:41:15 +0800 Subject: [PATCH] feat(v2): support custom description for blog-only mode (#2359) * feat: support custom description on blog page resolve conflicts * feat(v2): allow additional props to pass to route components resolve conflicts * Update blogDescription feature * Update doc for blogDescription * Remove test blogDescription config * Fix blogDescription schema validation * Fix minor errors Co-authored-by: Xuqian --- .../src/index.ts | 1 + .../src/pluginOptionSchema.ts | 4 ++++ .../src/types.ts | 2 ++ .../src/theme/BlogListPage/index.tsx | 6 +++--- website/docs/blog.md | 18 ++++++++++++++++++ website/docs/using-plugins.md | 4 ++++ 6 files changed, 32 insertions(+), 3 deletions(-) diff --git a/packages/docusaurus-plugin-content-blog/src/index.ts b/packages/docusaurus-plugin-content-blog/src/index.ts index 1b4c64a6a5..59cf43b24e 100644 --- a/packages/docusaurus-plugin-content-blog/src/index.ts +++ b/packages/docusaurus-plugin-content-blog/src/index.ts @@ -133,6 +133,7 @@ export default function pluginContentBlog( page < numberOfPages - 1 ? blogPaginationPermalink(page + 1) : null, + blogDescription: options.blogDescription, }, items: blogPosts .slice(page * postsPerPage, (page + 1) * postsPerPage) diff --git a/packages/docusaurus-plugin-content-blog/src/pluginOptionSchema.ts b/packages/docusaurus-plugin-content-blog/src/pluginOptionSchema.ts index ae20e8ad38..53ef3c6261 100644 --- a/packages/docusaurus-plugin-content-blog/src/pluginOptionSchema.ts +++ b/packages/docusaurus-plugin-content-blog/src/pluginOptionSchema.ts @@ -20,6 +20,7 @@ export const DEFAULT_OPTIONS = { blogTagsListComponent: '@theme/BlogTagsListPage', blogPostComponent: '@theme/BlogPostPage', blogListComponent: '@theme/BlogListPage', + blogDescription: 'Blog', postsPerPage: 10, include: ['*.md', '*.mdx'], routeBasePath: 'blog', @@ -42,6 +43,9 @@ export const PluginOptionSchema = Joi.object({ blogTagsPostsComponent: Joi.string().default( DEFAULT_OPTIONS.blogTagsPostsComponent, ), + blogDescription: Joi.string() + .allow('') + .default(DEFAULT_OPTIONS.blogDescription), showReadingTime: Joi.bool().default(DEFAULT_OPTIONS.showReadingTime), remarkPlugins: Joi.array() .items( diff --git a/packages/docusaurus-plugin-content-blog/src/types.ts b/packages/docusaurus-plugin-content-blog/src/types.ts index 3de088fb48..5e57fe1e49 100644 --- a/packages/docusaurus-plugin-content-blog/src/types.ts +++ b/packages/docusaurus-plugin-content-blog/src/types.ts @@ -29,6 +29,7 @@ export interface PluginOptions { blogPostComponent: string; blogTagsListComponent: string; blogTagsPostsComponent: string; + blogDescription: string; remarkPlugins: ([Function, object] | Function)[]; rehypePlugins: string[]; truncateMarker: RegExp; @@ -67,6 +68,7 @@ export interface BlogPaginatedMetadata { totalCount: number; previousPage: string | null; nextPage: string | null; + blogDescription: string; } export interface BlogPaginated { diff --git a/packages/docusaurus-theme-classic/src/theme/BlogListPage/index.tsx b/packages/docusaurus-theme-classic/src/theme/BlogListPage/index.tsx index 81de70722e..111c884815 100644 --- a/packages/docusaurus-theme-classic/src/theme/BlogListPage/index.tsx +++ b/packages/docusaurus-theme-classic/src/theme/BlogListPage/index.tsx @@ -13,7 +13,7 @@ import BlogPostItem from '@theme/BlogPostItem'; import BlogListPaginator from '@theme/BlogListPaginator'; type Props = { - metadata: {permalink: string; title: string}; + metadata: {permalink: string; title: string; blogDescription: string}; items: {content}[]; }; @@ -24,9 +24,9 @@ function BlogListPage(props: Props): JSX.Element { } = useDocusaurusContext(); const isBlogOnlyMode = metadata.permalink === '/'; const title = isBlogOnlyMode ? siteTitle : 'Blog'; - + const {blogDescription} = metadata; return ( - +
diff --git a/website/docs/blog.md b/website/docs/blog.md index 0e0e032e08..92a156b1e5 100644 --- a/website/docs/blog.md +++ b/website/docs/blog.md @@ -163,6 +163,24 @@ Don't forget to delete the existing homepage at `./src/pages/index.js` or else t ::: +You can also add meta description to the blog list page for better SEO: + +```js {8} title="docusaurus.config.js" +module.exports = { + // ... + presets: [ + [ + '@docusaurus/preset-classic', + { + blog: { + blogDescription: 'A docusaurus powered blog!', + }, + }, + ], + ], +}; +``` + ### Multiple blogs By default, the classic theme assumes only one blog per website and hence includes only one instance of the blog plugin. If you would like to have multiple blogs on a single website, it's possible too! You can add another blog by specifying another blog plugin in the `plugins` option for `docusaurus.config.js`. diff --git a/website/docs/using-plugins.md b/website/docs/using-plugins.md index ed4589fd38..3650aca79c 100644 --- a/website/docs/using-plugins.md +++ b/website/docs/using-plugins.md @@ -200,6 +200,10 @@ module.exports = { */ editUrl: 'https://github.com/facebook/docusaurus/edit/master/website/blog/', + /** + * Blog page meta description for better SEO + */ + blogDescription: 'Blog', /** * URL route for the blog section of your site. * *DO NOT* include a trailing slash.