文字の色を変更する

WordPressでの色を変更する方法について解説していきます。

文字に色をつけることで、色の持つ印象を文字に持たせることができます。

ただし、注目してほしいからと言ってすべての文章に色付けてしまうと見にくくなってしまいます。

適度に注目してもらいたい文章に色を付けて目立たせるようにしましょう。

文字の色を変更するとは

まずは実際に文字の色を変更した例をご覧ください。

この文字は赤色に変更されています。
この文字は緑色に変更されています。
この文字は黄色に変更されています。
この文字は青色に変更されています。
この文字は紫色に変更されています。

文字の色を変更すると、通常、黒で書かれた文字の色を任意の色に変更することができます。

文字の色を変更することの効果

文字の色を変更することで、サイトに訪れてくれたユーザーに対して「色のもつイメージ」を与えることができます。

色の持つイメージとは、その色を見たときに人間が持つ感情の事です。

文章の途中に赤色の文字が目を引くと思いませんか？

これは多くの人が「赤」という色に対して「止まれ」というイメージを持っているからです。

また、文字を色を変更することによって、文章を華やかにすることができますので、積極的に活用していくとよいでしょう。

ただし、やりすぎは禁物です。やりすぎると下記のように見にくくなってしまいます。

文章を七色にしてみましたが、とっても見にくいとおもいませんか？

もちろん、文字の色を変更することと一緒に「文字のサイズを変更する」や「文字の太さを太くする」なども一緒に活用すると、さらに効果的です。

CSSではどのような記述となるか

太字を設定すると、太字部分を<span style=”color:#ff0000;”></span>で囲われます。(#ff0000の部分には選択した文字のサイズが入ります。)

一度文字の色を変更した後で、テキストビューで確認してみましょう。

下図のように<span style=”color:#ff0000;”></span>で囲われていることが分かるかと思います。

文字の色を変更した場合は、この「<span style=”color:#ff0000;”></span>」が挿入されているんだな、と覚えておきましょう。

文字の色を変更する方法

まずは文字の色の変更アイコンを表示させるために、ツールバーの隠れている項目を表示させます。
赤枠部分をクリックしてください。

文字の色を変更するには、変更したい文字の部分をドラッグして選択しましょう。

赤枠部分の「テキスト色」をクリックすると、文字の色を変更することができますが、デフォルトでは黒色が指定されていますので、変化がわかりません。

さらに赤枠部分の「▼」をクリックすると、色の変更を行うことが可能になりますので、ここでは赤色をクリックしましょう。

選択した部分の文字の色が赤色に変われば成功です。文字の色を変更すると、ビジュアルビューでも変更した色になることが分かります。

まとめ

文字の色を変更する効果ややり方について解説してきました。

せっかくユーザーにとって役に立つ記事を書いたとしても、読まれなければ意味がありません。文章を装飾することで、少しでもユーザーに読んでもらえるように工夫するとよいでしょう。

それでは今回のまとめです。