コンテンツの管理を顧客に渡す場合は、それぞれのスタイルをあらかじめ適用したコンテンツを記事に挿入できるオリジナルのブロックを作りたい時にプラグイン「Genesis Custom Blocks」を使います。
管理画面のプラグインページでGenesis Custom Blocksをインストールします。
管理画面にGenesis Blocksのメニューが追加されているので、Add Newを選択します。
シンプルなコンテンツブロックを作ります。
タイトルをslugを入力します。
メニューに表示されるアイコンを選択します。
ブロックを入れるカテゴリーを選択するか「Add New Category」で追加します。
検索用のKeywordsを任意で入れます。
「Open block fields in a modal instead of rendering in place」をオンにすると編集画面で別ウインドウで入力できます。
Post Typesで投稿、固定ページのどちらでも使うかどうかをチェックします。
フィールドを追加していきます。
「Editor Fields」「Inspector Fields」のタブがありますが、Editorはクリックして編集画面に表示され、Inspectorは入力フィールドがサイドバーに表示されます。
この例ではEditor Fieldsで作っていきます。
「＋」ボタンで追加します。
サイドバーで、追加されたフィールドのラベル、slug、入力タイプなどを設定します。
3つのフィールド、thumbという画像、bodyというtextareaも合わせて作ります。
公開ボタンをクリックします。
ガイドが表示されます。
現在のアクティブテーマの階層にblockというフォルダの中にblock-feature.phpというファイルを作成します。
block-feature.phpのコードに、表示するコードを記述します。
各フィールドの値は
block_field( スラッグ名 )で取得できます。
<div class="feature-wrapper">
<div class="cell">
<img src="<?php block_field( 'thumb' ); ?>">
</div>
<div class="cell">
<h3><?php block_field( 'main-title' ); ?></h3>
<p><?php block_field( 'body' ); ?></p>
</div>
</div>
最低限でこういったコードをblock-feature.phpに設定します。
block_field()で出力までしますので、値を置換したり、空かどうか判断するにはblock_field(slug,false)を使います。
if(!empty(block_field( 'thumb',false )){}
などでエラー処理を加えます。
投稿に追加してみます。
ブロック挿入を表示すると、新たなブロックが追加されていますので挿入します。
画面にそれぞれの入力フィールドが表示されます。
<div class="feature-wrapper">
<div class="cell">
<img src="http://www.sample.com/wp-content/uploads/2022/06/sean.jpg">
</div>
<div class="cell">
<h3>美しい海岸</h3>
<p>日本国内のさまざまな美しいビーチを紹介。宿泊、アクセス、絶景ビューポイントも合わせて紹介します。</p>
</div>
</div>
コンテンツがテンプレートコードに従って挿入されます。
