テーマにリージョンを追加時に必要なこと
最終更新日 2020 年 9 月 12 日
テーマにリージョンを追加する上で、以下が必要になります:
- THEMENAME.info.yml ファイルへのリージョンメタデータの追加。
- page.html.twig ファイル内に、上記で追加したリージョンを記載。
注:テーマにリージョンを1つ以上宣言した場合は、デフォルトのリージョンはすべて適用されなくなります。そのため、使用するすべてのリージョンを宣言する必要があります。
THEMENAME.info.ymlを編集後、キャッシュをクリア(drush cr)すると、存在しないリージョンにあったブロックは無効になります。その際は、以下のようなメッセージが表示されます。
The block themename_breadcrumbs was assigned to the invalid region breadcrumb and has been disabled. ブロック [ブロック名] は無効なリージョン [リージョン名] に割り当てられ、無効にされました。
/admin/structure/block にアクセスすると、無効なブロックが一番上のリージョンに表示され、 "(無効):(disabled)"と表示されます。ブロックをドラッグアンドドロップで他のリージョンへ移動、もしくは、各ブロックのリージョンドロップダウンメニューでリージョンを再設定します。不要なブロックの場合は削除します。
page_topとpage_bottom リージョンは、システム上必要です。これらは「非表示 」リージョンで、アナリティクスや管理ツールバーなど、ページの上部と下部のマークアップに使用されます。THEMENAME.info.ymlファイルにこれらのリージョンを設定する必要はありません。また、モジュールがこれらのリージョンの存在を前提としている場合もありますので、html.html.twigから削除しないでください。
.info.ymlファイルへのリージョンの追加
THEMENAME.info.ymlファイルへ新しいリージョンをを設定します。各リージョンは regions の子キーとして設定します。
regions:
header: 'Header'
content: 'Content'
footer: 'Footer'
各リージョンキーは、英数字でアンダースコア(_)を含めることができます。キーは英字で始める必要があります。キーは、コードで使用するリージョン名、値は、ヒューマンリーダブルな形式で管理UIに表示されます。
テンプレートにリージョンを追加する
リージョンにコンテンツを表示するには、リージョンをpage.html.twigファイルに追加する必要があります。リージョンは、page.に THEMENAME.info.ymlファイルで設定したキーを Twig変数として追加します。
例:
THEMENAME.info.ymlファイル
header: 'Header'
page.html.twig ファイル
{{ page.header }}
これらの変数は、他のTwig変数と同様に作動し、利用状況に合わせて適切なマークアップと共に使用されます。 (デフォルトの非表示領域の構文は異なります。下記を参照してください。)
デフォルト領域
デフォルトリージョンの一覧は、page.html.twigのドキュメントを参照してください。
- page.header
- page.primary_menu
- page.secondary_menu
- page.highlighted
- page.help(主に管理ページのヘルプテキスト用)
- page.content(ページのメインコンテンツ)
- page.sidebar_first
- page.sidebar_second
- page.footer
- page.breadcrumb
テーマにリージョンを設定していない場合、上記のデフォルトリージョンが設定されます。これらのリージョンは、デフォルトの
core/modules/system/templates/page.html.twigファイルで設定されています。 上記のデフォルトリージョンをオーバーライドする場合には、Twig変数 {{ page_top }} と {{ page_bottom }} を、html.html.twig テンプレート内に残す必要がありますが、2つの隠しリージョン(page_top、page_bottom )を、再度設定する必要はありません。
Drupal 初心者講座バックナンバー
- Drupal 9/10 初心者講座
- 第 1 回 歴史に見る Drupal の DNA
- 第 2 回 Drupal はフレームワークか?CMS か?他の CMS との比較
- 第 3 回 Drupal の特徴
- 第 4 回 Drupal 9 / 10 のインストール (1)
- 第 5 回 Drupal 9 / 10 のインストール (2)
- 第 6 回 Drupal にコンテンツを投稿してみる
- 第 7 回 Drupal のボキャブラリとタクソノミーの使い方
- 第 8 回 コンテンツ管理における Drupal と他の CMS との比較
- 第 9 回 Drupal のブロックシステム
- 第 10 回 Drupal の標準クエリビルダー Views の使い方
- 第 11 回 Drupal と他の CMS のクエリビルダー機能を比較
- 第 12 回 Drupal の多言語機能と他の CMS やサービスとの比較
- 第 13 回 Drupal の権限設定と WordPress や Movable Type との比較
- 第 14 回 Drupal のテーマシステムについて
- 第 15 回 Drupal の拡張モジュールの選定と使い方
- 第 16 回 Drupal をもっと知りたい方に向けた各種情報