diff --git a/website/docs/configuration.md b/website/docs/configuration.md
index bbf5adb7d191..48b4ca0a2e4a 100644
--- a/website/docs/configuration.md
+++ b/website/docs/configuration.md
@@ -7,38 +7,36 @@ Docusaurus has a unique take on configurations. We encourage you to congregate i
Keeping a well-maintained `docusaurus.config.js` helps you, your collaborators, and your open source contributors be able to focus on documentation while still being able to easily customize fields.
-For reference to each of the configurable fields, you may refer to the API reference of [docusaurus.config.js](docusaurus.config.js.md).
-
## What goes into `docusaurus.config.js`?
You should not have to write your `docusaurus.config.js` from scratch even if you are developing your site. All templates come with a `docusaurus.config.js` at root that includes the necessary data for the initial site.
However, it can be helpful if you have a high-level understanding of how the configurations are designed and implemented.
-The configurations can be categorized into:
+The high-level overview of Docusaurus configuration can be categorized into:
- [Site Metadata](#site-metadata)
- [Deployment Configurations](#deployment-configurations)
- [Themes, Plugins, and Presets configurations](#themes-plugins-and-presets-configurations)
- [Custom Configurations](#custom-configurations)
+For exact reference to each of the configurable fields, you may refer to [**docusaurus.config.js API reference**](docusaurus.config.js.md).
+
### Site metadata
-Site metadata contains the essential global metadata such as titles and `favicon`.
+Site metadata contains the essential global metadata such as `title`, `url`, `baseUrl` and `favicon`.
-They are used by your website in a number of places such as your site's title and headings, browser tab icon, social sharing (Facebook, Twitter) information and for search engine optimization (SEO).
+They are used in a number of places such as your site's title and headings, browser tab icon, social sharing (Facebook, Twitter) information or even to generate the correct path to serve your static files.
### Deployment configurations
-Deployment configurations are used when you deploy your site with Docusaurus' `deploy` command. The related fields are:
+Deployment configurations such as `projectName` and `organizationName` are used when you deploy your site with Docusaurus' `deploy` command.
-
+It is recommended to check the [deployment docs](deployment.md) for more information.
-
+### Themes, Plugins, and Presets configurations
-You may also check the [deployment docs](deployment.md) for more information about the fields.
-### Themes, Plugins, and Presets configurations
_This section is a work in progress. [Welcoming PRs](https://github.com/facebook/docusaurus/issues/1640)._
@@ -73,27 +71,20 @@ module.exports = {
## Accessing configuration from components
-Your configuration object will be made available to all the components of your site. And you may access them via context as `siteConfig`:
+Your configuration object will be made available to all the components of your site. And you may access them via React context as `siteConfig`.
+
+Basic Example:
```jsx
import React from 'react';
-import Head from '@docusaurus/Head';
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
-const Layout = props => {
+const Hello = () => {
const context = useDocusaurusContext();
const {siteConfig = {}} = context;
- const {title, tagline, seo} = siteConfig;
-
- return (
-
-
- {description && }
-
- {title}
- {tagline}
-
- );
+ const {title, tagline} = siteConfig;
+
+ return {`${title} · ${tagline}`}
;
};
```
diff --git a/website/docs/docusaurus.config.js.md b/website/docs/docusaurus.config.js.md
index 3cc3d8eac9bb..f772ab482322 100644
--- a/website/docs/docusaurus.config.js.md
+++ b/website/docs/docusaurus.config.js.md
@@ -1,13 +1,9 @@
---
id: docusaurus.config.js
title: docusaurus.config.js
+description: API reference for Docusaurus configuration file.
---
-
-
## Overview
`docusaurus.config.js` contains configurations for your site and is placed in the root directory of your site.
@@ -18,7 +14,7 @@ title: docusaurus.config.js
- Type: `string`
-Title is used in a number of places in your site including the title for the web page, headings, etc.
+Title for your website.
```js
// docusaurus.config.js
@@ -31,7 +27,7 @@ module.exports = {
- Type: `string`
-Tagline is used in a number of places in your site including the title for the web page, sub headings, etc.
+The tagline for your website.
```js
// docusaurus.config.js
@@ -45,7 +41,16 @@ module.exports = {
- Type: `string`
-If you use an official template, your site will be generated with the following directory
+URL for site favicon. Example:
+
+```js
+// docusaurus.config.js
+module.exports = {
+ favicon: 'https://v2.docusaurus.io/favicon.ico',
+};
+```
+
+You can also use the favicon URL relative to the `static` directory of your site. For example, your site has the following directory structure:
```bash
.
@@ -56,7 +61,7 @@ If you use an official template, your site will be generated with the following
└── favicon.ico
```
-And your generated `docusaurus.config.js` will contain this the field for your favicon URL relative to the `static` directory of your site.
+So you can refer it like below:
```js
// docusaurus.config.js
@@ -65,15 +70,11 @@ module.exports = {
};
```
-**Note**: It does accept external nor absolute url.
-
### `url`
-
-
- Type: `string`
-If you use GitHub Pages, this will be the URL for your GitHub Page's user/organization page, commonly https://_username_.github.io.
+URL for your website. This can also be considered the top-level hostname. For example, `https://facebook.github.io` is the URL of https://facebook.github.io/metro/, and `https://docusaurus.io` is the URL for https://docusaurus.io. This field is related to the [baseUrl](#baseurl) field.
```js
// docusaurus.config.js
@@ -86,7 +87,7 @@ module.exports = {
- Type: `string`
-Base URL for your project. For projects hosted on GitHub pages, it follows the format "/_projectName_/". For https://github.com/facebook/docusaurus, `baseUrl` is `/docusaurus/`.
+Base URL for your site. This can also be considered the path after the host. For example, `/metro/` is the baseUrl of https://facebook.github.io/metro/. For URLs that have no path, the baseUrl should be set to `/`. This field is related to the [url](#url) field.
```js
// docusaurus.config.js
@@ -147,6 +148,8 @@ An object containing data needed by the theme you use.