Wordpress

JINテーマの「吹き出し」をテンプレート化して効率よく使う方法

クボヒロ

こんにちは、クボヒロです。
(@Kubohiro7)

JINがアップデートして2.20Verになり、吹き出しブロックが使えるようになりました!

だけどこの機能、実際に使ってみると・・・毎回画像アイコンを選択しなければならない様子?!

これだと困るので、テンプレート化して効率良く吹き出しを使う方法をご紹介します。

JIN吹き出しブロックの使い方

まずはJINブロックから「吹き出し」のブロックを追加する。

  1. 画像を選択する(アイコンになります)
  2. アイコン名を記入する(長くてもOKでした)
  3. 吹き出しの中の内容を記入する

吹き出しの枠や色、配置なども簡単に設定することができる。

毎回、アイコンやアイコン名を入れる必要が?!

JINの吹き出しブロックは、ブロック追加の「吹き出しの追加」により行えますが、これを追加すると下記のブロックが出てきます。

クボヒロ

あれ〜前にアイコン選択したやつって出てこないの?もう一回選び直し??

文章(内容)は毎回入力するのはわかりますが、アイコンとアイコン名は毎回同じものを使いたいときってありますよね?

毎回アイコン画像とアイコン名を入力するにはちょっと骨が折れます。

こじかのふきだしクリエーターでは、テンプレート化できるものの色などは変えられない

こじかのふきだしクリエーターは、上記画像のように「アイコンとアイコン名」等を登録し、投稿エディタで呼び出す形になります。

これだといちいちアイコン画像やアイコン名を毎回入力する手間は省けます。が、このこじかのふきだしクリエーターにもデメリットがあって・・・、

上記の通り、登録した情報しか呼び出せません。色やアイコン名もエディタ内では変更することはできません。

クボヒロ

ちょっとアイコン名をいじりたいな〜、色を変えたいな〜ってときに不便なんだよね・・・一度決めてしまった情報でしか呼び出せないからね〜

こじかのふきだしクリエーターのエディタ内でのブロック設定は上記のみ。つまり、登録した情報を呼び出すだけです。もし色やアイコン名を変えたいなら、その都度ふきだしクリエーターの設定画面から登録しなければなりません。

クボヒロ

例えば、同じアイコンでも「ふきだし内の色をちょこちょこ変えたい!」ってときはその色を全部登録しなきゃいけないんだよね

ハムスター

ちなみに今はJINのふきだしブロックで吹き出しを作っているのだ。これなら登録なしでもボタンひとつで色を変えられるのだ!

JINふきだしブロックは、再利用ブロックに追加すればテンプレート化できる

JINのふきだしブロックでも、Gutenbergの機能の「再利用ブロック」というものに登録してしまえば、実質テンプレートのように使うことが出来ます。

ショートコードなどであれば、PCの辞書に登録してしまえば良いのかもしれませんが、ブロックはWordpressのGutenberg独自の機能なので文章として扱えません。なので、辞書登録も不可能です。

テンプレートの作り方

まずは吹き出しブロックを追加し、好きなアイコンとアイコン名を入れます。文章は入力しなくて構いません。

吹き出しブロックを選択した状態で、ブロックの設定(「…」となっているところ)をクリックします。「再利用ブロックに追加」が出てくるのでクリックします。

「無題の再利用ブロック」と出るので、好きなテンプレート名にします。保存を押して完了です。

テンプレートの使い方

ブロックの追加から、一番下にある「再利用可能」タブを開きます。作ったテンプレートはここに入っています。好きなものを呼び出しましょう。

呼び出した状態のままだと、このようにうっすら白くなっています。このままでは使うことができないので注意!!

クボヒロ

次のひと手間が必ず必要なので要注意!!!

吹き出しブロックを選択したときに出る「…」設定をクリックし、「通常のブロックへ変換」をクリックします。

クボヒロ

「再利用ブロックから削除」ではないから気をつけてね!!

あとがき

JINのアップデート2.20によって、Gutenbergのブロックでも吹き出し機能が簡単に使えるようになりました。嬉しいですよね。

あとは、この「再利用ブロック」がもう少しとっつきやすくなるといいなぁと思っていますw

ちなみにWordpressもアップデートして、ブロックエディタが少し変わっていました。こちらのブログめっちゃわかりやすかったので載せます。

WordPress 5.3のアップデート内容を紹介【主にブロックエディタが進化】ーbryog

関連する記事