2019-04-28 23:20:24 -04:00
---
id: blog
title: Blog
---
2019-10-05 15:23:21 -04:00
## Initial setup
To setup your site's blog, start by creating a `blog` directory.
Then, add a navbar link to your blog within `docusaurus.config.js` :
```js
links: [
2019-10-12 17:28:21 -04:00
...
{to: 'blog', label: 'Blog', position: 'left'}, // or position: 'right'
...
2019-10-05 15:23:21 -04:00
]
```
## Adding posts
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.
For example, at `my-website/blog/2019-09-05-hello-docusaurus-v2.md` :
2019-10-12 17:28:21 -04:00
```md
2019-10-05 15:23:21 -04:00
---
title: Welcome Docusaurus v2
author: Dattatreya Tripathy
authorTitle: Contributor of Docusaurus 2
authorURL: https://github.com/dt97
authorTwitter: CuriousDT
tags: [hello, docusaurus-v2]
---
2019-10-12 17:28:21 -04:00
Welcome to this blog. This blog is created with [**Docusaurus 2 alpha** ](https://v2.docusaurus.io/ ).
2019-10-05 15:23:21 -04:00
<!-- truncate -->
This is my first post on Docusaurus 2.
A whole bunch of exploration to follow.
```
## Header options
The only required field is `title` ; however, we provide options to add author information to your blog post as well along with other options.
- `author` - The author name to be displayed.
- `authorURL` - The URL that the author's name will be linked to. This could be a GitHub, Twitter, Facebook account URL, etc.
- `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.
- `tags` - A list of strings to tag to your post.
## Summary truncation
Use the `<!--truncate-->` marker in your blog post to represent what will be shown as the summary when viewing all published blog posts. Anything above `<!--truncate-->` will be part of the summary. For example:
2019-10-29 02:59:24 -04:00
```md {9}
2019-10-05 15:23:21 -04:00
---
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.
```
feat(v2): Implement plugin creating feed for blog posts (#1916)
* feat(v2): Implement feed for blog posts
Fixes: #1698
Test plan:
- added tests
Ran `yarn build` on website with the following config (and disabled blog
from preset-classic):
```js
[
'@docusaurus/plugin-content-blog',
{
path: '../website-1.x/blog',
feedOptions: {
copyright: 'Copy',
type: 'atom',
},
},
],
```
which genereted the following feed:
```xml
<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<id>https://v2.docusaurus.io/blog</id>
<title>Docusaurus Blog</title>
<updated>2018-12-14T00:00:00.000Z</updated>
<generator>https://github.com/jpmonette/feed</generator>
<link rel="alternate" href="https://v2.docusaurus.io/blog"/>
<subtitle>Docusaurus Blog</subtitle>
<icon>https://v2.docusaurus.io/img/docusaurus.ico</icon>
<rights>Copy</rights>
<entry>
<title type="html"><![CDATA[Happy 1st Birthday Slash!]]></title>
<id>Happy 1st Birthday Slash!</id>
<link href="https://v2.docusaurus.io/blog/2018/12/14/Happy-First-Birthday-Slash"/>
<updated>2018-12-14T00:00:00.000Z</updated>
<summary type="html"><]]></summary>
</entry>
<entry>
<title type="html"><![CDATA[Towards Docusaurus 2]]></title>
<id>Towards Docusaurus 2</id>
<link href="https://v2.docusaurus.io/blog/2018/09/11/Towards-Docusaurus-2"/>
<updated>2018-09-11T00:00:00.000Z</updated>
<summary type="html">< over nine months ago as a way to easily build open source documentation websites. Since then, it has amassed over 8,600 GitHub Stars, and is used by many popular open source projects such as [React Native](https://facebook.github.io/react-native/), [Babel](https://babeljs.io/), [Jest](https://jestjs.io/), [Reason](https://reasonml.github.io/) and [Prettier](https://prettier.io/).]]></summary>
</entry>
<entry>
<title type="html"><![CDATA[How I Converted Profilo to Docusaurus in Under 2 Hours]]></title>
<id>How I Converted Profilo to Docusaurus in Under 2 Hours</id>
<link href="https://v2.docusaurus.io/blog/2018/04/30/How-I-Converted-Profilo-To-Docusaurus"/>
<updated>2018-04-30T00:00:00.000Z</updated>
<summary type="html"><![CDATA[> _“Joel and I were discussing having a website and how it would have been great to launch with it. So I challenged myself to add Docusaurus support. It took just over an hour and a half. I'm going to send you a PR with the addition so you can take a look and see if you like it. Your workflow for adding docs wouldn't be much different from editing those markdown files.”_]]></summary>
</entry>
<entry>
<title type="html"><![CDATA[Introducing Docusaurus]]></title>
<id>Introducing Docusaurus</id>
<link href="https://v2.docusaurus.io/blog/2017/12/14/introducing-docusaurus"/>
<updated>2017-12-14T00:00:00.000Z</updated>
<summary type="html"><]]></summary>
</entry>
</feed>
```
* new feedOptions type 'all' and use correct path
2019-11-06 02:45:31 -05:00
## Feed
You can generate RSS/ Atom feed by passing feedOptions.
```ts
feedOptions?: {
type: 'rss' | 'atom' | 'all';
title?: string;
description?: string;
copyright: string;
language?: string; // possible values: http://www.w3.org/TR/REC-html40/struct/dirlang.html#langcodes
};
```
Example usage:
```js {9-12}
// docusaurus.config.js
module.exports = {
// ...
presets: [
[
'@docusaurus/preset-classic',
{
blog: {
feedOptions: {
type: 'all',
copyright: `Copyright © ${new Date().getFullYear()} Facebook, Inc.`
},
},
},
],
],
};
```
2019-10-05 15:23:21 -04:00
## Advanced topics
### Blog-only mode
2019-10-12 17:28:21 -04:00
You can run your Docusaurus 2 site without a landing page and instead have your blog's post list page as the index page. Set the `routeBasePath` to be `'/'` to indicate it's the root path.
2019-10-05 15:23:21 -04:00
2019-10-12 17:28:21 -04:00
**Note:** Make sure there's no `index.js` page in `src/pages` or else there will be two files mapping to the same route!
2019-10-29 02:59:24 -04:00
```js {10}
2019-10-05 15:23:21 -04:00
// docusaurus.config.js
module.exports = {
// ...
presets: [
[
'@docusaurus/preset-classic',
{
blog: {
path: './blog',
2019-10-12 17:28:21 -04:00
routeBasePath: '/', // Set this value to '/'.
2019-10-05 15:23:21 -04:00
},
},
],
],
};
```
2019-07-08 02:14:49 -04:00
<!--
2019-04-28 23:20:24 -04:00
2019-07-08 02:14:49 -04:00
Adding a blog using the blog plugin.
References
---
- [source code ](/packages/docusaurus-plugin-content-blog/src/index.js )
- [v1 doc ](https://docusaurus.io/docs/en/next/adding-blog )
-->