記事を書いていて、「ここだけ注意書きとして目立たせたい」「手順を1、2、3と番号付きで見せたい」と感じたことはないでしょうか。
こうした装飾は、SWELLやCocoon、AFFINGERといった人気テーマでは専用ブロックとして用意されていることが多く、他のテーマに乗り換えると使えなくなってしまいがちな機能のひとつです。
Utopiaにも、記事を書くためのオリジナルブロックが標準で組み込まれています。プラグインを追加でインストールしなくても、投稿編集画面のブロック挿入ツールから呼び出すだけで使えます。
ブロック挿入ツールに「UTOPIA ブロック」が並ぶ
新規投稿を開き、左上の「+」ボタン（ブロックインサーター）をクリックすると、段落や見出しといった標準ブロックに加えて「UTOPIA ブロック」という専用セクションが表示されます。
ここには、Notice / Alert、Affiliate Button、Button、CTA Button、Contact Form、Accordion / FAQ、Speech Balloon、Styled Border Box、Step、Point Box、Float Imageの11種類が並んでいます。デザイン設定でサイト全体の配色やフォントを整えたあとは、このブロック群で本文の中身を組み立てていくイメージです。
注意書きは4パターンの色分けに対応
なかでも使う場面が多いのが「Notice / Alert」ブロックです。
設定パネルの「TYPE」から状態を選ぶと、情報・成功・警告・危険の4パターンで色分けされた注意書きボックスを挿入できます。タイトルの入力欄も用意されているため、「注意」「補足」といった見出しを添えることもできます。
レビュー記事で「ここは要チェック」と伝えたいときや、設定手順の途中で注意を促したいときに、文章だけで説明するより格段に伝わりやすくなります。
手順・要点・吹き出しで説明記事を読みやすく
操作手順を説明する記事では「Step」ブロックが便利です。番号付きのステップ形式でテキストを並べられるため、設定画面のスクリーンショットと組み合わせたハウツー記事に向いています。
強調したい要点は「Point Box」、装飾した枠で情報をまとめたいときは「Styled Border Box」、会話形式でメリット・デメリットを伝えたいときは「Speech Balloon」というように、内容に応じてブロックを使い分けられます。文章の横に画像を回り込ませたいときは「Float Image」も使えます。
ボタン・CTA・FAQ・フォームも一通りそろう
外部リンク用の「Affiliate Button」、通常の「Button」、行動喚起を目的とした「CTA Button」の3種類のボタンブロックに加え、よくある質問をまとめる「Accordion / FAQ」、問い合わせを受け付ける「Contact Form」ブロックも用意されています。
いずれもUtopiaテーマに標準で組み込まれているため、装飾ブロック用のプラグインをひとつずつ探して比較検討する手間がかかりません。プラグインが増えるほど、更新の手間や表示速度への影響も気になるところですが、その心配をひとつ減らせます。
使い方は「/」で呼び出すだけ
いずれのブロックも、通常のWordPressブロックと同じ感覚で使えます。本文中で「/」を入力し、ブロック名の一部（例えば「Step」や「Notice」）を打ち込めば、候補が絞り込まれてすぐに挿入できます。
すでに公開している記事に後から追加することもできるので、まずは目立たせたい一文に「Notice / Alert」を試してみるところから始められます。
まとめ：まずはブロックインサーターを開いてみる
装飾のためだけに専用プラグインを追加すると、サイトの表示速度や管理画面の煩雑さに影響することがあります。Utopiaでは、記事執筆でよく使う装飾がテーマに内蔵されているため、プラグインを増やさずに読みやすい記事を作成できます。
次に記事を書くときは、投稿編集画面でブロックインサーターを開き、「UTOPIA ブロック」の一覧を眺めてみてください。「Notice / Alert」や「Step」をひとつ挿入するだけでも、記事の見やすさは変わってきます。
