テーマ
テンプレートファイルやイメージファイル、CSSファイル、JavaScriptのファイル等を1つのフォルダにまとめたものをテーマと呼びます。a-blog cmsのカスタマイズをする際に作るものがテーマであり、そのテーマをコンフィグのテーマ設定で指定することでサイトのデザインを変更することができます。
テーマの設定
オリジナルのテーマを作る際に、一番最初に設定を変更する部分になります。コンフィグ >テーマ設定 にアクセスしてください。
テーマ設定画面
上記のような画面が表示されます。
テーマ ディレクトリ名
themes ディレクトリ内にあるテーマディレクトリを指定します。
テンプレートファイル
テンプレートのコントロールについては、テンプレートの章で紹介します。「トップページ」「一覧ページ」「詳細ページ」「エラーページ」「管理ページ」「エントリー編集ページ」「ユニット追加ページ」「ログインページ」の8種類のテンプレートを指定します。
一般的には、詳細ページとエントリー編集ページ・ユニット追加ページのテンプレートは同じに設定しておくようにした方がいいでしょう。
テーマとテンプレート
テーマを複数用意することによって、条件別にコンテンツのデザインを切り換えることが可能です。基本的にはブログ単位に設定する方法、カテゴリー毎に設定する方法、この後に紹介するルール機能を利用して設定する方法の3種類があります。
カテゴリー毎にテンプレートを設定する場合は、テーマディレクトリ内にカテゴリーコードのフォルダと、その中に必要なテンプレートファイルを用意します。 また、エントリーコードのファイル名を用意することで特定のエントリー専用のテンプレートも設定できます。
お知らせ（news）カテゴリーの時
news というカテゴリーには、/themes/beginner2018/news/index.html（一覧）と /themes/beginner2018/news/entry.html（詳細）のテンプレートが用意されています。この場合であれば、news のカテゴリーの際は、これらのテンプレートファイルを利用することになります。
カテゴリーのテンプレート
もし、詳細ページのテンプレートを他のページと共用の設定にするのであれば、/themes/beginner2018/news/entry.html（詳細）のファイルを削除します。すると、newsより上の階層にあるファイルを参照するようになり、この場合 /themes/beginner2018/entry.html（詳細）を利用するようになります。
また、お知らせ（news）の子カテゴリーとして、リリースノート（releasenote） を用意しテンプレートファイルの仕様を変更する際には、以下のように /themes/beginner2018/news/releasenote/index.html（一覧）と /themes/beginner2018/news/releasenote/entry.html（詳細）を用意します。
表示テンプレートの確認
表示テンプレートの確認は管理ボックスで行います。デバッグモード（config.server.php の DEBUG_MODE）が 1 の時のみ、下図のようにテンプレートのファイル名が表示されます。
テンプレートのパス確認
もしくは、調べたいテンプレートの場所で（Win: Ctrl, Mac: ⌘） + K を押してクイックサーチを起動し、%tpl と入力することでも確認できます。
(Win: Ctrl, Mac: ⌘) + K -> %tpl と入力
クイックサーチを使ったテンプレートパスの確認
テーマの構成
テーマディレクトリ構造
テーマディレクトリ（themes）には、テーマ設定で指定するテーマディレクトリ以外に、system という a-blog cms のシステムで利用しているテーマが入っています。さらに system の中に admin というディレクトリがあり、ここにすべての管理ページのテンプレートファイルが格納されています。そのため a-blog cms の管理ページをカスタマイズする際は、admin の中のファイルを修正すればOKです。
テーマ設定のページで設定されているテーマ（beginner2018）と、system のテーマは継承関係にあります。テーマ設定のページで設定されているテーマに呼び出すファイルが存在しない時は、system のファイルをチェックし、存在していればそのファイルを表示します。例えば、login.html や 404.html は beginner2018 のテーマの中には存在していませんが、system のテーマに存在しているため、表示される仕組みになっています。
管理ページをカスタマイズする際は、テーマ作成の作法として、system のファイルを直接修正するのではなく、設定しているテーマにコピーして修正するようにしてください。
例として、/themes/system/404.html をコピーし /themes/beginner2018/404.html に設置して修正をします。
system のファイルを直接修正してしまうと、システムのアップデートの際に system ディレクトリも同時にアップデートされ、カスタマイズ部分が消えてしまう恐れがあります。ご注意ください。
テーマの継承
beginner2018 テーマにないファイルは、system のファイルを利用するようになっていますが、同様に子ブログ用のテーマを作る際に以下のようなテーマディレクトリを作成することで、system と同じようにテーマを継承できます。
blog@beginner2018
テーマを継承することで、例えば、/blog@beginner2018/include/ に header.html がない場合には、/beginner2018/include/header.html が表示されるようになります。また president@blog@beginner2018 のように複数の @ を使ったテーマも作成できます。
複数のブログを1つのシステム内に設定してカスタマイズするようなサイトになった時は、このようにテーマの継承をすることで、メンテナンス性の高いテーマを作ることができます。