独自のCSSを適用する

例えば、フォントファミリーを指定したいとか、見出しの見栄えを変えたいとか、そういうことで自分なりのCSSを適用したいと思いませんか。

conf.pyで指定するのが正しい作法なのでしょうが、カスタムテーマ(bootstrapとか)を使っているとそうも言っていられない場合もあると思います。

そこで、conf.pyで指定しない方法を紹介します。

CSSファイルを作る

CSSファイルは、ドキュメントのルートフォルダの下の_staticフォルダに作成します。

HTMLファイルに変換するときに、_buildフォルダの下の_staticフォルダに自動的にコピーされます。

layout.htmlをコピーする

Pythonのフォルダの中のsite-packageフォルダの中にlayout.htmlというファイルがありますので、それをドキュメントルートフォルダの下の_templatesフォルダにコピーします。 そうすると、_templatesフォルダの中のlayout.htmlが優先して適用されます。

テーマ毎にlayout.htmlが存在します。 defaultテーマを使うならdefaultテーマのlayout.htmlを、bootstrapテーマを使うならbootstrapテーマのlayout.htmlをコピーしてください。

自前のCSSファイルを適用する

自分で作ったCSSファイルがmy.cssだとします。

extraheadと書かれている箇所がありますので、その下にCSSへのリンクを記入します。

{%- block extrahead %}
<link rel="stylesheet" href="../_static/my.css" type="text/css" />
{% endblock %}

そしてHTMLファイルを作成すると、CSSが適用されます。