博客
#
初始设置要为您的站点设置博客,请先创建 blog
目录。
然后,在 docusaurus.config.js
内创建指向您博客的链接项。
module.exports = { themeConfig: { // ... navbar: { items: [ // ... {to: 'blog', label: 'Blog', position: 'left'}, // 或 position: 'right' ], }, },};
#
添加文章要发布博文,请在 blog 目录内创建名称类似 YYYY-MM-DD-博文名称.md
的文件。 发帖日期将自动从文件名获取。
下方是 my-website/blog/2019-09-05-hello-docusaurus-v2.md
文件示例:
---title: 欢迎来到 Docusaurus v2author: Joel Marceyauthor_title: Docusaurus 1 创建者之一author_url: https://github.com/JoelMarceyauthor_image_url: https://graph.facebook.com/611217057/picture/?height=200&width=200tags: [hello, docusaurus-v2]description: 这是我在 Docusaurus 2 上的首篇博文。image: https://i.imgur.com/mErPwqL.pnghide_table_of_contents: false---欢迎来到此博客。 此博客使用 [**Docusaurus 2**](https://docusaurus.io/) 搭建。
<!--truncate-->
这是我在 Docusaurus 2 上的首篇博文。
下方是一系列内容。
#
页眉选项页眉中必填项仅为 title
;但是,我们也提供了包括作者信息在内的其他选项。
author
- 要显示的作者名。author_url
- 作者名指向的链接。 这可为 GitHub、Twitter、Facebook 页面等等。author_image_url
- 作者缩略图的链接。author_title
- 作者简介。title
- 博文标题。slug
- 允许自定义博文链接 (/<routeBasePath>/<slug>
)。 支持多种方式:slug: my-blog-post
,slug: /my/path/to/blog/post
,slug: /
。date
- 博文创建时间。 如果未指定,这可以从文件名中提取,如2021-04-15-blog-post.mdx
。 By default, it is the Markdown file creation time.tags
- 一个字符串或对象(包含label
和permalink
两个字符串字段)列表,用于标记博文。draft
- 标识博文为草稿且不应被发布的布尔值标签。 但是,草稿仍将在开发模式中显示。description
- 博文描述,这将被放入<head>
的<meta name="description" content="..."/>
及<meta property="og:description" content="..."/>
中,且可被搜索引擎使用。 若此字段不存在,则其将默认为博文的第一行。keywords
- 关键字元标记, 它将变成<head>
中的<meta name="keywords" content="keyword1,keyword2,..."/>
,被搜索引擎使用。image
- 显示博文链接时所用的缩略图或封面。hide_table_of_contents
- 是否隐藏右侧的目录。 默认情况下为false
。
#
摘要截取在博文中使用 <!--truncate-->
来标记文章摘要。 <!--truncate-->
以上的内容均将成为摘要。 举个例子:
---title: 摘要示例---这些都将作为博文摘要。
甚至包括这一行。
<!--truncate-->
但这一行和这一行下方的内容将不会被截取。
这行不会。
这行也不会。
#
订阅源您可以通过传递 feedOptions 参数来生成 RSS/Atom 订阅源。 默认情况下将自动生成 RSS 及 Atom 订阅源。 要关闭订阅源生成,请将 feedOptions.type
设置为 null
。
feedOptions?: { type?: 'rss' | 'atom' | 'all' | null; title?: string; description?: string; copyright: string; language?: string; // 语言代码请参见:http://www.w3.org/TR/REC-html40/struct/dirlang.html#langcodes};
示例用法:
module.exports = { // ... presets: [ [ '@docusaurus/preset-classic', { blog: { feedOptions: { type: 'all', copyright: `版权所有 © ${new Date().getFullYear()} Facebook, Inc.`, }, }, }, ], ],};
访问订阅源:
您的 RSS 订阅源位于:
https://{您的域名}/blog/rss.xml
Atom 源:
https://{您的域名}/blog/atom.xml
#
进阶议题#
仅博客模式您可将去除您 Docusaurus 2 站点上的着陆页,并将博文列表设置为首页。 将 routeBasePath
设置为 '/'
以指定为根目录。
module.exports = { // ... presets: [ [ '@docusaurus/preset-classic', { docs: false, blog: { path: './blog', routeBasePath: '/', // 将其设置为 '/'。 }, }, ], ],};
caution
别忘记在之后删除 ./src/pages/index.js
处的默认首页,否则两个文件均将映射到相同的路由!
您也可以在博文列表页添加元描述以来进行搜索引擎优化:
module.exports = { // ... presets: [ [ '@docusaurus/preset-classic', { blog: { blogTitle: 'Docusaurus blog!', blogDescription: 'A Docusaurus powered blog!', }, }, ], ],};
#
多个博客默认情况下,经典主题假设一个网站仅有一个博客,故仅有一个博客插件实例。 若您想在单一站点上部署多个博客,这也可以! 您可以在 docusaurus.config.js
中的 plugins
选项中指定其他博客插件来添加博客。
将 routeBasePath
设置为第二个博客的 URL 路由。 请注意,此处的 routeBasePath
应与第一个博客的路由不同,否则将导致路径冲突问题! 此外,请将 path
设置为包含您第二个博客条目的目录路径。
如多实例插件中所述,您需要为每个插件分配唯一 ID。
module.exports = { // ... plugins: [ [ '@docusaurus/plugin-content-blog', { /** * 多实例插件必填。 */ id: 'second-blog', /** * 您网站上博客的 URL 路由。 * *请务必不要*添加斜杠。 */ routeBasePath: 'my-second-blog', /** * 相对于站点目录的文件系统数据路径。 */ path: './my-second-blog', }, ], ],};
As an example, we host a second blog here.