Markdown Features
Docusaurus uses GitHub Flavored Markdown (GFM). Find out more about Docusaurus-specific fields when writing Markdown.
Head-ere Markdown
Documente
Documentele utilizează următoarele câmpuri markdown header ce sunt anexate printr-o linie ---
pe orice parte:
id
: A unique document id. If this field is not present, the document's id
will default to its file name (without the extension).
title
: The title of your document. If this field is not present, the document's title
will default to its id
.
hide_title
: Whether to hide the title at the top of the doc.
sidebar_label
: The text shown in the document sidebar and in the next/previous button for this document. If this field is not present, the document's sidebar_label
will default to its title
.
De exemplu:
---
id: doc1
titlu: Documentul meu
sidebar_label: Document
---
Documentele cu versiuni au id-urile alterate pentru a include numărul versiunii când este copiat. Noul id
este versiune-${version}-${id}
unde ${version}
este numărul versiunii acelui document și ${id}
este id
-ul original. Adițional, documentele cu versiuni au un câmp original_id
adăugat cu id-ul original al documentului.
De exemplu:
---
id: versiune-1.0.0-doc1
titlu: Documentul meu
sidebar_label: Document
original_id: doc1
---
custom_edit_url
: The URL for editing this document. If this field is not present, the document's edit URL will fall back to editUrl
from optional fields of siteConfig.js
. See siteConfig.js docs for more information.
De exemplu:
---
id: doc-markdown
title: Markdown Features
custom_edit_url: https://github.com/facebook/docusaurus/edit/master/docs/api-doc-markdown.md
---
Post-uri pentru Blog
Blog posts use the following markdown header fields that are enclosed by a line ---
on either side:
titlu
: Titlul acestui post pentru blog.
author
: The author of this blog post. If this field is omitted, no author name will be shown.
authorURL
: 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.
autorFBID
: Id-ul de Facebook al autorului, folosit doar pentru a lua poza de profil a autorului pentru a fi afișată odată cu post-area de pe blog. Dacă acest câmp este omis, autorul nu va avea nici o imagine afișată pentru post-area de pe blog.
De exemplu:
---
titlu: Prima mea post-are pe blog
autor: Frank Li
URLautor: http://twitter.com/franchementli
autorFBID: 100002976521003
---
Caracteristici suplimentare
Docusaurus suportă niște caracteristici suplimentare când documentația este scrisă în markdown.
Link-uirea cu alte Documente
You can use relative URLs to other documentation files which will automatically get converted to the corresponding HTML links when they get rendered.
Exemplu:
[Acesta link-uiește către alt document](celălalt-document.md)
Acest markdown va fi convertit automat într-un link pentru /documente/celălalt-document.html
(sau la link-ul cu traducerea/versiunea corespunzătoare) odată ce va fi redată.
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.
Link-uirea către Imagini sau Alte Asset-uri
Static assets can be linked to in the same way that documents are, using relative URLs. Asset-urile statice utilizate în documente și bloguri ar trebuii să se ducă în documente/asset-uri
și siteweb/blog/asset-uri
, respectiv. Markdown-ul va fi convertit în căile correcte ale link-urilor astfel încât aceste căi vor funcționa pentru documente în toate limbile și versiunile.
Exemplu:
![alt-text](asset-uri/imaginea-documentului.png)
Generând Cuprinsul
You can make an auto-generated list of links, which can be useful as a table of contents for API docs.
In your markdown file, insert a line with the text ``. Scrie-ți documentația folosind header-e h3
pentru fiecare funcție în interiorul unui bloc de cod. These will be found by Docusaurus and a list of links to these sections will inserted at the text <AUTOGENERATED_TABLE_OF_CONTENTS>
.
Exemplu:
### `docusaurus.function(a, b)`
Text describing my function
### `docdoc(file)`
Text describing my function
va duce la un cuprins al funcțiilor:
- `docusaurus.function(a, b)`
- `docdoc(file)`
și fiecare funcție va link-ui către secțiunile corespunzătoare din pagină.
Language-specific Code Tabs
Display code in multiple programming languages using code tabs. First, mark the start and end of a code tabs group, by using <!-- DOCUSAURUS_CODE_TABS -->
and <!-- END_DOCUSAURUS_CODE_TABS -->
respectively in your markdown. Then start each tab with <!--[TAB_TITLE]-->
.
Adding the following code to your Markdown file:
produces this:
console.log('Hello, world!');
print('Hello, world!')
#include <stdio.h>
int main() {
printf("Hello World!");
return 0;
}
program HelloWorld;
begin
WriteLn('Hello, world!');
end.
Syntax Highlighting
Syntax highlighting is enabled by default on fenced code blocks. The language should be detected automatically, but you can sometimes get better results by specifying the language. You can do so using an info string, following the three opening backticks. The following JavaScript example...
```js
ReactDOM.render(<h1>Hello, world!</h1>, document.getElementById('root'));
```
...would be rendered with syntax highlighting like so:
ReactDOM.render(<h1>Hello, world!</h1>, document.getElementById('root'));
Highlighting is provided by Highlight.js using the theme specified in your siteConfig.js
file as part of the highlight
key:
{
...
highlight: {
theme: 'default'
}
...
}
You can find the full list of supported themes in the Highlight.js styles
directory.
Registering additional languages
While Highlight.js provides support for many popular languages out of the box, you may find the need to register additional language support. For these cases, we provide an escape valve by exposing the hljs
constant as part of the highlight
config key. This in turn allows you to call registerLanguage
:
{
...
highlight: {
theme: 'default',
hljs: function(hljs) {
hljs.registerLanguage('galacticbasic', function(hljs) {
// ...
});
}
}
}
Using Prism as additional syntax highlighter
You can also opt to use Prism to syntax highlight certain languages available in the list here. Include those languages in usePrism
field in your siteConfig.js
Exemplu:
// siteConfig.js
usePrism: ['jsx']
Notice that the code block below uses JSX syntax highlighting from Prism.
class Example extends React.Component {
render() {
return (
<View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
<Text>Docusaurus</Text>
<Button
title="Click me"
onPress={() => this.props.navigation.push('Docusaurus')}
/>
</View>
);
}
}
Adding Copy Code Buttons
Docusaurus allows for adding buttons to copy code within fenced code blocks. Please follow the instructions here to add "Copy" buttons to your code blocks.