mirror of
https://github.com/facebook/docusaurus.git
synced 2025-05-10 15:47:23 +02:00
320 lines
No EOL
44 KiB
HTML
320 lines
No EOL
44 KiB
HTML
<!DOCTYPE html><html lang="ru"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Navigation and Sidebars · Docusaurus</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta name="description" content="## Ссылки на документы сайта"/><meta name="docsearch:version" content="1.14.4"/><meta name="docsearch:language" content="ru"/><meta property="og:title" content="Navigation and Sidebars · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="## Ссылки на документы сайта"/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
|
||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
|
||
|
||
ga('create', 'UA-44373548-31', 'auto');
|
||
ga('send', 'pageview');
|
||
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
addBackToTop(
|
||
{"zIndex":100}
|
||
)
|
||
});
|
||
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ru"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ru/versions"><h3>1.14.4</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ru/installation" target="_self">Документация</a></li><li class=""><a href="/docs/ru/tutorial-setup" target="_self">Руководство</a></li><li class=""><a href="/ru/users" target="_self">Пользователи</a></li><li class=""><a href="/blog/" target="_self">Блог</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>Русский</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/navigation">English</a></li><li><a href="/docs/fr/navigation">Français</a></li><li><a href="/docs/ko/navigation">한국어</a></li><li><a href="/docs/pt-BR/navigation">Português (Brasil)</a></li><li><a href="/docs/ro/navigation">Română</a></li><li><a href="/docs/zh-CN/navigation">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">Помочь с переводом</a></li></ul></div></li><script>
|
||
const languagesMenuItem = document.getElementById("languages-menu");
|
||
const languagesDropDown = document.getElementById("languages-dropdown");
|
||
languagesMenuItem.addEventListener("click", function(event) {
|
||
event.preventDefault();
|
||
|
||
if (languagesDropDown.className == "hide") {
|
||
languagesDropDown.className = "visible";
|
||
} else {
|
||
languagesDropDown.className = "hide";
|
||
}
|
||
});
|
||
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i>›</i><span>Руководство</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Начало работы<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ru/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Руководство<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ru/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/search">Enabling Search</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ru/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/translation">Translations & Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ru/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ru/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
|
||
var coll = document.getElementsByClassName('collapsible');
|
||
var checkActiveCategory = true;
|
||
for (var i = 0; i < coll.length; i++) {
|
||
var links = coll[i].nextElementSibling.getElementsByTagName('*');
|
||
if (checkActiveCategory){
|
||
for (var j = 0; j < links.length; j++) {
|
||
if (links[j].classList.contains('navListItemActive')){
|
||
coll[i].nextElementSibling.classList.toggle('hide');
|
||
coll[i].childNodes[1].classList.toggle('rotate');
|
||
checkActiveCategory = false;
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
|
||
coll[i].addEventListener('click', function() {
|
||
var arrow = this.childNodes[1];
|
||
arrow.classList.toggle('rotate');
|
||
var content = this.nextElementSibling;
|
||
content.classList.toggle('hide');
|
||
});
|
||
}
|
||
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
|
||
createToggler('#tocToggler', 'body', 'tocActive');
|
||
|
||
var headings = document.querySelector('.toc-headings');
|
||
headings && headings.addEventListener('click', function(event) {
|
||
var el = event.target;
|
||
while(el !== headings){
|
||
if (el.tagName === 'A') {
|
||
document.body.classList.remove('tocActive');
|
||
break;
|
||
} else{
|
||
el = el.parentNode;
|
||
}
|
||
}
|
||
}, false);
|
||
|
||
function createToggler(togglerSelector, targetSelector, className) {
|
||
var toggler = document.querySelector(togglerSelector);
|
||
var target = document.querySelector(targetSelector);
|
||
|
||
if (!toggler) {
|
||
return;
|
||
}
|
||
|
||
toggler.onclick = function(event) {
|
||
event.preventDefault();
|
||
|
||
target.classList.toggle(className);
|
||
};
|
||
}
|
||
});
|
||
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ru" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Navigation and Sidebars</h1></header><article><div><span><h2><a class="anchor" aria-hidden="true" id="ссылки-на-документы-сайта"></a><a href="#ссылки-на-документы-сайта" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Ссылки на документы сайта</h2>
|
||
<p>Если вы желаете сделать ссылку на другой документ в своем каталоге <code>docs</code> (или по другому адресу, указанному вами в <a href="https://docusaurus.io/docs/en/site-config.html#optional-fields">необязательном параметре <code>customDocsPath</code></a> в настройках сайта), просто используйте его наименование.</p>
|
||
<p>Например, если в документе <code>doc2.md</code> требуется сослаться на документ <code>doc1.md</code>:</p>
|
||
<pre><code class="hljs css language-md">Я ссылаюсь на [<span class="hljs-string">document</span>](<span class="hljs-link">doc1.md</span>).
|
||
</code></pre>
|
||
<h2><a class="anchor" aria-hidden="true" id="связывание-документов"></a><a href="#связывание-документов" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Связывание документов</h2>
|
||
<p>Новые файлы markdown внутри каталога <code>docs</code> будут отображаться как страницы на веб-сайте. Ссылки на эти документы создаются, в первую очередь, с помощью поля <code>id</code> в заголовке документа. Если поле <code>id</code> не указано, то для создания ссылки будет использовано имя файла.</p>
|
||
<p>Например, создание пустого файла с именем <code>docs/getting-started.md</code> приведет к появлению новой страницы с URL-адресом <code>/docs/getting-started.html</code>.</p>
|
||
<p>Предположим, что вы добавили в свой документ:</p>
|
||
<pre><code class="hljs css language-yaml"><span class="hljs-meta">---</span>
|
||
<span class="hljs-attr">id:</span> <span class="hljs-string">intro</span>
|
||
<span class="hljs-attr">title:</span> <span class="hljs-string">Начало</span> <span class="hljs-string">работы</span>
|
||
<span class="hljs-meta">---</span>
|
||
|
||
<span class="hljs-string">Мой</span> <span class="hljs-string">новый</span> <span class="hljs-string">контент...</span>
|
||
</code></pre>
|
||
<p>Если вы укажите поле <code>id</code> в заголовке файла markdown, доступ к документу будет осуществляться с URL-адреса в форме <code>/docs/intro.html</code>.</p>
|
||
<blockquote>
|
||
<p>Вам нужно добавить поле <code>id</code>, чтобы иметь возможность добавить документ в боковую панель.</p>
|
||
</blockquote>
|
||
<h2><a class="anchor" aria-hidden="true" id="добавление-ссылок-на-документы-в-боковую-панель"></a><a href="#добавление-ссылок-на-документы-в-боковую-панель" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Добавление ссылок на документы в боковую панель</h2>
|
||
<p>Много раз вам может потребоваться добавить документ в боковую панель, которая будет связана с одним из заголовков в навигационной панели в верхней части вашего веб-сайта. Наиболее распространенная боковая панель - та, что появляется при инициализации Docusaurus - боковая панель <code>docs</code>.</p>
|
||
<blockquote>
|
||
<p>«docs» это просто название. Оно не несет никакого дополнительного смысла. Вы можете изменить его своему пожеланию.</p>
|
||
</blockquote>
|
||
<p>Вы можете настроить содержимое боковой панели, а также порядок документов в ней в файле <code>website/sidebars.json</code>.</p>
|
||
<blockquote>
|
||
<p>Пока вы не добавите свои документы в <code>website/sidebars.json</code>, они будут доступны только по прямому URL-адресу. Документы не будут показаны ни в одной боковой панели.</p>
|
||
</blockquote>
|
||
<p>Внутри <code>sidebars.json</code> добавьте значение <code>id</code>, которое вы использовали в заголовке документа, в секцию sidebar/category. В примере ниже, <code>docs</code> это наименование боковой панели, а <code>Getting Started</code> - наименование категории внутри боковой панели.</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-string">"docs"</span>: {
|
||
<span class="hljs-string">"Getting Started"</span>: [
|
||
<span class="hljs-string">"getting-started"</span>
|
||
],
|
||
...
|
||
},
|
||
...
|
||
}
|
||
</code></pre>
|
||
<p>Или вы можете создать новую категорию в боковой панели:</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-string">"docs"</span>: {
|
||
<span class="hljs-string">"Моя новая категория"</span>: [
|
||
<span class="hljs-string">"getting-started"</span>
|
||
],
|
||
...
|
||
},
|
||
...
|
||
}
|
||
</code></pre>
|
||
<p>Однако, для документа, расположенного в подкаталоге docs, как в примере ниже:</p>
|
||
<pre><code class="hljs css language-bash">docs
|
||
└── dir1
|
||
└── getting-started.md
|
||
</code></pre>
|
||
<p>Вам следует предоставить поле <code>directory/id</code> вместо поля <code>id</code> в <code>sidebars.json</code>.</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-string">"docs"</span>: {
|
||
<span class="hljs-string">"Моя новая категория"</span>: [
|
||
<span class="hljs-string">"dir1/getting-started"</span>
|
||
],
|
||
...
|
||
},
|
||
...
|
||
}
|
||
</code></pre>
|
||
<h3><a class="anchor" aria-hidden="true" id="добавление-подкатегорий"></a><a href="#добавление-подкатегорий" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Добавление подкатегорий</h3>
|
||
<p>В боковую панель можно добавлять подкатегории. Вместо использования идентификаторов как содержимого массива категорий, как в предыдущих примерах, вы можете передать объект, в котором ключи будут наименованием подкатегории, а значение - массивом идентификаторов для нее.</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-string">"docs"</span>: {
|
||
<span class="hljs-string">"My Example Category"</span>: [
|
||
<span class="hljs-string">"examples"</span>,
|
||
{
|
||
<span class="hljs-string">"type"</span>: <span class="hljs-string">"subcategory"</span>,
|
||
<span class="hljs-string">"label"</span>: <span class="hljs-string">"My Example Subcategory"</span>,
|
||
<span class="hljs-string">"ids"</span>: [
|
||
<span class="hljs-string">"my-examples"</span>,
|
||
...
|
||
]
|
||
},
|
||
{
|
||
<span class="hljs-string">"type"</span>: <span class="hljs-string">"subcategory"</span>,
|
||
<span class="hljs-string">"label"</span>: <span class="hljs-string">"My Next Subcategory"</span>,
|
||
<span class="hljs-string">"ids"</span>: [
|
||
<span class="hljs-string">"some-other-examples"</span>
|
||
]
|
||
},
|
||
<span class="hljs-string">"even-more-examples"</span>,
|
||
...
|
||
],
|
||
...
|
||
}
|
||
}
|
||
|
||
<span class="hljs-comment">/*
|
||
В результате будет создано:
|
||
|
||
- My Example Category
|
||
- examples
|
||
- My Example Subcategory
|
||
- my-examples
|
||
...
|
||
- My Next Subcategory
|
||
- some-other-examples
|
||
- even-more-examples
|
||
...
|
||
*/</span>
|
||
</code></pre>
|
||
<h3><a class="anchor" aria-hidden="true" id="добавление-новых-боковых-панелей"></a><a href="#добавление-новых-боковых-панелей" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Добавление новых боковых панелей</h3>
|
||
<p>Вы также можете поместить документ в новую боковую панель. В следующем примере мы создаем боковую панель <code>examples-sidebar</code> в файле <code>sidebars.json</code>, которая включает категорию <code>My Example Category</code>, содержащую документ с <code>id</code> равным <code>my-examples</code>.</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-string">"examples-sidebar"</span>: {
|
||
<span class="hljs-string">"My Example Category"</span>: [
|
||
<span class="hljs-string">"my-examples"</span>
|
||
],
|
||
...
|
||
},
|
||
...
|
||
}
|
||
</code></pre>
|
||
<p>Важно отметить, что пока вы не <a href="#additions-to-the-site-navigation-bar">добавите документ из боковой панели <code>"examples-sidebar"</code> на панель навигации</a>, он будет скрыт.</p>
|
||
<h2><a class="anchor" aria-hidden="true" id="дополнения-к-навигационной-панели-сайта"></a><a href="#дополнения-к-навигационной-панели-сайта" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Дополнения к навигационной панели сайта</h2>
|
||
<p>Чтобы раскрыть боковые панели, добавьте кликабельные метки в навигационную панель сайта в его верхней части. Вы можете добавить документы, страницы и внешние ссылки.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="добавление-документов"></a><a href="#добавление-документов" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Добавление документов</h3>
|
||
<p>После создания новой боковой панели для сайта <a href="#adding-new-sidebars">добавив</a> её в <code>sidebars.json</code>, вы можете выставить новую боковую панель в верхнюю панель навигации, отредактировав поле <code>headerLinks</code> в <code>siteConfig.js</code>.</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-attr">headerLinks</span>: [
|
||
...
|
||
{ <span class="hljs-attr">doc</span>: <span class="hljs-string">'my-examples'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Examples'</span> },
|
||
...
|
||
],
|
||
...
|
||
}
|
||
</code></pre>
|
||
<p>Метка с именем <code>Examples</code> будет добавлена в навигационную панель сайта, при нажатии на нее в верхней части вашего сайта будет отображена панель <code>examples-sidebar</code> и её документ по-умолчанию - <code>my-examples</code>.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="добавление-пользовательских-страниц"></a><a href="#добавление-пользовательских-страниц" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Добавление пользовательских страниц</h3>
|
||
<p>Чтобы добавить пользовательские страницы в панель навигации сайта, добавьте элементы в поле <code>headerLinks</code> в <code>siteConfig.js</code>. Например, если у нас есть страница внутри <code>website/pages/help.js</code>, мы добавить ссылку на нее следующим образом:</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-attr">headerLinks</span>: [
|
||
...
|
||
{ <span class="hljs-attr">page</span>: <span class="hljs-string">'help'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Help'</span> },
|
||
...
|
||
],
|
||
...
|
||
}
|
||
</code></pre>
|
||
<p>Метка с именем <code>Help</code> будет добавлена в панель навигации и при нажатии на нее будет отображено содержимое страницы <code>help.js</code>.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="добавление-внешних-ссылок"></a><a href="#добавление-внешних-ссылок" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Добавление внешних ссылок</h3>
|
||
<p>Пользовательские ссылки могут быть добавлены в панель навигации с помощью следующего элемента в <code>siteConfig.js</code>:</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-attr">headerLinks</span>: [
|
||
...
|
||
{ <span class="hljs-attr">href</span>: <span class="hljs-string">'https://github.com/facebook/docusaurus'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'GitHub'</span> },
|
||
...
|
||
],
|
||
...
|
||
}
|
||
</code></pre>
|
||
<p>Метка с именем <code>GitHub</code> будет добавлена в панель навигации и при нажатии на нее будет отображено содержимое из внешней ссылки.</p>
|
||
<blockquote>
|
||
<p>Чтобы открывать внешние ссылки в новых вкладках, предоставьте флаг <code>external: true</code> внутри конфигурации ссылки в заголовке.</p>
|
||
</blockquote>
|
||
<h2><a class="anchor" aria-hidden="true" id="положение-навигационной-панели-сайта"></a><a href="#положение-навигационной-панели-сайта" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Положение навигационной панели сайта</h2>
|
||
<p>У вас есть ограниченные возможности регулирования местоположения панели поиска и меню выбора языка в панели навигации.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="поиск"></a><a href="#поиск" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Поиск</h3>
|
||
<p>Если поиск подключен на вашем сайта, панель поиска появится справа от ваших ссылок. Если вы желаете разместить её между ссылками в шапке, добавьте элемент панели в массив настроек <code>headerLinks</code>:</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-attr">headerLinks</span>: [
|
||
{ <span class="hljs-attr">doc</span>: <span class="hljs-string">'foo'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Foo'</span> },
|
||
{ <span class="hljs-attr">search</span>: <span class="hljs-literal">true</span> },
|
||
{ <span class="hljs-attr">doc</span>: <span class="hljs-string">'bar'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Bar'</span> },
|
||
],
|
||
...
|
||
}
|
||
</code></pre>
|
||
<h3><a class="anchor" aria-hidden="true" id="выпадающий-список-языков"></a><a href="#выпадающий-список-языков" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Выпадающий список языков</h3>
|
||
<p>If translations are enabled on your site, the language dropdown will appear to the right of your links (and to the left of the search bar, if search is enabled). Если вы желаете разместить его между ссылками в шапке, добавьте элемент в массив настроек <code>headerLinks</code>:</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-attr">headerLinks</span>: [
|
||
{ <span class="hljs-attr">doc</span>: <span class="hljs-string">'foo'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Foo'</span> },
|
||
{ <span class="hljs-attr">languages</span>: <span class="hljs-literal">true</span> },
|
||
{ <span class="hljs-attr">doc</span>: <span class="hljs-string">'bar'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Bar'</span> },
|
||
],
|
||
...
|
||
}
|
||
</code></pre>
|
||
<h2><a class="anchor" aria-hidden="true" id="активные-ссылки-в-навигационной-панели-сайта"></a><a href="#активные-ссылки-в-навигационной-панели-сайта" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Активные ссылки в навигационной панели сайта</h2>
|
||
<p>Ссылки в верхней панели навигации получат классы <code>siteNavItemActive</code> и <code>siteNavGroupActive</code>, что позволит вам стилизовать текущую активную ссылку. <code>siteNavItemActive</code> применяется, когда присутствует прямое совпадение между ссылкой в панели и текущей отображаемой веб-страницей.</p>
|
||
<blockquote>
|
||
<p>Данное правило не распространяется на ссылки с атрибутом <code>href</code>, который предназначены только для внешних ссылок. Если вручную укажите адрес <code>href</code> в <code>headerLinks</code> для внутренней страницы, документа или сообщения блога, то класс <code>siteNavItemActive</code> не будет применен, даже если соответствующая страница отображена.</p>
|
||
</blockquote>
|
||
<p>Класс <code>siteNavGroupActive</code> будет добавлен к этим ссылкам:</p>
|
||
<ul>
|
||
<li><code>doc</code> - ссылки, которые принадлежат к той же боковой панели, что и отображаемый документ</li>
|
||
<li>The blog link when a blog post or the blog listing page is being displayed</li>
|
||
</ul>
|
||
<p>Это два отдельных класса, так что вы можете применить стили либо только к точным совпадениям, либо немного шире - к документам, которые относятся к одной и той же группе. Если вам не нужно создавать такое различие, вы можете объединить оба класса в одном правиле CSS.</p>
|
||
<h2><a class="anchor" aria-hidden="true" id="дополнительная-навигация"></a><a href="#дополнительная-навигация" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Дополнительная навигация</h2>
|
||
<p>We support secondary on-page navigation so you can quickly see the topics associated with a given document. Чтобы включить эту функцию, вам нужно добавить поле <code>onPageNav</code> - <a href="/docs/ru/site-config#optional-fields">параметр</a> конфигурации сайта в свой <code>siteConfig.js</code>.</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-attr">onPageNav</span>: <span class="hljs-string">'separate'</span>,
|
||
...
|
||
}
|
||
</code></pre>
|
||
<p>В настоящее время <code>'separate'</code> - единственное доступное значение для этого поля. Это обеспечивает отдельную навигацию в правой части страницы.</p>
|
||
<h2><a class="anchor" aria-hidden="true" id="раскрываемые-категории"></a><a href="#раскрываемые-категории" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Раскрываемые категории</h2>
|
||
<p>Для сайтов с большим количеством контента мы поддерживаем возможность раскрытия/скрытия ссылок и подкатегорий внутри категории. Чтобы включить эту функцию, установите поле <code>docsSideNavCollapsible</code> - <a href="/docs/ru/site-config#optional-fields">параметр</a> конфигурации сайта <code>siteConfig.js</code> равным true.</p>
|
||
<pre><code class="hljs css language-js">{
|
||
<span class="hljs-attr">docsSideNavCollapsible</span>: <span class="hljs-literal">true</span>,
|
||
...
|
||
}
|
||
</code></pre>
|
||
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ru/search"><span class="arrow-prev">← </span><span>Включение поиска</span></a><a class="docs-next button" href="/docs/ru/translation"><span>Перевод и локализация</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#ссылки-на-документы-сайта">Ссылки на документы сайта</a></li><li><a href="#связывание-документов">Связывание документов</a></li><li><a href="#добавление-ссылок-на-документы-в-боковую-панель">Добавление ссылок на документы в боковую панель</a><ul class="toc-headings"><li><a href="#добавление-подкатегорий">Добавление подкатегорий</a></li><li><a href="#добавление-новых-боковых-панелей">Добавление новых боковых панелей</a></li></ul></li><li><a href="#дополнения-к-навигационной-панели-сайта">Дополнения к навигационной панели сайта</a><ul class="toc-headings"><li><a href="#добавление-документов">Добавление документов</a></li><li><a href="#добавление-пользовательских-страниц">Добавление пользовательских страниц</a></li><li><a href="#добавление-внешних-ссылок">Добавление внешних ссылок</a></li></ul></li><li><a href="#положение-навигационной-панели-сайта">Положение навигационной панели сайта</a><ul class="toc-headings"><li><a href="#поиск">Поиск</a></li><li><a href="#выпадающий-список-языков">Выпадающий список языков</a></li></ul></li><li><a href="#активные-ссылки-в-навигационной-панели-сайта">Активные ссылки в навигационной панели сайта</a></li><li><a href="#дополнительная-навигация">Дополнительная навигация</a></li><li><a href="#раскрываемые-категории">Раскрываемые категории</a></li></ul></nav></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 class="footerSection"><h5>Docs</h5><a href="
|
||
/docs/ru/installation">Getting Started</a><a href="
|
||
/docs/ru/versioning">Versioning</a><a href="
|
||
/docs/ru/translation">Localization</a><a href="
|
||
/docs/ru/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ru/help">Help</a><a href="/ru/users">User Showcase</a><a href="/ru/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2020 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
|
||
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
|
||
document.addEventListener('keyup', function(e) {
|
||
if (e.target !== document.body) {
|
||
return;
|
||
}
|
||
// keyCode for '/' (slash)
|
||
if (e.keyCode === 191) {
|
||
const search = document.getElementById('search_input_react');
|
||
search && search.focus();
|
||
}
|
||
});
|
||
</script><script>
|
||
var search = docsearch({
|
||
|
||
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
|
||
indexName: 'docusaurus',
|
||
inputSelector: '#search_input_react',
|
||
algoliaOptions: {"facetFilters":["language:ru","version:1.14.4"]}
|
||
});
|
||
</script></body></html> |