Sphinx Readthedocs 主题字体很棒的集成

Question

我知道这可能是一个非常愚蠢的问题，但我还没有在网上找到任何关于潜在解决方案的信息。

我正在使用

Sphinx 1.4 和 sphinx_rtd_theme 为我的 Django 项目生成一些文档。我一直在尝试找到一种在 .rst 文件中使用很棒的字体图标的方法，但没有找到方法。我查看了 sphinx_rtd_theme 源文件，并且 fa-* 图标包含在 theme.css 文件中。但是，我不知道实际将它们包括在内的方法。

它是指令、解释文本还是类似的东西？我已经尝试过

icon、fonticon 和 fa 作为上述任何一个，但都不起作用。

如有任何帮助，我们将不胜感激。

我知道我可以使用原始 HTML，但如果可能的话我想避免这种情况。

Answer 1

您可以使用Sphinx的

rst-class

指令，如下：

.. rst-class:: fa fa-fontawesome

   the font awsome flag will be attached to this paragraph

rst-class

 将为指定的下一个元素设置类属性。

以下代码仅渲染图标：

.. rst-class:: fa fa-font-awesome

   |

当然，您也可以使用自定义类来进一步设置元素的样式。

Answer 2

我刚刚学习 Sphinx 并有同样的问题，但使用原始 HTML 适合我的情况。也许这个解决方案会对那里的人有所帮助......

在

conf.py

 文件中，添加指向您的 Fontawesome 套件代码 URL 的链接

html_js_files = [
    'https://kit.fontawesome.com/##########.js',
]

然后，在 Sphinx 中使用原始 HTML 指令的 fontawesome 图标

.. |fa-fort-awesome| raw:: html

   <i class="fab fa-fort-awesome"></i>

Here is some text |fa-fort-awesome| with the icon in the middle.

这是它如何呈现为 HTML...

Answer 3

您还可以使用

https://sphinx-panels.readthedocs.io/en/latest/#inline-icons:

:fa:`bars`
:fa:`spinner,text-white bg-primary fa-2x,style=fa`

Answer 4

为了使图标在 HTML 和 Latex 上可用，请从

https://fontawesome.com/download 下载 FontAwesome Web 包，将 font-awesome/svgs/solid 包含到您的项目 _static 文件夹中，并使用如下所示的图像指令:

The |fa-bars| function is to toggle the left Sidebar Menu between being collapsed behind the button or displayed on the screen.

.. |fa-bars| image:: _static/font-awesome/svgs/solid/bars.svg
:width: 20px
:alt: hamburguer button

结果：

<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
The <i class="fa fa-bars"></i> function is to toggle the left Sidebar Menu between being collapsed behind the button or displayed on the screen.

Answer 5

安装sphinx-design

pip install sphinx-design 并添加到您的

conf.py

：

extensions = ["sphinx_design"]

html_css_files = [
    "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css"
]

然后，在您的

.rst

 文件中，

- An icon :fab:`github`, some more text.

sphinx-design

还支持开箱即用的octicon和material design图标，无需配置css。

请参阅

文档了解更多信息。