新テーマ「ストークSE」をリリースしました!

再利用ブロックの使い方

2023年12月4日追記:WordPress6.3以降、再利用ブロックは「パターン」に統合されており、この記事に記載している内容とは異なる部分がございます。

ブロックエディタ(Gutenberg)の機能のひとつとして「再利用ブロック」があります。

記事で繰り返し使う定型文やレイアウト用のテンプレートなど、再利用可能なブロックとして作成しておけば、エディタから直接呼び出すことができる非常に便利な機能です。

そんな再利用ブロックについて、ここでは基本的な使い方や用途について解説します。

再利用ブロックを機能拡張したテーマ

STORK19では、「再利用ブロック」をブログパーツとして 利用することができ非常に使いやすく機能拡張しています。再利用ブロックをボタン一つでブロックパターンに変換できたり、カテゴリーページに読み込むことができたりと多機能に利用可能です。

再利用ブロック(ブログパーツ)の機能についてみてみる

再利用ブロックを作成する方法

その1:通常のブロックを再利用ブロックに変換して作成

投稿・固定ページ編集画面で作成したブロックを再利用ブロックとして登録する方法です。ブロックツールバーの詳細設定から再利用ブロックに追加して登録できます。

再利用ブロックに追加をクリック
再利用ブロックの名前をつけておくこともできます

その2:ブロック管理画面から作成

投稿・固定ページ編集画面右上のツールと設定をさらに表示からすべての再利用ブロックを管理を選択すると再利用ブロックの一覧画面を開くことができます。(※1)

すべての再利用ブロックを管理
「すべての再利用ブロックを管理」を選びます
再利用ブロック管理画面で新規追加
再利用ブロック管理画面

[新規追加]で再利用ブロックの作成画面が開くので、タイトル(再利用ブロックの名前)と内容を作成します。通常の記事作成と同じようにブロックを追加して作成することができます。

再利用ブロック編集画面
投稿や固定ページのようにブロックエディタで作成します

再利用ブロックを使う・編集する方法

投稿・固定ページ編集画面で再利用ブロックを使う

投稿・固定ページ編集画面で【ブロックの追加 > 再利用可能】を開くと、登録済みの再利用ブロックが表示されるので選択して追加します。

再利用ブロックを編集する

その1:投稿・固定ページ編集画面で編集する

エディタに追加した再利用ブロックは、そのまま内容を編集できます。投稿や固定ページの「公開」や「更新」の際に、再利用ブロックの変更も更新されます。

ただし、再利用ブロックの状態で編集をすると、他の記事で使用している再利用ブロックにも影響します。

再利用ブロックの内容を記事ごとに編集したい場合は、ブロックツールバーから通常のブロックへ変換してから編集してください。

「通常のブロックへ変換」で再利用ブロックから切り離しができます

その2:ブロック管理画面から編集する

投稿・固定ページ編集画面右上のツールと設定をさらに表示すべての再利用ブロックを管理から再利用ブロックの一覧画面を開きます。(※1)

再利用ブロックの一覧画面から編集できます

各ブロックの[編集]からブロックの編集画面に入ることができます。

※1 現在のWordPressバージョン(5.4.2)においては、ダッシュボード内に「ブロック」のメニュー項目がありませんが、下記のようにURLを直打ちして開くこともできます。
https://exsample.com/wp-admin/edit.php?post_type=wp_block

再利用ブロックの用途例

定型文やCTAを登録しておく

例えば、補足や注意事項など記事内で頻繁に使う定型文を登録しておくと便利です。

また、CTA(Call To Action)のような内容を再利用ブロックとして登録しておいて、記事内の好きな場所に設置するといった使い方もできます。

再利用ブロック用途例:CTA

レイアウトのテンプレートとして使う

画像と文章などがレイアウトされたコンテンツ作成のためのテンプレートとして使うこともできます。投稿・固定ページ編集画面で使用する際は通常ブロックへ変換して個別に編集します。

2020/10/02追記

テンプレートとして利用する場合は、WordPress5.5から備わっている機能である「ブロックパターン」の利用をおすすめいたします。

再利用ブロック用途例:メディアと文章

このように複数のブロックを組み合わせることもできるので、ページテンプレートとしても使えそうです。

再利用ブロック用途例:複数カラム

JSON形式での書き出し・読み込みもできます

作成した再利用ブロックをJSON形式のファイルで書き出して、他のWordPressサイトで読み込んで使うこともできます。(テーマ独自のCSSは書き出されませんので、インポート後に調整が必要な場合もあります)

JSONからインポート・JSON形式でエクスポート

まとめ

ここでご紹介した内容以外にも、アイデア次第で色々な使い方ができると思いますので、再利用ブロックを活用して効率よく記事やコンテンツを作成できるようにしておきましょう。

再利用ブロックを機能拡張したテーマ

STORK19では、「再利用ブロック」をブログパーツとして 利用することができ非常に使いやすく機能拡張しています。再利用ブロックをボタン一つでブロックパターンに変換できたり、カテゴリーページに読み込むことができたりと多機能に利用可能です。

NEWモデル

STORK SE

よりコンテンツに集中させるテーマ
STORK SE(ストークSE)

STORK SEはシングルカラム(1カラム)に特化したテーマなので、より訴求力の高いページやブログ記事を作成するのに向いています。

究極のモバイルファーストテーマ
STORK19(ストーク19)

ブログを書くのが楽しくなる仕掛けや機能がたっぷり!STORK19は読む人も書く人も快適なWordPressテーマです。