当サイトでは”TwentyFifteen”というテーマを利用させてもらってますが、ほしい機能などを考えて”Learn2”というテーマに変更しました。
”Learn2”はdocumentを章ごとに分類してメニューに階層表示できるところが当サイト的にHitなので選択しました。
”Learn2”は公式サイトのdocumentページで利用されているテーマです。
ただ、”Learn2”はdocumentの分類に特化した感じなので”TwentyFifteen”などに含まれているblogなどのページタイプがありません。
そのあたりはカスタマイズで対応していきます。
カスタマイズといっても大したことをするわけではなく”TwentyFifteen”から必要なファイルを移植するだけです。いわゆるハイブリッドってやつですね。
twentyfifteen\templates\blog.html.twig
twentyfifteen\templates\item.html.twig
twentyfifteen\templates\partials\blog_item.html.twig
twentyfifteen\templates\partials\pagination.html.twig
の4ファイルを”Learn2”フォルダ配下にコピーします。
これだけでページ編集時にblogやitemといったページタイプを選択可能になります。
あとは適当にcssなどで見た目を整えれば完了です。
”Learn2”にはcustom.cssを読み込む記述がありますが、custom.cssは含まれていません。
なのでcustom.cssを作成して、必要なスタイルを記述した後、cssフォルダに追加しましょう。
cssなどで対応が難しい部分に関してはtwigテンプレートを直接編集します。
例えば、item.html.twigにはパンくずリストの記述がありますが、”Learn2”ではbase.html.twigにパンくずリストの記述があるため、そのままだとblogタイプのページではパンくずリストがダブって表示されてしまいます。なので削除してしまいましょう。
File:item.html.twig
～～～
{% block content %}
<!-- ここから削除↓ -->
{% if config.plugins.breadcrumbs.enabled %}
{% include 'partials/breadcrumbs.html.twig' %}
{% endif %}
<!-- ここまで削除↑ -->
{% include 'partials/blog_item.html.twig' with {'truncate':false,'big_header':true} %}
{% endblock %}
～～～”Learn2”では、chapterとdocsというページタイプがあり、使い方としては、chapterがメニュー上に並ぶ章、docsはそれを構成する子というかんじです。
blogに対応するitemと似たかんじですね。
またdocsではタクソノミーのカテゴリに”docs”というカテゴリを追加することでメニューがグループ化されるようです。
具体的にはタクソノミーのカテゴリ”docs”と任意のタグによってページネーションが自動的に配置される仕組みになっています。
それらを設定しない場合はページネーションが正しく機能しないので注意してください。
追加したblog配下のitemページでページネーションがうまく機能してないのでそのあたりは今後調整って感じですね(｡･ω･)ﾉﾞ
Last edited: 2024-07-31 01:25