【WordPress】テーマ開発－ブロックパターンの追加方法

2022年5月19日2022年5月27日

web制作 WordPress

WordPressのエディタがGutenbergに変わってしばらく経ちますがブロックエディタは進化してきて馴染んできたと思います。

特にブロックパターン機能はHTMLを書けない不慣れなユーザーにも扱いやすくするとても親切なツールです。

管理画面を扱うユーザーにとって一度わかってしまえばとても便利なのでブロックパターンは多用してなるべく多くのことを管理者自身にやってもらうことが良いと思います。

ブロッパターンの登録方法
functions.phpに用意が出来たら実際の投稿からパターンを作成

ブロッパターンの登録方法

まず下記のようなコードをfunctions.phpにかきます。

if ( ! function_exists() ):

function hoge_register_block_patterns() {
    register_block_pattern(
        $block_pattern_name, // ブロックパターンの名前
        array(
            'title' => "", // ブロックパターンのタイトル※こちらが表示されるタイトル
            'categories' => array('text'), // カテゴリを指定textは適当
            'description' => '',　// パターンの説明。ここに指定してある文言が紹介文になる
            'content' => "", // ★ここにコンテンツ内容を入れる
            'keywords' => [], // キーワード検索でひっかけたい文字を指定する
            'viewportWidth' => 'ブロックパターンプレビュー時の想定幅'
        )
    )
}
add_action('init', 'hoge_register_block_patterns');
// @XXX hoge部分は適宜変更してください
endif;