WordPressのブロックテーマで使うパターンを割り振れるカテゴリーの一覧

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 さんのお言葉

以上です!

参考資料