mirror of
https://github.com/facebook/docusaurus.git
synced 2025-05-12 00:27:21 +02:00
30 lines
No EOL
10 KiB
HTML
30 lines
No EOL
10 KiB
HTML
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>Markdown Features · Docusaurus</title><meta name="viewport" content="width=device-width"/><meta property="og:title" content="Markdown Features · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/index.html"/><meta property="og:description" content="## Markdown Headers"/><meta name="robots" content="noindex"/><link rel="shortcut icon" href="/img/favicon.png"/><link rel="stylesheet" href="/css/main.css"/><script async="" defer="" src="https://buttons.github.io/buttons.js"></script></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/"><img src="/img/docusaurus.svg"/><h2>Docusaurus</h2></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/docs/installation.html" target="_self">Docs</a></li><li><a href="/en/help.html" target="_self">Help</a></li><li><a href="https://github.com/facebookexperimental/docusaurus" target="_self">GitHub</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><i></i></div><h2><i>›</i><span>API</span></h2></div><div class="navGroups"><div class="navGroup navGroupActive"><h3>Getting Started</h3><ul><li class="navListItem"><a class="navItem" href="/docs/installation.html#content">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/site-preparation.html#content">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/site-creation.html#content">Creating your site</a></li></ul></div><div class="navGroup navGroupActive"><h3>Guides</h3><ul><li class="navListItem"><a class="navItem" href="/docs/custom-pages.html#content">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/navigation.html#content">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/blog.html#content">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/translation.html#content">Translations</a></li><li class="navListItem"><a class="navItem" href="/docs/search.html#content">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/versioning.html#content">Versioning</a></li></ul></div><div class="navGroup navGroupActive"><h3>API</h3><ul><li class="navListItem"><a class="navItem" href="/docs/commands.html#content">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/api-pages.html#content">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/site-config.html#content">siteConfig.js</a></li><li class="navListItem navListItemActive"><a class="navItem navItemActive" href="/docs/doc-markdown.html#content">Markdown Features</a></li></ul></div></div></section></div><script>
|
||
var toggler = document.getElementById('navToggler');
|
||
var nav = document.getElementById('docsNav');
|
||
toggler.onclick = function() {
|
||
nav.classList.toggle('docsSliderActive');
|
||
};
|
||
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebookexperimental/docusaurus/edit/master/docs/api-doc-markdown.md" target="_blank">Edit this Doc</a><h1>Markdown Features</h1></header><article><div><h2><a class="anchor" name="markdown-headers"></a>Markdown Headers <a class="hash-link" href="#markdown-headers">#</a></h2><h2><a class="anchor" name="documents"></a>Documents <a class="hash-link" href="#documents">#</a></h2><p>Documents use the following markdown header fields that are enclosed by a line <code>---</code> on either side:</p><p><code>id</code>: A unique document id. If this field is not present, the document's <code>id</code> will default to it's file name (without the extension).</p><p><code>title</code>: The title of your document. If this field is not present, the document's <code>title</code> will default to it's <code>id</code>.</p><p><code>sidebar_label</code>: The text shown in the document sidebar for this document. If this field is not present, the document's <code>sidebar_label</code> will default to it's <code>title</code>.</p><p>For example:</p><pre class="prism language-markup">---
|
||
id: doc1
|
||
title: My Document
|
||
sidebar_label: Document
|
||
---</pre><p>Versioned documents have their ids altered to include the version number when they get copied. The new <code>id</code> is <code>version-${version}-${id}</code> where <code>${version}</code> is the version number of that document and <code>${id}</code> is the original <code>id</code>. Additionally, versioned documents get an added <code>original_id</code> field with the original document id.</p><p>For example:</p><pre class="prism language-markup">---
|
||
id: version-1.0.0-doc1
|
||
title: My Document
|
||
sidebar_label: Document
|
||
original_id: doc1
|
||
---</pre><h2><a class="anchor" name="blog-posts"></a>Blog Posts <a class="hash-link" href="#blog-posts">#</a></h2><p>Blog Posts use the following markdown header fields that are enclosed by a line <code>---</code> on either side:</p><p><code>title</code>: The title of this blog post.</p><p><code>author</code>: The author of this blog post. If this field is omitted, no author name will be shown.</p><p><code>authorURL</code>: A page to link to when a site user clicks the author's name. If this field is omitted, the author's name will not link to anything.</p><p><code>authorFBID</code>: The author's Facebook id, used only to get the author's profile picture to display with the blog post. If this field is omitted, no author picture will be shown for the blog post.</p><p>For example:</p><pre class="prism language-markup">---
|
||
title: My First Blog Post
|
||
author: Frank Li
|
||
authorURL: http://twitter.com/franchementli
|
||
authorFBID: 100002976521003
|
||
---</pre><h2><a class="anchor" name="extra-features"></a>Extra Features <a class="hash-link" href="#extra-features">#</a></h2><p>Docusaurus supports some extra features when writing documentation in markdown.</p><h2><a class="anchor" name="linking-other-documents"></a>Linking other Documents <a class="hash-link" href="#linking-other-documents">#</a></h2><p>You can use relative urls to other documentation files which will automatically get converted to the corresponding html links when they get rendered.</p><p>Example:</p><pre class="prism language-markdown"><span class="token url">[This links to another document](other-document.md)</span></pre><p>This markdown will automatically get converted into a link to <code>/docs/other-document.html</code> (or the appropriately translated/versioned link) once it gets rendered.</p><p>This can help when you want to navigate through docs on GitHub since the links there will be functional links to other documents (still on GitHub), but the documents will have the correct html links when they get rendered.</p><h2><a class="anchor" name="linking-to-images-and-other-assets"></a>Linking to Images and Other Assets <a class="hash-link" href="#linking-to-images-and-other-assets">#</a></h2><p>Static assets can be linked to in the same way that documents are, using relative urls. Static assets used in documents and blogs should go into <code>docs/assets</code> and <code>website/blog/assets</code>, respectively. The markdown will get converted into correct link paths so that these paths will work for documents of all languages and versions.</p><p>Example:</p><pre class="prism language-markdown"><span class="token url"></span></pre><h2><a class="anchor" name="generating-table-of-contents"></a>Generating Table of Contents <a class="hash-link" href="#generating-table-of-contents">#</a></h2><p>You can make an autogenerated list of links, which can be useful as a table of contents for API docs.</p><p>In your markdown file, insert a line with the text <<code>AUTOGENERATED_TABLE_OF_CONTENTS></code>. Write your documentation using <code>h3</code> headers for each function inside a code block. These will be found by Docusaurus and a list of links to these sections will inserted at the text <<code>AUTOGENERATED_TABLE_OF_CONTENTS></code>.</p><p>Example:</p><pre class="prism language-markdown"><span class="token title important"><span class="token punctuation">###</span> </span><span class="token code keyword">`docusaurus.function(a, b)`</span>
|
||
|
||
Text describing my function
|
||
|
||
|
||
<span class="token title important"><span class="token punctuation">###</span> </span><span class="token code keyword">`docdoc(file)`</span>
|
||
|
||
Text describing my function</pre><p>will lead to a table of contents of the functions:</p><pre class="prism language-markdown">- <span class="token code keyword">`docusaurus.function(a, b)`</span>
|
||
- <span class="token code keyword">`docdoc(file)`</span></pre><p>and each function will link to their corresponding sections in the page.</p></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="site-config.html#content">← Previous</a></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div><h5>Docs</h5><a href="
|
||
/docs/installation.html">Getting Started</a></div><div><h5>Community</h5><a href="/en/users.html">User Showcase</a></div><div><h5>More</h5><a href="https://github.com/facebookexperimental/docusaurus">GitHub</a><a class="github-button" href="https://github.com/facebookexperimental/docusaurus" data-icon="octicon-star" data-count-href="/facebookexperimental/docusaurus/stargazers" data-count-api="/repos/facebookexperimental/docusaurus#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2017 Facebook Inc.</section></footer></div></body></html> |