Skip to content

Adding the Material Theme

Adding the Material Theme to the default MkDocs website

To add the Material theme to the default MkDocs website, you can follow these instructions:

  1. Update mkdocs.yml Configuration File:
  2. If you haven't already created a mkdocs.yml file in your MkDocs project directory, create one.
  3. Open the mkdocs.yml file in a text editor.
  4. Add or update the theme field in the configuration file to use the Material theme:

    theme:
      name: material
    
  5. (Optional) Customize Material Theme:

  6. You can further customize the Material theme by adding additional configuration options to the mkdocs.yml file. For example:
site_name: "OVI-GC Knowledge Base"
theme:
  name: material
  palette:
    primary: deep-orange  # Deeper Orange
    accent: deep-purple   # Medium to Dark Purple
  1. Serve Your MkDocs Site:
  2. Save the changes to the mkdocs.yml file.
  3. Open a command prompt or terminal window.
  4. Navigate to your MkDocs project directory.
  5. Run the following command to build and serve your MkDocs site locally:
 python -m mkdocs serve
  • This command will start a local web server, and you can view your MkDocs site with the Material theme applied by navigating to http://127.0.0.1:8000 in your web browser.

Note: The webserver automatically updates content upon detecting changes. If an error occurs, it will display an error message in the command line until resolved. Correcting any syntax problems in the file and saving it will trigger the webserver to reload automatically.