1
0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-12-12 15:51:11 +01:00
mkdocs-material/docs/setup/setting-up-the-footer.md
2020-10-11 12:20:36 +02:00

3.8 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

Remove generator

:octicons-file-code-24: Source · :octicons-heart-fill-24:{: .tx-heart } Insiders only{: .tx-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.