WordPressのブロックテーマで使うパターンを割り振れるカテゴリーの一覧
ブロックテーマ鋭意制作中です。色々覚えることが多く新鮮です。
本記事はほとんど自分たちで使うためにまとめたもので、備忘録のようなものになっています。
ブロックテーマのファイルは、テンプレート(個別記事ページとか) > パーツ(ヘッダーとか) > パターン(ナビゲーションとか)という構成になっています。
- パターンを組み合わせて
- パーツを作り
- テンプレートを構築する
という感じですね。
現在はパターンを作っている段階ですが、これに名前をつけることができ、管理画面でパターンの選択がしやすくなります。パターンのファイルに下記のような内容を記載することで反映されます。
<?php
/**
* Title: パターン名
* Slug: my-pattern
* Categories: text
* Description: パターンの説明
*/
?>
今回はこれのCategories:
について。分類できるのは分かりやすくていいけど、何があるのか分からない!という壁に当たったので調べてみました。(オリジナルのカテゴリも追加できるのですが、今回は割愛!)
WordPressのブロックテーマ、パターンのデフォルトカテゴリ一覧
WordPressのデフォルトで用意されているパターンのカテゴリは以下の通りです。
- featured (注目のパターン)
- about (自己紹介)
- audio (音声) (WordPress 6.4で追加)
- banner (バナー)
- buttons (ボタン)
- call to action (CTA)
- columns (カラム)
- contact (お問い合わせ)
- footer (フッター)
- gallery (ギャラリー)
- header (ヘッダー)
- hero (ヒーロー)
- images (画像)
- posts (投稿)
- pricing (料金表)
- query (クエリ)
- quotes (引用)
- separator (区切り線)
- social (ソーシャル)
- tabs (タブ)
- text (テキスト)
- video (動画)
これらのカテゴリは、get_default_block_categories()
関数で取得できます。
いっぱいありますね。なんとなくは分かるけれど、いまいちピンと来ないものもあると思います。
それぞれの用途について
featured (注目のパターン): テーマで特に推したいパターンを登録します。ブロックパレットの「パターン」タブを開いたときに最初に表示されるカテゴリです。
about (自己紹介): 自己紹介セクションに適したパターンを登録します。プロフィールや経歴などを掲載する際に便利です。
audio (音声): 音声コンテンツを埋め込むためのパターンを登録します。ポッドキャストや音楽などを共有する際に便利です。(WordPress 6.4で追加)
banner (バナー): 広告やお知らせなどのバナーを配置するためのパターンを登録します。アイキャッチ画像やコールトゥアクションボタンなどを含めることができます。
buttons (ボタン): 様々なデザインのボタンを配置するためのパターンを登録します。リンクボタンやダウンロードボタンなど、用途に合わせて使い分けられます。
call to action (CTA): ユーザーに特定のアクションを促すためのパターンを登録します。資料請求や問い合わせフォームへの誘導などに使用します。
columns (カラム): コンテンツを複数列に分割して表示するためのパターンを登録します。レイアウトの自由度を高めることができます。
contact (お問い合わせ): お問い合わせフォームや連絡先情報を表示するためのパターンを登録します。
footer (フッター): フッターに配置するパターンを登録します。著作権表示やサイトマップ、SNSリンクなどを含めることができます。
gallery (ギャラリー): 画像や動画をギャラリー形式で表示するためのパターンを登録します。
header (ヘッダー): ヘッダーに配置するパターンを登録します。サイトロゴやナビゲーションメニューなどを含めることができます。
hero (ヒーロー): ヒーローエリア(ファーストビュー)に配置するパターンを登録します。メインビジュアルやキャッチコピーなどを大きく表示できます。
images (画像): 画像を様々なレイアウトで配置するためのパターンを登録します。
posts (投稿): ブログ記事やニュース記事などの投稿を表示するためのパターンを登録します。
pricing (料金表): サービスや商品の料金表を表示するためのパターンを登録します。
query (クエリ): 特定の条件で投稿を絞り込んで表示するためのパターンを登録します。最新の投稿や特定のカテゴリの投稿を表示する際に便利です。
quotes (引用): 引用文をデザイン性高く表示するためのパターンを登録します。
separator (区切り線): コンテンツを区切るためのパターンを登録します。水平線や波線など、様々なデザインの区切り線があります。
social (ソーシャル): SNSのフォローボタンやシェアボタンを配置するためのパターンを登録します。
tabs (タブ): コンテンツをタブ形式で切り替えて表示するためのパターンを登録します。スペースを節約できます。
text (テキスト): テキストコンテンツを様々なレイアウトで配置するためのパターンを登録します。
video (動画): 動画を埋め込むためのパターンを登録します。YouTubeやVimeoなどの動画プラットフォームに対応しています。
これらのカテゴリはあくまで目安であり、必ずしもこの通りに使用する必要はありません。 ご自身のサイトの構成や目的に合わせて、柔軟にパターンをカスタマイズしてください。
Gemini さんのお言葉
以上です!
参考資料
- Block Patterns (Archived) – Theme Handbook: https://developer.wordpress.org/themes/features/block-patterns/
- get_default_block_categories() – Function: https://developer.wordpress.org/reference/functions/get_default_block_categories/