如何在mkdocs material中使用Fontawesome Pro图标

huangapple go评论105阅读模式
英文:

How to use Fontawsome Pro icons in mkdocs material

问题

我已购买Fontawesome Pro Icons套餐的许可证,想知道如何在mkdocs material中使用专业库套件?我目前像这样使用免费字体,例如:

:fontawesome-solid-user-secret:

但我想使用专业套餐中的“thin”版本,就像这样:

:fontawesome-thin-user-secret:

如何实现这一点?谢谢。

英文:

I have purchased a License for the Fontawesome Pro Icons package and was wondering how I can use the pro library kit in mkdocs material?
I currently use the free fonts like this, for example:

:fontawesome-solid-user-secret:

But I would like to use the "thin" version which is part of the pro package, like this:

:fontawesome-thin-user-secret:

How can I achieve that? TIA

答案1

得分: 1

首先,在mkdocs.yml中声明一个名为custom_dir的变量,如果你还没有声明的话:

theme:
  custom_dir: docs/.overrides  # 相对于 mkdocs.yml 的路径。可以自定义。

然后,下载 Font Awesome,解压它,并将svgs目录中的内容(不包括目录本身)移动到{CUSTOM_DIR}/.icons/fontawesome目录中。例如,如果你的custom_dirdocs/.overrides,你应该将svgs目录的内容移动到docs/.overrides/.icons/fontawesome目录中。与下载一起的其他内容可以安全删除。

你的custom_dir应该如下所示:

.
└── .icons/
    └── fontawesome/
        ├── brands
        ├── duotone
        ├── light
        ├── regular
        ├── sharp-regular
        ├── sharp-solid
        ├── solid
        └── thin

然后,你可以以与免费图标相同的方式使用 Font Awesome Pro 图标(例如,:fontawesome-thin-user-secret:会像原样工作)。

英文:

First, declare a custom_dir in mkdocs.yml if you haven't already:

theme:
  custom_dir: docs/.overrides  # Relative to mkdocs.yml. Can be whatever you want.

Then download Font Awesome, extract it, and move the contents of the svgs directory (not including the folder itself) to {CUSTOM_DIR}/.icons/fontawesome. For example, if your custom_dir is docs/.overrides, you would move the contents of the svgs directory to docs/.overrides/.icons/fontawesome. Everything else that came with the download is safe to delete.

Your custom_dir should look like this:

.
└── .icons/
    └── fontawesome/
        ├── brands
        ├── duotone
        ├── light
        ├── regular
        ├── sharp-regular
        ├── sharp-solid
        ├── solid
        └── thin

You can then use Font Awesome Pro icons in the same way you already do the free ones (e.g. :fontawesome-thin-user-secret: will work as written).

huangapple
  • 本文由 发表于 2023年2月27日 00:20:11
  • 转载请务必保留本文链接:https://go.coder-hub.com/75573342.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定