wordpressで記事本文のリンクの色だけを変え下線を入れる方法

記事のリンクの色のみを青く変えることに成功!

wordpressの記事中のリンクの色だけを変える方法がなかなかわからず、かなり苦戦したので、ここにその作業方法を書き残しておきたいと思います

リンクの色を黒から青に代え下線を入れたかった

自分が入れたテーマのデフォルトではリンクの色が黒の状態で下線もありませんでした
(画像はクリックで拡大します)

記事のリンクの色を青に代えたかった

これではどこがリンクなのか、サッパリわかりません (@_@;)
これを青くして下線も入れ、訪問者にも「これはリンクですよ」ということをわかりやすくしたかったため、変更する作業をしました

スタイルシート:CSSをいじってリンクの色&下線を変更します

まずは

外観→テーマの編集→スタイルシート(CSS)

スタイルシートを出します

そしてスタイルシートの中の
記事エリアを操作している部分を探します

スタイルシート:記事本文のリンクの色を青くする方法

見つけましたら、そこに変えたい情報を打ち込んであげます

私のテーマの場合は
・post_content に情報を打ち込むことで、記事中の設定を変更できるようになっていたので、こちらに情報を打ち込んであげます

こんな感じで・・・

スタイルシート:記事本文のリンクの色を青くする方法

post content(記事本文) a(リンク) の {}(変更内容) と言った感じです
記述の内容等についての詳細は、こちらのサイトを参考にさせていただきました

http://dokidome.com/wp-customize/480/

こちらのサイトでは entry-content という場所に変えたい内容を記述しておりますね

というわけで無事、記事中のリンクの色のみを変えること&下線をつけることに成功しました (*´ω`*)

記事のリンクの色のみを青く変えることに成功!

ちなみにこれを理解するのに、私は3時間もかかってしまいました orz…
初心者アフィリエイターはこうやりながら1つ1つ覚えていくしかないですね 笑)

 

サイト全部のリンクの色をいっぺんに変えることも可能です

 

スタイルシートをいじれば、記事リンクの色だけではなく、サイト全部のリンクの色をいっぺんに変えることも可能です♪

まずは同じように

外観→テーマの編集→スタイルシート(CSS)

スタイルシートを出します

そしてスタイルシートの中の
基本設定をしている部分

a {} という場所を探します

サイトのリンクの色を青に変える

a はリンクを意味するので aに続く {} の中の情報を変えてあげます

そうすることで、本文中だけではなく、全部のリンクの色が変わりました

サイトのすべてのリンクの色を青く設定する

ただ、私のwebサイトの場合

色んな所にリンクが貼られているのと、タブリンクまで青く変化してしまうと、どうしてもうるさいイメージになってしまうので

ウエブサイトのリンクの色をすべて青くする設定

本文中のリンクの色だけを青くすることにしました

リンクを青くする&下線を入れてあげることで
クリック率が上がることは色々なところで叫ばれてます♪

スタイルシートをちょっといじるだけで、変更することができるので(初心者の自分でもできたので大丈夫!)

ぜひ試してみてください♪

スポンサーリンク

ABOUTこの記事をかいた人

あっき

2009年:28歳の時に、NZへ1年間、さらにイギリスに3年弱のワーホリ&海外ボラ生活に挑戦。日本に帰国後はフリーター生活をするも、自分の求めている人生とは違うと感じ、自分の力で生計をたてていくことを決意。現在はアフィリエイトを中心にノマドしながらフラフラと生きています♪