SiteテーマのREADMEから「おまけ機能」をスクショ付きで紹介！
このエントリーは「a-blog cms Advent Calendar 2025」の 3日目記事です。
Siteテーマの機能的な詳細については、Siteテーマ同梱の README.md に詳しく記載されています。最新のSiteテーマ情報はGitHubから確認できます。
公式ドキュメントの「Siteテーマの使い方」ページにも機能の一部はまとめられていますが、これはあくまでよく使われる機能をピックアップしたライトな紹介にとどまっています。
そのため、特に実装者向けになりますが、より詳細な機能や実装方法を知るためにはやはりREADME.mdを参照するのをお勧めしたいです。
ということで、今回はREADME.mdから、「おまけ機能」をピックアップしてご紹介します！今回紹介するのは、閲覧画面からでは気づけない、管理画面の設定変更やテンプレートから読み込みファイルを変更しないと確認できない機能です。
Ver.3.2 Site/Beginnerテーマ制作ご協力者への謝辞
解説の前に、まず感謝を伝えさせてください。
Siteテーマは多くの要素が詰め込まれたテーマであり、その制作には a-blog cms エキスパートの方々にもご協力いただきました！
大変なテーマだったと思いますが、本当にありがとうございました！
README.md の内容ピックアップ
今回ピックアップする機能はこちら！
- サイトトップのレイアウト機能
- パターン別メインビジュアル
- レイアウトパターン別グローバルナビ
- ページ見出しテキストの配置設定
- 事例紹介の検索画面遷移がスムーズになるテンプレート（htmx活用）
- カスタムマイページ
- カルーセル版関連バナー
- EU向けCookie利用の同意ポップアップ
サイトトップのレイアウト機能
Siteテーマには、レイアウト機能をお試しできるサンプルファイルが実装されています。
トップページのレイアウト画面
Siteテーマデフォルト設定状態だとモジュールが固定配置されています。管理画面からレイアウト機能付きテンプレートに切り替えることで、ブラウザ上からモジュールの配置変更や追加・削除ができるようになります。詳細な使い方については、下記ドキュメントが参考になります。
Siteテーマインストール時の状態であれば、ある程度初期のレイアウトデータ（モジュール）が入っています。
レイアウト機能付きテンプレート有効化方法
管理画面 > ルートブログのテーマセット設定 にて、トップページのテンプレートを「layout.html」に変更します。
Siteルートテーマ用のテーマ設定画面
Siteテーマインストール直後の状態であれば、テーマセット設定の「テンプレート選択ファイル（template.yaml）の値を優先する」のチェックを外すだけでレイアウト機能をお試し可能です。
レイアウト機能付きテンプレートを有効化すると、Siteテーマのトップページに「レイアウト」ボタンが出現します。
Siteテーマトップページの「レイアウト」ボタン
編集画面へ移動するには、この「レイアウト」ボタンをクリックします。
パターン別メインビジュアル
メインビジュアルについては、3パターン雰囲気の異なるテンプレートが用意されています。
デフォルトのメインビジュアル
メインビジュアルパターン別1つめ
メインビジュアルパターン別2つめ
メインビジュアル変更方法
メインビジュアルの変更は、テンプレートファイルを直接変更する必要があります。README.md の内容を参考に変更箇所を確認するとスムーズです。
レイアウトパターン別グローバルナビ
グローバルナビについては、3パターンのレイアウト別テンプレートが用意されています。
デフォルトのグローバルナビレイアウト（ロゴとナビゲーション横並び）
ロゴとナビゲーション縦積み、検索ボタン付き、ロゴ左寄せ
ロゴとナビゲーション縦積み、検索ボタン付き、ロゴ中央寄せ
グローバルナビのレイアウト変更方法
グローバルナビのレイアウト変更はテンプレートで行う必要があるので、README.md の内容を参考にカスタマイズするとスムーズです。
ナビゲーション追従は管理画面から設定可能
グローバルナビに関連する設定項目のうち、ナビゲーションの固定（追従）設定は管理画面から変更可能です。
設定場所は、 管理画面 > ルートブログのブログ設定 > カスタム設定タブの「グローバルナビゲーションレイアウト設定」になります。
グローバルナビの固定（追従）設定
ページ見出しテキストの配置設定
下層ページ共通で存在しているページタイトルのテキスト配置を管理画面から変更可能です。 地味な機能ですが、グローバルナビゲーションレイアウト設定と合わせて調整することで、サイト全体のデザインバランスを整えやすくなります。
ページ見出しテキスト左寄せ（デフォルト状態）
ページ見出しテキスト中央寄せ
ページ見出しテキスト右寄せ
ページ見出しのレイアウト設定場所
管理画面 > ルートブログのブログ設定 > カスタム設定タブの「ページヘッダーレイアウト設定」から変更可能です。
ページ見出しのレイアウト設定画面
事例紹介の検索画面遷移がスムーズになるテンプレート（htmx活用）
Siteテーマでは、リンクボタンなどでコンテンツが切り替わる際に、よりスムーズに感じられるよう、組み込みJSである htmx を活用しています。
2025年12月上旬現在はデモサイトがSiteテーマになっているので、下記URLから事例紹介のhtmxサンプルテンプレートをご確認いただけます。
ぜひ両方のページを操作してみて、その違いを体験してみてください！
事例紹介の「検索」をクリックして画面遷移の違いを体験
カスタムマイページ
Siteテーマは、閲覧画面の外観を保った状態でプロフィール更新画面を表示できるようカスタマイズしてあります。
Siteテーマのプロフィール更新画面
カスタマイズしていない状態のプロフィール更新画面
また、Siteテーマはユーザーのカスタムフィールド情報もプロフィール欄に表示できるようカスタマイズしてあります。
マイページ確認方法
ログイン中のユーザーは、管理ボックスの「プロフィール」リンクからマイページを表示することができます。Siteテーマをインストールした環境でお試しください。
管理ボックスの「プロフィール」リンク
カルーセル版関連バナー
Siteテーマのトップページにある関連バナーをカルーセル表示できるテンプレートが用意されています。
デフォルトのSiteテーマでは、3枚以上のバナーが登録されると下に段落ちします。
デフォルトの関連バナー
カルーセル版関連バナー
カルーセル版関連バナーの表示方法
カルーセル版関連バナーを表示するには、テンプレートファイルを直接変更する必要があります。README.md の内容を参考に変更箇所を確認するとスムーズです。
EU向けCookie利用の同意ポップアップ
Google Analytics 等のCookieを利用したサービスを導入する場合、Cookie利用の同意を取得したい場合に「同意ポップアップ」を表示できる機能が用意されています。
EU向けCookie利用の同意ポップアップ
EU向けCookie利用の同意ポップアップ有効化方法
管理画面 > ルートブログのブログ設定 > カスタム設定タブの「U向けCookie利用の同意ポップアップ設定」かポップアップの有効化をすることができます。
EU向けCookie利用の同意ポップアップ設定
だし、同意ポップアップを利用する場合の注意点がいくつかあるため、README.md の内容を参考に設定ください。
最後に
今回は Siteテーマを閲覧画面から見ているだけでは気づけない機能的な側面をピックアップして紹介してみました。
基本的にはすべて README.md に記載されている情報ですので、実装者の方はぜひそちらも参照してみてください。どのファイルに設定が書かれているかといった実装者向けの具体的な情報も記載されています。
【注意点】
今回ご紹介したのはあくまで「おまけ機能」です。将来的に機能が統合されて無くなったり、本記事のスクリーンショットから変更があったり、あるいは「おまけ」から昇格して常時表示になる可能性もありますので、ご注意ください。
明日の Advent Calendar は？
明日の「a-blog cms Advent Calendar 2025」4日目は、笠谷@アップルップルさんです。
お楽しみに！