Seesaaブログの文字色とリンクの色の変更方法について解説していきます。
手軽にできてクリック率のアップにもつながるので、ぜひやってみて下さい!
変更する文字とリンクの色
今回変更するのは以下の4つです。
リンクの色
リンクにマウスポインタを重ねたときの色
クリック済みのリンクの色
Seesaaブログの文字&リンクの色の変更方法
まずはSeesaaブログにログインします。ログイン後、画面右上の「ブログを書く」をクリックしたら、デザインを変更するブログを選びます。
デザインを変更するブログの「デザイン」をクリックします。
続いて「CSS/HTML編集」をクリックし、デザインタイトルを選択する画面を表示させます。現在使用中の「デザインタイトル」をクリックして、CSS/HTMLを編集する画面に移動します。
表示した画面からスタイルシートを編集できるので、以下のタグをスタイルシート枠内の一番下にコピペします。
以下のタグをコピペして下さい。
.text{
color:#333333;
}
a:link{
color:#0044CC;
text-decoration:none;
}
a:hover{
color:#0044CC;
text-decoration:underline;
}
a:visited{
color:#0044CC;
}
こんな感じで貼り付けます。
タグをコピペしたら画面をさらに下にスクロールして「保存」をクリックして編集完了です。
編集したブログを見て、リンクや文字の色が変わっていれば成功です。
【変更前】
【変更後】
しっかり色が変わっていますね^^
タグの意味は?
今回ご紹介したタグは、一般的に使われているリンクや文字の色に設定しました。
「他のブログと差別化したい!」
「ブログに特色を出したい」
といった方は、それぞれの色を指定するコードを変更してもらえばOKです。
それぞれのタグが対応しているポイント
a:link・・・リンクの色
a:hover・・・リンクにマウスポインタを重ねた時の色
a:visited・・・クリック済み(訪問済み)のリンクの色
今回のタグは、#333333;このような「色コード」ですが、#red といったように英語で色を入力してもその色に変更することができます。ただ細かな色の調整はできないので、色コードで入力するのがおすすめです。色コードは以下のサイトで紹介しています。
>>色コード一覧
いちいちサイトを開くのが面倒なら、デスクにこういった本を一冊準備しておくと便利ですよ!
>>おすすめの本