【ワードプレス・ブロックエディタ】文章の一部の色を変える方法・文章にマーカーを付ける方法(Advanced Rich Text Tools for Gutenbergプラグイン・VK Blocksプラグインのご紹介)

文章の一部の色を変える・文章にマーカーを付ける

ワードプレスでホームページやブログを作成していて、文章の一部分だけ文字色を変えたいとか、文章の下にマーカーで強調したいという要望は多いと思います。

ワードプレスの編集がブロックエディタ(Gutenberg)になって、ブロックを積み上げていくように組み立てられるので大変便利になりました。

ですが、意外と上記のような文章の装飾ができないので、そんなちょっとした装飾を可能にするプラグインをご紹介させていただきます。

Contents

「Advanced Rich Text Tools for Gutenberg」プラグインの使い方

通常、ブロックでディタでは、段落や見出しのテキストの一部分だけ選択して色を変えようと編集画面右側ツールバーで指定しても、段落や見出しのすべてのテキストの色が変わってしまいます。

文章の一部だけ色を変えたい。

↓↓↓

文章の一部だけ色を変えたい。

まずは、「プラグイン」>「新規追加」をクリックし、プラグインの検索欄に「Advanced Rich Text Tools for Gutenberg」と入力してください。「Advanced Rich Text Tools for Gutenberg」プラグインが見つかったら、「今すぐインストール」次いで「有効化」してください。

「Advanced Rich Text Tools for Gutenberg」プラグインを「有効化」すると、ページの編集画面で、段落や見出しの画面右側ツールバーに以下のような設定項目が増えております。

「Inline Text Colour」は文字色を「Inline Background Colour」は背景色をそれぞれテキストの選択部分だけ指定できます。

文字色を赤に背景を黄色に指定

文章にマーカー(蛍光ペン)を付ける

今度は、文章に蛍光ペンのようなマーカーを付ける方法のご紹介です。マーカーを付ける方法は、いろいろありますが、簡単な方法として「VK Blocks」というプラグインを使います。

「VK Blocks」プラグインのインストール

「プラグイン」>「新規追加」をクリックし、プラグインの検索欄に「VK Blocks」と入力してください。「VK Blocks」プラグインが見つかったら、「今すぐインストール」次いで「有効化」してください。

「有効化」すると、ブロックエディタが拡張され、いろいろな装飾が使えるようになります。マーカーを付ける場合、ページの編集画面で、マーカーを付けたいテキストを選択し、段落ブロック上部のツールバーの右から2番目「v(さらにブロックツールを表示)」をクリックしてください。

色々出てくるブロックツールの中から「蛍光マーカー」をクリックしてください。

下記の例のように黄色い蛍光ペンでラインを引いたようになります(設定でマーカーの色は自由に変更できます)。

(例)蛍光マーカーで文章を目立たせたい。

また、「VK Blocks」は、他にもいろいろな装飾ができますので、以下の記事もご覧いただければと思います。

まとめ

以上のように、プラグインを利用することによって簡単にブロックエディタでも文章の一部分だけ文字色を変えたり、文章の下にマーカーで強調したりできますので、良かったらお試しください。

関連記事 Related Articles