4.1 KiB

Raw Blame History

template
overrides/main.html

Setting up the footer

The footer of your project documentation is a great place to add links to websites or platforms you or your company are using as additional marketing channels, e.g. :fontawesome-brands-medium:{ style="color: #00AB6C" }, :fontawesome-brands-twitter:{ style="color: #1DA1F2" } or :fontawesome-brands-facebook:{ style="color: #4267B2" }, which can be configured via mkdocs.yml.

Configuration

:octicons-file-code-24: Source · :octicons-milestone-24: Default: none

All social links are rendered next to the copyright information as part of the footer of your project documentation. Add a list of social links in mkdocs.yml with:

extra:
  social:
    - icon: fontawesome/brands/twitter
      link: https://twitter.com/squidfunk

For each entry, the following fields are available:

icon{ #icon }

:octicons-milestone-24: Default: none · :octicons-alert-24: Required – This field must point to a valid icon path referencing any icon bundled with the theme, or the build will not succeed. Some popular choices:

:fontawesome-brands-behance: – fontawesome/brands/behance
:fontawesome-brands-docker: – fontawesome/brands/docker
:fontawesome-brands-github: – fontawesome/brands/github
:fontawesome-brands-instagram: – fontawesome/brands/instagram
:fontawesome-brands-linkedin: – fontawesome/brands/linkedin
:fontawesome-brands-medium: – fontawesome/brands/medium
:fontawesome-brands-pied-piper-alt: – fontawesome/brands/pied-piper-alt
:fontawesome-brands-product-hunt: – fontawesome/brands/product-hunt
:fontawesome-brands-slack: – fontawesome/brands/slack
:fontawesome-brands-twitter: – fontawesome/brands/twitter

link{ #link }

:octicons-milestone-24: Default: none · :octicons-alert-24: Required – This field must contain a valid relative or absolute URL including the URI scheme. All URI schemes are supported, including mailto and bitcoin:

=== "Twitter"

``` yaml
extra:
  social:
    - icon: fontawesome/brands/twitter
      link: https://twitter.com/squidfunk
```

=== "Email address"

``` yaml
extra:
  social:
    - icon: fontawesome/solid/paper-plane
      link: mailto:<email-address>
```

name{ #name }

:octicons-milestone-24: Default: domain name from link, if available – This field is used as the link's title attribute and can be set to a discernable name to improve accessibility:

extra:
  social:
    - icon: fontawesome/brands/twitter
      link: https://twitter.com/squidfunk
      name: squidfunk on Twitter

Copyright notice

:octicons-file-code-24: Source · :octicons-milestone-24: Default: none

A custom copyright banner can be rendered as part of the footer, which is displayed next to the social links. It can be defined as part of mkdocs.yml:

copyright: Copyright &copy; 2016 - 2020 Martin Donath

Remove generator

:octicons-file-code-24: Source · :octicons-heart-fill-24:{ .mdx-heart } Insiders only{ .mdx-insiders }

The footer displays a Made with Material for MkDocs notice to denote how the site was generated. The notice can be removed with the following setting via mkdocs.yml:

extra:
  generator: false

Customization

Custom icons

:octicons-file-code-24: Source · :octicons-mortar-board-24: Difficulty: moderate

The social links feature uses the standard icon integration of Material for MkDocs. If you want to use custom icons, follow the guide explaining how to add additional icons.

4.1 KiB Raw Blame History Unescape Escape