WordPress再利用ブロックで効率よく記事を書こう！特徴（メリット）と便利な使い方・注意点

2021年4月12日

ワードプレスのブロックエディターには、従来のクラシックエディターにはない機能がたくさんあります。

ここでは、その中でも、覚えておくと便利な、”再利用ブロック”を紹介します。
再利用ブロックにコンテンツを部品化して登録しておけば、別のページでも効率よく使うことができます。

本記事では、

再利用ブロックの特徴
再利用ブロックの使い方
使用上の注意点を理解する

といった内容を紹介いたします。

再利用ブロックは便利ですが、使い方を誤ると、いつのまにか記事内容が書き換わってしまう、という事故も発生します。

ぜひ、本記事を最後まで読んで、使い方を理解しましょう。

※ワードプレスversion5.6および5.7へのアップデートにより、再利用ブロックの挙動が若干変わりましたので、2021年4月にこの記事をリライトしました。

”再利用ブロック”を簡単に知る

再利用ブロックは、作成したブロックを登録すると、他のページでも使いまわせる、という便利なブロックです。

使用するための基本手順3ステップは以下の通りです。

①登録したいブロックを準備する（主に固定ページや投稿の編集エディターで作成します）。
②準備したブロックを再利用ブロックとして登録する。
③登録した再利用ブロックを他の場所や別ページに挿入する。

以上、これだけの手順で、再利用ブロックに登録したブロックを別のページで何度でも再利用することができます。

”ブロックの再利用”の特徴（便利なポイント）

便利なポイントとしては、もちろん、同じコンテンツをすぐ取り出してコピーできる、という点ですが、それだけでなく、

元のブロックを編集すれば、子のブロック（挿入したブロック）にも反映されることです。

この特徴を生かして、主に次の２つの使い方が考えられます。

記事のテンプレート部品として使う

例えば、”注意事項”とか”1ポイントアドバイス”みたいな囲み枠を記事に挿入することがありますよね。

例えば、こんなもの。

こういった囲み枠のフォーマットはできればサイト内で統一したいですよね。

そこで、この枠だけをテンプレート部品として再利用ブロックに登録すると便利です。

再利用ブロックは、挿入した後、編集することも可能なので、テンプレート部品として使えるのです。

ただしこの場合、
登録元の再利用ブロックとは縁を切ることになりますので、登録元を変更しても挿入先には反映されません。

逆に登録元ブロックと縁を切らないと、
変更した内容が親ブロックにも反映されてしまい大変なことになるのですね。

登録元と同じコンテンツを複数のページで使いまわす

広告やCTAなど、同じコンテンツを複数のページで使いまわしたい場合がありますよね。

そんな場合にも再利用ブロックは大変便利です。

むしろ、テンプレートととしてより、
こちらの使い方の方が再利用ブロックの特徴を生かしやすいでしょう。

なぜなら、元ブロックを編集すれば、複数の挿入先のコンテンツにも反映されるからです。

CTAや広告は、
頻繁にキャッチコピーや画像を変更したりしますから、

変更内容が複数のページで自動反映されるのはすごく便利ですよね。

”ブロックの再利用”の使用方法

それでは、実際の使用例を見ながら、使い方を解説していきます。

コンテンツを準備する

任意の固定ページに再利用したいコンテンツを作成します。

ここではカバーブロックを利用して、以下のコンテンツを作成してみました。

カバーブロックの利用方法は、以下の記事を参考にしてみてください。

ワードプレス　ブロックエディター　カバーブロックで画像に文字を重ねる方法

ワードプレスのGutenberg（ブロックエディター）のカバーブロックの使い方を紹介します。カバーブロッ ...

https://web-children.com/2019/09/13/cover-of-block-editor-in...

固定ページのタイトルは、なんでもかまいません。
再利用ブロックの作成専用のページとして、”再利用ブロック登録”とかでもよいでしょう。

再利用ブロックに登録する

１．ブロック内ツールバーから”再利用ブロックの追加”

①ツールバー一番右の3点メニューをクリック
②”再利用ブロックに追加”をクリック

もし登録したいブロックが複数にまたがっている場合は、すべて同時に選択（SHIFTボタンを押しながらブロックを選択）して”グループ化”をしてから”再利用ブロックに追加”をすればOKです。

２．ブロック名を入力して保存

再利用ブロックの名前の入力ボックスが開きます。

初期値は、”無題の再利用ブロック”となっているので、変更入力して保存します。
この名前が再利用ブロック一覧に表示されますので、わかりやすい名前にしましょう。

ここでは、『セキュリティCTA』としました。

これで、再利用ブロックへの登録が完了しました。

※注意

ワードプレスversion5.7では、再利用ブロック登録時にブロック名入力ボックスが開かず、”無題の再利用ブロック”として登録されてしまうことがあるようです（おそらくバグなので、次のアップデートで修正されると思います）。

タイトルがこのままでは使いにくい（同じ名前のブロックばかりになってしまう）ので、登録後タイトルを変更しましょう。

タイトルの変更は、後述（再利用ブロックの編集方法）する再利用ブロックの管理画面でできます。

再利用ブロックの挿入

では、登録した再利用ブロックを挿入してみましょう。
別のページ（投稿でも固定ページでも構いません）の編集画面を開けて好きな場所に挿入します。

①画面左上の+マークをクリック
②再利用可能タブに切り替え
③登録した再利用ブロックをクリック

以上で再利用ブロックが挿入されました。

ここまでで、再利用ブロックへの登録と挿入をしてみましたが、すごく簡単ですね。

再利用ブロックの編集方法

登録した再利用ブロックは再利用ブロック管理画面で見る

元々は、任意の固定ページで作成しブロックを再利用ブロックに登録しましたが、いったん登録した再利用ブロックは、専用の管理画面で管理されています。

再利用ブロックの管理画面へは次の手順がわかりやすいでしょう。

①編集画面左上の+マークをクリック
②再利用可能タブに切り替え
③”すべての再利用ブロックを管理”をクリック

すると、次のような再利用ブロック管理画面が開きます。

登録した再利用ブロックは、ここに一覧表示されます。
投稿記事や固定ページの管理画面と同じですね。使い方も同じです。

再利用ブロックの編集変更

再利用ブロック管理画面でタイトルをクリックすると、編集エディターが開き、変更編集することができます。

試しに”セキュリティCTA”を開けると次のようになります。
登録時に入力した名前がタイトルになっています。タイトルを変更すれば登録したブロック名も変更されます。

ここで編集変更して右上の”更新”ボタンをクリックすると、各ページに挿入された再利用ブロックに反映される、というわけです。

編集変更内容の各ブロックへの反映

実際に、ここで次のように変更して更新してみましょう。

すると、もともと再利用ブロックを作成した固定ページおよび、再利用ブロックを挿入した別ページの両方に変更が反映されます。

このように、管理画面に登録した再利用ブロックの編集変更は、作成元および挿入先を問わず、この”セキュリティCTA”をいう再利用ブロックすべてに自動反映されるのです。

再利用ブロックを挿入先での編集は”通常のブロックに変換”してから

挿入した再利用ブロックを、親コンテンツとは別に独自に編集したければ、”通常のブロックに変換”で編集できるようになります。

”通常のブロックに変換”すると親となる再利用ブロックとは縁が切れるので、変更内容を他のページに影響しないようにできる、というわけです。

※ワードプレスversion5.6.2までは、再利用ブロックツールバーに明確に"通常のブロックへ変換“と表示されていましたが、version5.7ではアイコンに変わり、少しわかりにくくなりました。注意しましょう。

再利用ブロックの登録は再利用ブロック管理画面からでも可能

すでにお気づきかもですが、再利用ブロックを登録は再利用ブロックの管理画面でも可能です。

管理画面で”新規追加”からエディターを開け、投稿記事作成と同様にブロックを作成・登録します。

慣れてくると、こちらの方法の方がよいかもしれませんね。

もちろん、登録した再利用ブロックの削除もこの一覧表で実施できます。

再利用ブロック使用上の注意点

このように便利な再利用ブロックですが、注意しなければならない点があります。

それは、
挿入先のページにおいても再利用ブロックの編集変更が可能

ということです。

この場合、通常ブロックに変換せずに編集してしまうと、登録元の再利用ブロックも編集変更されてしまい、挿入した他のページにも自動反映されてしまいます。

ワードプレスversion5.5まででも挿入した再利用ブロックは編集可能でしたが、”編集”ボタンをクリックする必要がありました。

しかし、version5.6.2あたり（と思います）から、”編集”をクリックせずとも編集ができるようになりました。
一見便利なようですが、無意識のうちに再利用ブロックを編集してしまうことがあるのです。

通常ブロックに変換せずに再利用ブロックを編集変更した場合

ただし、挿入先で再利用ブロックを編集変更した場合、その記事の”公開”のときに再利用ブロックの変更を保存するかどうかを聞いてきますので、そこで気づくことができます。

下記のように、再利用ブロックを通常ブロックに変換せずに編集変更してしまうと、公開ボタンの横に警告として〇マークがつきます。

ここで、”公開”をクリックすると、再利用ブロックの名前とともに”保存しますか？”と聞いてきます。
ここで保存してしまうと再利用ブロックの編集変更が反映されてしまうわけです。
しかし、保存しないと公開ができません。

したがって、このような表示になったら公開せずに、冷静に再利用ブロックを元に戻し、”通常ブロックに変換”してから編集しなおすとよいでしょう。

再利用ブロックの使用時の注意点まとめ

このように、挿入先で編集変更するかどうかは、その利用目的によります。次のように考えればよいでしょう。

テンプレートとして再利用ブロックを利用する場合

この場合は、再利用ブロック挿入後すぐに”通常ブロックに変換”するようにしましょう。

そうしておけば安心です。

広告など使い回しコンテンツとして再利用ブロックを利用する場合

この場合は、編集変更する必要はありません。

間違って編集変更した場合は、公開時に再利用ブロックの保存を聞かれても絶対に保存しないことです。

保存した瞬間に、他のページにある広告コンテンツが書き換わってしまいます。

再利用ブロック管理画面へのアクセス方法

デフォルトのアクセス方法

再利用ブロックの管理画面へは、すでに紹介したように次の手順でアクセスできます。

実はこれ以外にもあと２つの方法があるので紹介しておきましょう。

ブロックエディター画面右上オプションメニューからアクセス

①ブロックエディター画面右上のオプションメニュー（3点メニュー）をクリック
②”すべての再利用ブロックを管理”をクリック

再利用ブロック内ツールバーのオプションメニューからアクセス

①再利用ブロック内ツールバーのオプションメニュー（3点メニュー）をクリック
②”再利用ブロックを管理”をクリック

ダッシュボードメニューからアクセスできるようにする

以上３つの方法がありますが、いちいちブロックエディターを開かないとアクセスできないのは、何かと不便に感じます。

そこで、テーマによってはダッシュボードメニューからアクセスできるようになっています。

例えば、このサイトでも使用しているテーマLuxeritasの場合は次のように　Luxeritas＞再利用ブロック　からアクセスできます。

あなたが使用しているテーマのメニューからもアクセスできないかどうか確認してみましょう。

もしテーマが対応していない場合は、functions.phpに次のようなコードを記述するとダッシュボードメニューからアクセスできるようになります（クリックでコピー可）。

function add_reuse_block_menu() {
add_menu_page( '再利用ブロック', '再利用ブロック', 'manage_options', 'edit.php?post_type=wp_block', '', 'dashicons-insert', 4 );
}
add_action( 'admin_menu', 'add_reuse_block_menu' );

ここで使用した関数add_menu_pageについては、ワードプレスCodexを参照してください。
関数内の最後の数字を今回は４としましたが、別の数字にするとメニュー内の位置を変更できます。
また、アイコンもdashicons-insertを変更すれば別のアイコンを表示することもできます。

※『functions.phpを編集したくない』という方には、次のセクションで紹介するプラグインReusable Blocks Extendedがおすすめです。

注意

functions.phpへの追記は、必ずサイトのバックアップをとってから実行するようにしてください。
また、子テーマを使用することをおすすめします。