DOCSEARCHbyAlgolia
Submit Docs

Docusaurus Documentation

website·Indexed 30 days ago

https://kmin-blog-v1.vercel.app

A static-site generator designed for quickly creating websites. Features include support for Markdown and React pages, a built-in blog plugin with tag systems, documentation versioning, i18n translation capabilities, and Jamstack deployment.

Tokens
3.3K
Snippets
29
Records
38
Agent score
73%

What's inside Docusaurus

  1. Customize Docusaurus layouts using React

    Docusaurus is powered by React, allowing developers to extend or customize the website layout. You can create custom components or pages while maintaining the existing global header and footer.

  2. Create and manage blog posts in Docusaurus

    Docusaurus blogging features are powered by the @docusaurus/plugin-content-blog plugin. To create blog posts, add Markdown files or folders to the blog directory. Post dates are automatically extracted from filenames using the format YYYY-MM-DD-title.md (e.g., 2019-05-30-welcome.md) or from an index.md file within a dated folder (e.g., 2019-05-30-welcome/index.md). Using a folder for a post is recommended for co-locating post-specific images. Blog authors can be managed in the authors.yml file, and posts support the use of tags.

  3. Translate documentation files for a specific locale

    To translate a document, copy the original file from the docs directory into the corresponding locale folder within the i18n directory. The folder structure must follow the pattern: i18n/{locale}/docusaurus-plugin-content-docs/current/.
    # Example: Translating intro.md to French (fr)
mkdir -p i18n/fr/docusaurus-plugin-content-docs/current/
cp docs/intro.md i18n/fr/docusaurus-plugin-content-docs/current/intro.md

  4. Get started with Docusaurus documentation

    Docusaurus is designed for quick installation and setup. To begin building your website, place your documentation files into the docs directory.

  5. Limit blog post content in list views using truncate comments

    To limit the amount of content displayed for a blog post in the list view, insert the <!-- truncate --> HTML comment within the post content. Content appearing after this comment will be hidden in the list view and only visible on the full post page.
    This text will appear in the list view.

<!-- truncate -->

This text will only appear on the full blog post page.

  6. Create and manage blog posts in Docusaurus

    Docusaurus blogging features are powered by the @docusaurus/plugin-content-blog plugin. To create blog posts, add Markdown files or folders to the blog directory. Blog post dates are automatically extracted from filenames using the format YYYY-MM-DD-title.md (e.g., 2019-05-30-welcome.md) or from an index.md file within a dated folder (e.g., 2019-05-30-welcome/index.md). Using folders for posts is recommended for co-locating images with the content.

  7. Create and organize blog posts in Docusaurus

    Docusaurus blogging features are powered by the @docusaurus/plugin-content-blog plugin. To create blog posts, add Markdown files or folders to the blog directory. Post dates are automatically extracted from filenames using the format YYYY-MM-DD-title.md (e.g., 2019-05-30-welcome.md). For posts with multiple assets, use a folder structure with an index.md file (e.g., 2019-05-30-welcome/index.md) to co-locate images with the content.

  8. Update content for specific documentation versions

    Versioned documentation is managed via the file system. To update a specific version, edit the files in the corresponding versioned_docs folder. To update the upcoming/unreleased version, edit files in the main docs folder.

    Example mapping:

    • versioned_docs/version-1.0/hello.md $\rightarrow$ http://localhost:3000/docs/hello
    • docs/hello.md $\rightarrow$ http://localhost:3000/docs/next/hello

  9. Add syntax-highlighted code blocks with titles

    Markdown code blocks are supported with syntax highlighting. You can optionally add a title to the code block to indicate the filename or purpose.
    ```jsx title="src/components/HelloDocusaurus.js"
function HelloDocusaurus() {
  return <h1>Hello, Docusaurus!</h1>;
}

  10. Create and organize blog posts in Docusaurus

    Docusaurus blogging features are powered by the @docusaurus/plugin-content-blog plugin. To create blog posts, add Markdown files or folders to the blog directory. To co-locate images with a specific post, use a folder structure (e.g., blog/post-name/index.md).

  11. Create a blog post in Docusaurus

    To create a blog post in Docusaurus, create a markdown file in the blog/ directory. Docusaurus automatically generates a dedicated page for the post, updates the blog index page, and manages the tag system and RSS feed. The file name typically follows a date-based naming convention (e.g., YYYY-MM-DD-title.md).
    ---
slug: greetings
title: Greetings!
authors:
  - name: Joel Marcey
    title: Co-creator of Docusaurus 1
    url: https://github.com/JoelMarcey
    image_url: https://github.com/JoelMarcey.png
  - name: Sébastien Lorber
    title: Docusaurus maintainer
    url: https://sebastienlorber.com
    image_url: https://github.com/slorber.png
tags: [greetings]
---

Congratulations, you have made your first post!

Feel free to play around and edit this post as much as you like.

  12. Create and organize blog posts in Docusaurus

    Docusaurus blogging features are powered by the @docusaurus/plugin-content-blog plugin. To create blog posts, add Markdown files or folders to the blog directory.

    Post dates are automatically extracted from filenames using the format YYYY-MM-DD-title.md (e.g., 2019-05-30-welcome.md). Alternatively, you can use a folder structure like 2019-05-30-welcome/index.md, which is useful for co-locating images with the post content. Blog authors can be managed in the authors.yml file, and posts support the use of tags.