simplicityでテキストリンクの色を変更する方法

正直な話をすると、ここにワードプレスの設定の記事を書いている理由のひとつは、

自分のためのメモ代わりです（笑）

覚えたと思っても、忘れてしまうことも多いので・・・・・

 

以前は、パソコンのメモ帳（テキストドキュメント）にメモしておいたのですが、

それだとPCのどこにテキストドキュメントをしまったのか探せないことが多いのです（笑）

 

そんなときに、ワードプレスの記事に書いておくと、設定方法を忘れたときに、

探すのは簡単だし、見やすいんですよね。

同じような目的でワードプレスを使ってらっしゃる方もいるんじゃないかと思います

話がそれたので、表題に戻します(^_^.)

 

テキストリンクの色を変えたい

ワードプレスは、使いやすいし、機能的にも大変優れていると思います。

プラグインを利用することによっても簡単に機能がアップしますからね。

 

特に私が使っているsimplicityというテーマには、使いやすくて、いつも感謝しています

 

しかし、私が、ひとつだけ、変更したいなと思ったのが、

初期設定のテキストリンクの色なんです。

simplicityでは、初期設定で、テキストリンクの色が　#2098A8　です

この記事を書いている時点です。

テキストリンクの色は、ワードプレスのテーマによって若干違うようですね

 

 

つまりこの色です

↓

 

この色だと、今この記事を書いているブログのようにテキストリンクをあまり使わない

ブログであれば、目に優しい色でとてもいいと思います。

 

しかし、ブログをホームページ風にアレンジしたウェブサイトで

トップページ（フロントページ）にメニューを作り

そこにテキストリンクをたくさん表示させるようなサイトだと

この薄い緑色だとテキストリンクが、目立たない気がします。

 

 

そういうケースで使用する場合は

個人的には、もう少しクッキリとした色にしたいと思い

今回、テキストリンクの色を変更することに挑戦してみました。

 

 

テキストリンクの色は何色にしたらいいか？

迷ったのですが、

やはり大手の企業サイト等で使われている色番号がいいかなと思いました。

 

少し調べてみると

やはり使われているのは、ブルーが多いですね。

 

ということでテキストリンクは、ブルー系の色にすることにしました。

ただ、完全なブルーだと、記事を書くときに記事の本文のテキストと

テキストリンクの色がダブってしまうので

少し色を変えました。

まあ簡単に言えば、某検索エンジンサイトの色を参考にさせてもらったということです。

 

 

早速、指示コードを入力してみたが

ネットで検索してテキストリンクの色を変更する指示コードを入力してみたのですが

なぜかどれもうまく反映されません(-_-;)

どうやっても　色番号　#2098A8　のままです。

 

不勉強ですみませんでしたm(__)m

ネットで「テキストリンクの色を変更　方法」と検索しても

うまくヒットしなかったのですが、私の探し方が下手だったようです。

よく探してみると、simplicityの基本設定のなかにちゃんとありました。

記事を追加修正させていただきます

 

実は、simplicity　では、簡単にテキストリンクの色を変更できます

以下で説明します

いやあ、本当に、simplicityってすごく便利なテーマですね！

それにしても検索してもなぜ出てこないのだろう？？？

 

 

simplicityのテキストリンクの色を簡単に変更する方法

 

 

１、ワードプレスの管理画面を開きます

外観　にマウスカーソルを合わせて　カスタマイズ　をクリックします

 

２、カスタマイズ画面が表示されたら

色　をクリックします

 

 

 

３、リンク色の　色を選択　をクリックします

 

 

４、リンク色を変更したい色番号がわかっている方は

そのまま色番号を入力します（下の写真の赤枠）

それ以外の方は、真ん中にある白い○を移動させて（下の写真の黒枠）

大まかな色を選択して

次に右側のスライドバーを上下に移動させて

好きな色を選びます（下の写真の青枠）

 

 

５、色の選択が終わったら

保存して公開　をクリックします

これでテキストリンクの色を好きな色に変更することができます。

※もし、テキストリンクの色が変更されない場合

Ctrl(コントロールキー）とF5キーを同時に押してキャッシュをクリアしてみてください。

 

 

 

また、この画面で、

リンクホバー色の設定も行うことができます！

リンクホバー色とは、マウスカーソルが乗ったときのリンク色で
デフォルト色は、#cc0033となっているようです

 

simplicityは、本当に使いやすいテーマですね！

 

スタイルシートでテキストリンクの色を表示させている場所を探して色番号を変更することもできます！

この方法は、CSSをいじってみたいという人意外は、

特に行う必要がないと思います

１つ前で紹介した方法がベストです。

 

※そのため、これ以降は、自己責任で行ってください

 

もう一度、軽く、現在の状況を確認しておきます

●ワードプレスのテーマ→　simplicity2

●テキストリンクの色　#2098A8（初期設定の色）を　#1111cc　に変更する

 

では、スタートです

 

１、まず、ワードプレスの管理画面の　外観　にマウスカーソルを合わせて

テーマの編集　をクリックします

 

２、テーマの編集　画面が表示されます

現在、子テーマを使用している場合は、親テーマに切り替えます

 

simplicity2を選択して　選択　をクリックします

 

 

３、すると親テーマ（simplicity2）のスタイルシートの編集画面が

表示されるはずです

 

そこで　アンカー　を探します

↓

 

するとやはり色番号が　#2098A8　になっています

ちなみにその下の色番号　#C03　は、マウスカーソルを合わせた時の色です。

※赤色です（#C03）

↓

 

４、好みの色番号に変更します

#2098A8　の部分を　#1111cc　に変更してみました

マウスカーソルを合わせた時の色は、このままでいいのでそのままにしておきました。

色番号を入力したら

 

忘れずに　ファイルを更新　をクリックして設定を反映させます

 

５、するとテキストリンクの色がブルー系に変更されたはずです

※もしテキストリンクの色が変更しない場合は

Ctrl（コントロールキー）とF５キー　を同時に押して

キャッシュをクリアしてください

 

するとテキストリンクの色が変更になると思います

 

 

●以前のテキストリンクの色

↓

 

●変更後のテキストリンクの色

 

とりあえず、こんなかんじで完了です

元に戻したい場合は、先ほどの手順で元の色番号に戻してください

 

ちなみにこのブログでは、テキストリンクをほとんど使用しないので

テキストリンクの色は変更していません。