CINXE.COM

<!DOCTYPE html><html lang="fr"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Enabling Search · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="Docusaurus prend en charge la recherche en utilisant [Algolia DocSearch](https://community.algolia.com/docsearch/). Une fois que votre site est en ligne, vous pouvez [le soumettre à DocSearch](https://community.algolia.com/docsearch/). Algolia vous enverra alors les identifiants que vous pourrez ajouter à votre `siteConfig.js`."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="fr"/><meta property="og:title" content="Enabling Search · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="Docusaurus prend en charge la recherche en utilisant [Algolia DocSearch](https://community.algolia.com/docsearch/). Une fois que votre site est en ligne, vous pouvez [le soumettre à DocSearch](https://community.algolia.com/docsearch/). Algolia vous enverra alors les identifiants que vous pourrez ajouter à votre `siteConfig.js`."/><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="/fr"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/fr/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/fr/installation" target="_self">Docs</a></li><li class=""><a href="/docs/fr/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/fr/users" target="_self">Users</a></li><li class=""><a href="/blog/" target="_self">Blog</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"/>Français</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/search">English</a></li><li><a href="/docs/ko/search">한국어</a></li><li><a href="/docs/pt-BR/search">Português (Brasil)</a></li><li><a href="/docs/ro/search">Română</a></li><li><a href="/docs/ru/search">Русский</a></li><li><a href="/docs/zh-CN/search">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">Help Us Translate</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>Guides</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Getting Started<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/fr/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Guides<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/fr/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/custom-pages">Custom Pages</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/fr/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/translation">Translations & Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/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/fr/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/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/fr" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Enabling Search</h1></header><article><div><span><p>Docusaurus prend en charge la recherche en utilisant <a href="https://community.algolia.com/docsearch/">Algolia DocSearch</a>. Une fois que votre site est en ligne, vous pouvez <a href="https://community.algolia.com/docsearch/">le soumettre à DocSearch</a>. Algolia vous enverra alors les identifiants que vous pourrez ajouter à votre <code>siteConfig.js</code>.</p> <p>DocSearch travaille en explorant le contenu de votre site Web toutes les 24 heures et en mettant tout le contenu dans un index Algolia. Ce contenu est ensuite interrogé directement depuis votre front-end en utilisant l'API Algolia. Note that your website needs to be publicly available for this to work (ie. not behind a firewall). Ce service est gratuit.</p> <h2><a class="anchor" aria-hidden="true" id="activation-de-la-barre-de-recherche"></a><a href="#activation-de-la-barre-de-recherche" 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>Activation de la barre de recherche</h2> <p>Entrez votre clé API et le nom de l'index (envoyé par Algolia) dans <code>siteConfig.js</code> dans la section <code>algolia</code> pour activer la recherche de votre site.</p> <pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = { ... algolia: { <span class="hljs-attr">apiKey</span>: <span class="hljs-string">'my-api-key'</span>, <span class="hljs-attr">indexName</span>: <span class="hljs-string">'my-index-name'</span>, <span class="hljs-attr">appId</span>: <span class="hljs-string">'app-id'</span>, <span class="hljs-comment">// Optional, if you run the DocSearch crawler on your own</span> <span class="hljs-attr">algoliaOptions</span>: {} <span class="hljs-comment">// Optional, if provided by Algolia</span> }, ... }; </code></pre> <h2><a class="anchor" aria-hidden="true" id="options-de-recherche-supplémentaires"></a><a href="#options-de-recherche-supplémentaires" 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>Options de recherche supplémentaires</h2> <p>You can also specify extra <a href="https://docsearch.algolia.com/">search options used by Algolia</a> by using an <code>algoliaOptions</code> field in <code>algolia</code>. Cela peut être utile si vous voulez fournir des résultats de recherche différents pour les différentes versions ou langues de vos docs. Toutes les occurrences de "VERSION" ou "LANGUAGE" seront remplacées respectivement par la version ou la langue de la page courante. Plus de détails sur les options de recherche peuvent être <a href="https://www.algolia.com/doc/api-reference/api-parameters/#overview">trouvés ici</a>.</p> <pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = { ... algolia: { ... algoliaOptions: { <span class="hljs-attr">facetFilters</span>: [ <span class="hljs-string">"language:LANGUAGE"</span>, <span class="hljs-string">"version:VERSION"</span> ] } }, }; </code></pre> <p>Algolia might provide you with <a href="https://docsearch.algolia.com/">extra search options</a>. Si c'est le cas, vous devriez les ajouter à l'objet <code>algoliaOptions</code>.</p> <h2><a class="anchor" aria-hidden="true" id="contrôle-de-lemplacement-de-la-barre-de-recherche"></a><a href="#contrôle-de-lemplacement-de-la-barre-de-recherche" 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>Contrôle de l'emplacement de la barre de recherche</h2> <p>Par défaut, la barre de recherche sera l'élément le plus à droite de la barre de navigation supérieure.</p> <p>Si vous voulez changer l'emplacement par défaut, ajoutez l'option <code>searchBar</code> dans le champ <code>headerLinks</code> de <code>siteConfig.js</code> à l'emplacement souhaité. Par exemple, vous souhaitez peut-être que la barre de recherche se trouve entre vos liens internes et externes.</p> <pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = { ... headerLinks: [ {...} {...} { <span class="hljs-attr">search</span>: <span class="hljs-literal">true</span> } {...} {...} ], ... }; </code></pre> <h2><a class="anchor" aria-hidden="true" id="personnalisation-du-placeholder"></a><a href="#personnalisation-du-placeholder" 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>Personnalisation du placeholder</h2> <p>If you want to change the placeholder (which defaults to <em>Search</em>), add the <code>placeholder</code> field in your config. For example, you may want the search bar to display <em>Ask me something</em>:</p> <pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = { ... algolia: { ... placeholder: <span class="hljs-string">'Demandez-moi quelque chose'</span> }, }; </code></pre> <h2><a class="anchor" aria-hidden="true" id="désactivation-de-la-barre-de-recherche"></a><a href="#désactivation-de-la-barre-de-recherche" 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>Désactivation de la barre de recherche</h2> <p>Pour désactiver la barre de recherche, commentez (recommandé) ou supprimez la section <code>algolia</code> dans le fichier <code>siteConfig.js</code>.</p> <p>Aussi, si vous avez personnalisé l'emplacement de la barre de recherche dans <code>headerLinks</code>, définissez <code>search: false</code>.</p> </span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/fr/custom-pages"><span class="arrow-prev">← </span><span>Custom Pages</span></a><a class="docs-next button" href="/docs/fr/navigation"><span>Navigation and Sidebars</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#activation-de-la-barre-de-recherche">Activation de la barre de recherche</a></li><li><a href="#options-de-recherche-supplémentaires">Options de recherche supplémentaires</a></li><li><a href="#contrôle-de-lemplacement-de-la-barre-de-recherche">Contrôle de l'emplacement de la barre de recherche</a></li><li><a href="#personnalisation-du-placeholder">Personnalisation du placeholder</a></li><li><a href="#désactivation-de-la-barre-de-recherche">Désactivation de la barre de recherche</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/fr/installation">Getting Started</a><a href=" /docs/fr/versioning">Versioning</a><a href=" /docs/fr/translation">Localization</a><a href=" /docs/fr/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/fr/help">Help</a><a href="/fr/users">User Showcase</a><a href="/fr/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><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</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 © 2022 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({ appId: 'NHNLQ9RRTP', apiKey: '9fd932b3605878e173f39bf8e2049466', indexName: 'docusaurus', inputSelector: '#search_input_react', algoliaOptions: {"facetFilters":["language:fr","version:1.14.7"]} }); </script></body></html>