【WordPress】ブロックエディタでテンプレートを実装する方法を解説

PR

【WordPress】ブロックエディタでテンプレートを実装する方法を解説
  • ブロックエディタで「よく使う言葉」や「よく使う枠線」をテンプレートとして作っておきたい
  • AddQcuicktagでやっていることをブロックエディタでもやりたい

こんにちは、わいつー(@yyblog_asuyaru)です。

WordPressはバージョン5.0から「ブロックエディタ」が標準のエディタになりました。

そして今後、WordPress全体が「ブロック編集」になるとロードマップで発表されています。

2021年は、フルサイト編集 (フェーズ2) をWordPress にマージすることに注力します。これにより、投稿やページだけではなく、サイト全体でブロック編集が使えるようになります。

~ 省略 ~

フルサイト編集: Gutenberg プラグイン、そして続いて WordPress コアに、サイトの全要素を Gutenberg ブロックを使って編集できる機能を導入します。これには、既存ユーザーの Gutenberg への移行を支援するために設計された、進行中のすべての機能が含まれます。

WordPress.org 日本語 – ロードマップ https://ja.wordpress.org/about/roadmap/

そのため、これからはブロックエディタに慣れる必要があります

この記事では、ブロックエディタを使う上で必要な以下の内容を紹介します。

この記事の内容

再利用ブロックってなに?

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

再利用ブロックを使う方法

再利用ブロックの使用例

この記事を読むと、こんなメリットがあります。

この記事のメリット

  • 再利用ブロックを使うことで、記事作成スピードが向上することがわかる
  • クラシックエディタでAddQcuicktagを使って実装していたことが、ブロックエディタで実装できることがわかる

この記事の結論は以下のとおりです。

この記事の結論

再利用ブロックは 「定型文」や「枠線」を登録し、簡単に呼出せるようにしたブロック
「AddQuicktag」でやっていたことが実装できる
再利用ブロックを作る方法は2通り
記事作成ページから作成
「再利用ブロックメニュー」から新規作成
再利用ブロックを使う時は「通常ブロックへの変換」を忘れないこと
元の再利用ブロックが変更されてしまうことを防ぐ
再利用ブロックは複数ブロック登録可能
お決まりのリード文やプロフィール等、固定的な内容を再利用ブロックとして使おう

再利用ブロックは「定型文」や「枠線」を登録し、簡単に呼出せるようにしたブロック

そもそもブロックとは

ブロックとは文字や画像などを書く単位のことです。

この記事でいうと、以下の図のようにそれぞれ赤枠が1つのブロックです。

各ブロックごとに、画面操作で簡単に装飾できますので、HTMLやCSSの知識が無くてもそれなりの見た目をした記事を書くことができます。

再利用ブロックとは

再利用ブロックとは、「定型文」や「枠線」を登録し、簡単に呼出せるようにしたブロックです。

クラシックエディタを利用している方は、「AddQuicktag」で「定型文」や「枠線」を登録して使っている人が多いと思います。

再利用ブロックを使うと、「AddQuicktag」で作っていたことをブロックエディタで実現できたり、よりスピーディーに記事が作成できるようになります。

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

この記事は以下の環境で解説しています(2021/6/27時点)。

環境に違いにより見た目や操作方法が異なる場合がありますので注意してください。

  • WordPressのバージョン:5.7.2
  • テーマ:Cocoon
  • テーマのバージョン:2.3.2
  • 子テーマ:Cocoon Child
  • 子テーマのバージョン:1.1.1
  • PHPのバージョン:7.3.26

再利用ブロックを作る方法は2通りあります。

  • 記事作成ページから作成
  • 「再利用ブロックメニュー」から新規作成

記事作成ページから作成

記事の中に他の記事でも使いたいブロックがある場合、

そのブロックを選択し、「①・・・」→「②再利用ブロックに追加」をクリックします。

画面の左下に「ブロックを作成しました。」とメッセージが表示されます。

これで再利用ブロックの完成です。

箇条書きリストをもう一度選択すると、メニュー内容が変わっています。

再利用ブロックが本当にできているか確認します。

必ず下書き保存をしよう!

記事作成画面から移動することになりますので、必ず事前に「下書き保存」をしましょう。

保存せずに次の操作を行うと、Google Chromeブラウザを使っている場合、以下のメッセージが表示されますので、キャンセルしましょう。

箇条書きリストのメニューから「①・・・」→「②再利用ブロックを管理」をクリックします。

再利用ブロックメニュー」に移動し、一覧に先ほど作成した再利用ブロックがあることを確認します。

タイトルが「無題の再利用ブロック」では使いにくいので、タイトルを変更します。

無題の再利用ブロック」をクリックします。

通常の記事を作成するような画面に移動します。

タイトルを変更します。

画面右上にある「更新」ボタンをクリックします。

画面左下に「再利用ブロックを更新しました。」とメッセージが表示されます。

画面左上の「WordPressロゴ」をクリックします。

先ほどの「再利用ブロックメニュー」に戻り、タイトルが変更されたことを確認します。

記事作成ページから再利用ブロックを作成する」方法は以上です。

「再利用ブロックメニュー」から新規作成

再利用ブロックメニューにはWordPress管理画面から行くことはできません。

まず記事作成画面に行きましょう。

右上の「①・・・」→「②すべての再利用ブロックを管理」をクリックします。

既存の再利用ブロックがある場合は一覧が表示されます。

新規作成するには、「新規追加」ボタンをクリックします。

再利用ブロックの作成画面に移動します。

通常の記事を作成するように、再利用したい部分のみ作成します。

タイトル」と「再利用したいもの」を書いたら公開します。

必ず「公開」状態にしておきましょう。

下書き保存状態では、後述する「再利用ブロックを呼出す」時に選択肢として出てきません。

画面右上の「公開」ボタンをクリックします。

「公開前チェック」を有効にしている方はもう一度「公開」ボタンをクリックします。

再利用ブロックを公開しました。」とメッセージが表示されます。

再利用ブロックが作成されたか確認しましょう。

画面左上の「WordPressロゴ」をクリックします。

先ほどの再利用ブロックが作成されていることがわかります。

「再利用ブロックメニュー」から新規作成する方法は以上です。

再利用ブロックを使う方法

再利用ブロックを使う時は、1つ注意点があります。

再利用ブロックを呼出した後は、必ず「通常のブロックに変換」しよう

再利用ブロックを呼出すと、元の再利用ブロックと内容がリンクした状態になります。

つまり、呼出した再利用ブロックを編集すると、呼出し元の再利用ブロックも更新されます。

再利用ブロックを呼出す

再利用ブロックを使いたいブロックで「」をクリックします。

すべて表示」をクリックします。

画面左側にメニューが出ますので、「再利用可能」をクリックします。

自分が作成した再利用ブロックが表示されます。

再利用ブロックを公開状態にしていないと表示されません

使いたい再利用ブロックを選択します。

記事に再利用ブロックの内容が表示されます。

再利用ブロックを呼出す方法は以上です。

再利用ブロックを通常ブロックに変換する

このまま編集すると、呼出し元の再利用ブロックも変わってしまいますので、再利用ブロックを通常ブロックに変換します。

再利用ブロックを呼出したら以下のメニューが表示されます。

通常のブロックへ変換」をクリックします。

通常ブロックのメニューに変わります。

通常ブロックへの変換方法は以上です。

再利用ブロックの使用例

ここまでは1つのブロックを再利用ブロックに登録する例で紹介しましたが、複数ブロックをまとめて登録することも可能です。

例えば、記事のリード文でお決まりの構成がある場合、リード文の構成を再利用ブロックにしておくと、スピーディーに新しい記事を書くことができます。

困る男
困る男

再利用ブロックの変換を忘れそう・・・

そんな方は、再利用ブロックに「呼出したらすぐ通常ブロックに変換すること!」という注意文も一緒に、目立つように登録しておきましょう。

まとめ:再利用ブロックで効率よくブログを書こう!

再利用ブロックは 「定型文」や「枠線」を登録し、簡単に呼出せるようにしたブロック
「AddQuicktag」でやっていたことが実装できる
再利用ブロックを作る方法は2通り
記事作成ページから作成
「再利用ブロックメニュー」から新規作成
再利用ブロックを使う時は「通常ブロックへの変換」を忘れないこと
元の再利用ブロックが変更されてしまうことを防ぐ
再利用ブロックは複数ブロック登録可能
お決まりのリード文やプロフィール等、固定的な内容を再利用ブロックとして使おう

再利用ブロックに自分でカスタマイズした「表」を登録する場合、注意が必要です。

現在ブロックエディタで作成する表は細かい調整ができません

細かい設定をする方法は「 【徹底解説】WordPress ブロックエディタで独自の表(テーブル)を作る方法 」で解説していますので、参考にしてください。

再利用ブロックはアイデア次第でいろんな使い方ができるので、みなさんなりの使い方を見つけてください。

ここまで読んでいただき、ありがとうございました。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA