1.11.x

Translate

Adding a Blog

初始设置

To setup your site's blog, start by creating a blog directory within your repo's website directory.

然后, 在 siteConfig.js 中添加一个指向您博客的 headerLinks:

headerLinks: [
    ...
    { blog: true, label: 'Blog' },
    ...
]

添加文章

To publish in the blog, create a file within the blog directory with a formatted name of YYYY-MM-DD-My-Blog-Post-Title.md. The post date is extracted from the file name.

例如, 文件 website/blog/2017-08-18-Introducing-Docusaurus.md:

---
author: Frank Li
authorURL: https://twitter.com/foobarbaz
authorFBID: 503283835
title: Introducing Docusaurus
---
Lorem Ipsum...

顶部选项

唯一必填项是 title；但是, 我们还提供了添加可选的文章作者信息的功能。

  • author - 作者署名的文本标签。
  • authorURL - The URL associated with the author. This could be a Twitter, GitHub, Facebook account, etc.
  • authorFBID - The Facebook profile ID that is used to fetch the profile picture.
  • authorImageURL - The URL to the author's image. (Note: If you use both authorFBID and authorImageURL, authorFBID will take precedence. Don't include authorFBID if you want authorImageURL to appear.)
  • title - The blog post title.

摘要截取

Use the <!--truncate--> marker in your blog post to represent what will be shown as the summary when viewing all published blog posts. <!--truncate--> 标记以上的内容都会成为摘要。 例如：

---
title: Truncation Example
---
All this will be part of the blog post summary.

Even this.

<!--truncate-->

But anything from here on down will not be.

Not this.

Or this.

修改侧边栏可见的文章数

默认情况下，侧边栏会显示最近的5篇文章。

你可以在 siteConfig.js中添加 blogSidebarCount属性，来配置你的想要展示的文章数。

The available options are an integer representing the number of posts you wish to show or a string with the value 'ALL'.

例如：

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'.

例如：

blogSidebarTitle: { default: 'Recent posts', all: 'All blog posts' },

RSS订阅

Docusaurus provides an RSS feed for your blog posts. Both RSS and Atom feed formats are supported. This data is automatically added to your website page's HTML <HEAD> tag.

A summary of the post's text is provided in the RSS feed up to the <!--truncate-->. If no <!--truncate--> tag is found, then all text up 250 characters are used.

社交按钮

如果想在文章底部显示Facebook与(或)Twitter社交按钮，那么在网站设置的siteConfig.js中配置facebookAppId 与(或) twitter选项。

Advanced Topics

I want to run in "Blog Only" mode.

You can run your Docusaurus site without a landing page and instead have your blog load first.

To do this:

  1. Create a file index.html in website/static/.
  2. Place the contents of the template below into website/static/index.html
  3. Customize the <title> of website/static/index.html
  4. Delete the dynamic landing page website/pages/en/index.js

Now, when Docusaurus generates or builds your site, it will copy the file from static/index.html and place it in the site's main directory. The static file is served when a visitor arrives on your page. When the page loads it will redirect the visitor to /blog.

You can use this template:

<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="refresh" content="0; url=blog/" />
    <script type="text/javascript">
      window.location.href = 'blog/';
    </script>
    <title>Title of Your Blog</title>
  </head>
  <body>
    If you are not redirected automatically, follow this
    <a href="blog/">link</a>.
  </body>
</html>
← DockerCustom Pages →