今回は、このブログでも愛用中のWordPressテーマ「WING(AFFINGER5)」における…
「本文&リンクテキスト」
の色設定をカスタマイズする手順
をご紹介していきたいと思います
まず「本文テキスト」について…
「本文テキスト」の色って、普通に考えると「真っ黒」なイメージですよね
でも実際には、「真っ黒」よりも「グレー味を帯びたブラック」の方が、視覚的に柔らかみが出て見やすいかなと思ってます

個人的におすすめなカラーコードは「#515151」で、今まさに見ていただいてる文章もまさにその色を使ってます
次に「リンクテキスト」について…
リンクテキストとは、そのテキストをクリックすることで指定のURLページへジャンプできる仕様のこと
↑ この青いテキスト部分のこと
で、この「リンクテキスト」の色は、一般的には「ブルー系」なイメージだと思います
ただ「ブルー」のなかでも、「クリック率が高くなる」とされる定番の色味みたいなのが、実は大体もう決まってます
なかでも有名なカラーコードの1つは、 #0044cc です
ということで今回は、そんな…
- 本文テキスト
- リンクテキスト
それぞれにおける、初期設定のカスタマイズ手順を解説していきます
ちなみに「WING(AFFINGER5)」の場合、このカスタマイズは超簡単です

それではさっそく見ていきましょー🐥
このブログのWordPress環境
- 使用中のテーマ:WING AFFINGER5
- 使用中のエディタ:クラシックエディタ
- 使用中のプラグイン:おすすめプラグイン17選 の記事にて公開しています
About me
- 専業ブロガー・フリーランス -
あずき
独立4年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^
【本文テキスト&リンクテキスト編】WING AFFINGER5における「色設定」のカスタマイズ手順
まずは、WordPressのカスタマイズ画面を開きましょう(下記手順です)
↑ WordPress管理画面 > 外観 > カスタマイズ をクリックします
↑ カスタマイズ画面が開いたら、左側のメニュー一覧から「各テキストとhタグ(見出し)」という項目をクリックします
↑ つづいて、「テキスト色一括変更」をクリックします
ここから…
- 本文テキスト
- 内部リンク
それぞれの色設定をカスタマイズしていきます
「本文テキスト」の色設定
さきほどのステップで「テキスト色一括変更」の画面を開けたら…
↑ 画面中央のプレビューから、投稿済みの記事があればクリックして開きましょう

↑ 記事のプレビュー画面が開けました。 初期設定では、画像のような「真っ黒」系になってます
この本文テキスト色を変更する場所は…
↑ この「記事内のテキストなど」という項目です

試しに壱度、露骨に目立つカラーにしてみます
↑ こんな蛍光グリーンです
中央のプレビュー画面を見てみると…
↑ グリーンに変わった場所が、この項目で反映されるエリアです
ちなみに…
↑ この「範囲を広げる」という項目にチェックを入れると…
↑ 一番上の「記事タイトル」を対象にできるだけでなく…
↑ このように、TOPページの記事一覧エリアまで反映させることができます
参考までに、僕が実際に使ってる色設定は下記です
↑ まず本文テキストで使ってるおすすめなカラーは、「グレー味を帯びたブラック」です
具体的には、「#515151」というカラーコード
そして、さきほどご紹介した「範囲を広げる」にもチェックを入れます

改めてプレビューで確認すると…
↑ こんな感じになりました。 画像では少しわかりづらいですが、ちょっと優しめなブラックに変わりました
↑ 記事一覧にも、同じカラーが反映されてます
↑ 設定できたら、画面上部の 公開 をクリックして設定を保存しましょう
これで、本文テキスト色のカスタマイズはOKです
つづいて、「リンクテキスト」の色設定も見ていきます

「リンクテキスト」の色設定
さきほどの「テキスト色一括変更」から、同じ画面で設定していきます
一度閉じてしまった場合は…
WordPress管理画面 > 外観 > カスタマイズ
> 各テキストとhタグ(見出し) > テキスト色一括変更
これでまた同じ設定画面に戻れます
ちなみに「リンクテキスト」の色は、初期設定だと…
↑ こんな感じ。 このカラーを…
↑「記事内リンク色」という項目で、好きな色に指定しましょう

で、僕はいつも…
↑ この色味を使ってます。 具体的には「#0044cc」というカラーコード

プレビューで確認すると…
↑ こんな感じになりました
設定できたら、また画面上部の「公開」をクリックすれば完了です
今回の「本文テキスト&リンクテキストの色設定」の解説は、これで以上となります
お疲れさまでした♪
あずき🐥
About me
- 専業ブロガー・フリーランス -
あずき
独立4年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^