ブロックエディタ 公開日:
【画像付き詳細解説・初心者向け】便利!再利用ブロックの使い方2:活用編
WordPressのブロックエディタに備わっている便利な機能、「再利用ブロック」の使用方法です。
前の投稿で、同じページ内で再利用ブロックを作成し、貼り付ける方法を紹介しました。
今回は、保存しておいた再利用ブロックを異なるページで呼び出して貼り付け、アレンジする方法を説明します。
前の投稿はこちらです。
保存してある再利用ブロックを、別のページで使う
これは、新しい固定ページです。今回は「メニュー」というページ名にして、ドリンクメニューの表示を再利用ブロックを繰り返し使って作りたいと思います。
まず、新しいページにで再利用ブロックを呼び出してみます。
ブロックを挿入する最初の行のところで、画面の左側にブロックインサーターを表示させます。
ブロックインサータ―には、3つのタブがあります。通常、「ブロック」のタブが表示されていますが、右にある「再利用ブロック」を選んでください。(青枠)
タブ内に、登録済の再利用ブロックが表示されます。前回作った「menu」という名前のブロックです。
この再利用ブロックのアイコンにカーソルを近付けると、ブロックのプレビューを確認できます。(赤枠)
アイコンをクリックして、ブロックを挿入します。
再利用ブロックがエディタ部分に表示されました。
ブロックリスト内では再利用ブロックは、ひし形を2枚重ねたようなアイコンが目印です。
まず、挿入したブロックを「通常のブロックへ変換」します。
このブロックのテキストや画像を変更する時に、「通常のブロックへ変換」をしていないと、保存してある再利用ブロックも一緒に内容が変更されてしまいます。
最初に作ったひな型をずっと使いたい場合は、「通常のブロックへ変換」をすることをお勧めします。
これは、習慣づけておくと良いと思います。
「通常のブロックへ変換」をして、このブロックはカラムブロックになりました。
複数個の再利用ブロックを追加
同様に、再利用ブロックをあと3ブロック追加しました。
これらも全て「通常のブロックへ変換」をします。
呼び出した全ての再利用ブロックが、カラムに変更されました。
再利用ブロックをひな型として編集
ここまできたら、あとはそれぞれのブロックのテキストや画像を差し替えていきましょう。
このように、1番上のカフェラテのひな型と同じレイアウトを維持しながら他のメニューを作りました。
ページのプレビューを見てみます。
再利用ブロックの便利なところは、ブロックエディタ内で作ったレイアウトやデザインを保存し、いつでも繰り返して使えるところです。
カスタムフィールドのプラグインや、ページをまたいだコピー&ペーストをしなくても、簡単に繰り返しの作業ができます。
また、再利用時したデザインを応用して、違う新しいデザイン・レイアウトを作った場合も、それを更に別の再利用ブロックとして登録することが可能です。
再利用ブロックを管理
最後に、再利用ブロックの一覧ページを確認しておきたいと思います。
エディタ画面で使う場合は、ブロックインサータ―の「再利用ブロック」タブから選べばOKです。
保存した再利用ブロックを一覧で見たり、再利用ブロックそのものを編集したい場合、再利用ブロックを管理するためのページがあります。
エディタ内で、画面右のツールバーの上部の縦3点リーダをクリックします。
エディタの表示等の設定項目が表示されます。その中に、「再利用ブロックを管理」という選択肢があります。
「再利用ブロックを管理」(赤枠)をクリックしてください。
登録済の再利用ブロックが一覧表示されます。
最初にカフェオレのブロックを呼び出した時には、ひとつしかブロックがなかったのですが、ブレンドコーヒーのブロックを作った後に、これを再利用ブロックに登録し、現在は2つの再利用ブロックがある状態です。
ここから直接再利用ブロックを編集することも可能です。
また、この再利用ブロックを管理する画面は、テーマによっては管理画面のサイドバーに表示されていることもあります。
まとめ
2回にわたって、再利用ブロックの初歩的な使い方をご紹介しました。
ここで、どんなブロックを再利用ブロックにするか?を考えてみます。
・気に入ったレイアウトを作った時
・制作してもらったレイアウトを他の場所でも使いたい時
・テキストや画像だけ変更して、デザインをくずさないで繰り返し入力したい時
などが、再利用ブロックを作るタイミングです。それ以外に
・固定ページの内容を書き換えたいけれど、後で見返せるように、部分的に保存をしておきたい時
なども便利です。
書いてある内容を変更せずに保存したい場合は、再利用する前に「通常のブロックに変換」をするのを忘れないようにしてください。