Translate

Custom Pages

You can add pages to your site that are not part of the standard docs or blog markdown files. You can do this by adding .js files to the website/pages directory. These files are React components and the render() is called to create them, backed by CSS classes, etc.

Ana Sayfanız Özelleştiriliyor

The easiest way to get started customizing your home page is to use the example site that was created when you ran the Docusaurus initialization script.

You can start your local server and go to http://localhost:3000 to see what the example home page looks like. Oradan, website/pages/en/index.js dosyasını ve projeniz için istediğiniz görüntüleri ve metni kullanan değişken bileşenleri düzenleyin.

Diğer Özel Sayfalar Ekleniyor

Docusaurus provides some simple example pages in the website/pages/en directory, including index.js, users.js, and help.js. These are good examples to showcase how to create a custom page for Docusaurus.

root-of-repo
├── docs
├── website
│   ├── blog
│   ├── core
│   │   └── Footer.js
│   ├── node_modules
│   ├── package.json
│   ├── pages
│   │   ├── index.js
│   │   ├── users.js
│   │   └── help.js
│   ├── sidebars.json
│   ├── siteConfig.js
│   └── static

Of course, you are also free to write your own pages. It is strongly suggested that you at least have an index page, but none of the pages provided are mandatory to include in your site. Dahili bileşenler hakkında daha fazla bilgi ve kendi bileşenlerinizi nasıl ekleyeceğiniz hakkında bilgiyi burada bulabilirsiniz. Başlık gezinme çubuğunda farklı sayfalar için bağlantıyı nasıl ekleyeceğinizi burada bulabilirsiniz.

If you want your page to show up in your navigation header, you will need to update siteConfig.js to add to the headerLinks element. e.g., { page: 'about-slash', label: 'About/' },

Statik Sayfalar Eklemek

Static .html files can also be used, but they will not include Docusaurus' header, footer, or styles by default. These can be added to the static folder in the same way as other static assets. Alternatif olarak, pages klasörüne de eklenebilirler ve React tarafından işlenmek yerine oldukları gibi kullanılmalıdırlar.

If you wish to use Docusaurus' stylesheet, you can access it at ${baseUrl}css/main.css. If you wish to use separate css for these static pages, you can exclude them from being concatenated to Docusaurus' styles by adding them into the siteConfig.separateCss field in siteConfig.js.

You can set the $wrapPagesHTML site config option in order to wrap raw HTML fragments with the Docusaurus site styling, header and footer.

Sitenizin Alt Bilgisini Özelleştirme

Starting from the example core/Footer.js file that was created when you ran the Docusaurus initialization script, edit the footer to include any links to pages on your site or other sites that you wish to have.

Sağlanan örnek solunda bir alt bilgi resmi ile birlikte üç sütun ve aşağısında Facebook'un açık kaynak logosu ve telif hakkına sahiptir. Projeniz bir Facebook açık kaynak projesi değilse, logoyu ve telif hakkını kaldırın. Aksi halde, alt bilginizle yaratıcı olun ve onun istediğiniz halde görünmesini sağlayın!

Sağlamak isteyebileceğiniz bağlantılar için bir kaç örnek: dokümantasyon, API, Twitter, Discord, Facebook grupları, Stack Overflow, GitHub, vs.

Your footer will automatically get applied to all pages on your site, including docs and blog posts. The sole exception to this is any static html pages you include.

If you do not want a footer for your site, change the render function of core/Footer.js to return null. e.g.,

const React = require('react');

class Footer extends React.Component {
  render() {
    return null;
  }
}

module.exports = Footer;