fbpx
稼働実績17,000ブログ突破!お申し込みはこちらへ >>

【クリック率向上】アメブロでリンクの色を変更する方法

この記事では「【クリック率向上】アメブロでリンクの色を変更する方法」についてお伝えしていきます。

アメブロのリンクの色は様々なものに変更が可能ですが、クリック率が高い色は決まっています。そのため、自由に変えるのではなく、クリック率を高めることができる色への変更をおすすめします。

ここでは具体的なリンクの色の変更方法を解説していきますので、ぜひクリック率を高くする色を実践して見てください。

 

【本文編】リンクの色をサイト標準の「青色」にする方法

リンクの色を青色にするには以下を行うことで可能です。

なお、ここでご紹介するのは記事本文中のカスタマイズとなりますので、他の場所(サイドバー等)を変更したい場合、次に解説しているテーマ全体のカスタマイズをおすすめします。

 

【本文のリンク色を変更する方法】

  1. アメブロへログイン
  2. 「設定・管理」のページを開く
  3. 「フリースペース編集」をクリック
  4. 指定されたコードを貼り付ける
    ※下記のコードをフリースペースへ貼り付けます。

 

<style>
.skin-entryBody a,.articleText a,.subContents a {font-weight:bold;text-decoration:underline;color:#1111cc;}
</style>

 

リンクの色について

代表的な検索エンジンやサイトでは上記のように青色を設定しています。ただ、青色でも若干色が異なるのが特徴的です。

上記のコードの中で「color:#1111cc」がありますが、色を指定している「#1111cc」の部分を変更することで自由に色を決めることが可能です。(※上記の色は2021年のものです)

 

フリースペース編集とは?

アメブロの任意の場所に文章を自由に打ち込める項目で、半角10000文字を入力できます。この項目に指定のコードを入力し、保存ボタンを押せば作業は完了です。

リンク色の他にもグローバルメニューやサイドバーへのバナー設置なども指定のコードを入力する事で挿入することが可能です。

 

【ブログ全体編】CSS編集デザインへコードを入力

リンクの色を青色にする方法は「フリースペース編集」を使うだけでなく、CSS編集デザインを用いる方法でもリンクの色の変更は可能です。

この方法は上記のように本文のみではなく、ブログ全体のカスタマイズを反映させることが可能です。

 

【ブログ全体のリンク色を変更する方法】

  1. アメブロへログイン
  2. 「デザインの設定」のページに飛ぶ
  3. 「CSSの編集」をクリック
  4. 下記のコードをコピーし貼り付けを行う
    (※コードの記載は一番下に行います)
.skin-entryBody a,.skin-message a{
font-size:15px;
font-weight:bold;
color:#1111cc;
text-decoration:underline;
}

 

また保存する前に、リンクの色が青になっているかどうか確かめる事をおすすめします。この方法はカスタマイズした際、リンクの色が変わってしまったトラブルに役立ちます。

 

リンク以外で青色を使うのは控える

リンクの文字以外に文字を青色へと変えるのは控えた方がいいでしょう。

元々ネット上では「青文字=リンク」という一般的なルールがあり、ほとんどのサイトではこのルールに従っています。また利用者も同様で、青文字を見つけたらリンクだと思い、クリックしようとするのが一般的です。

 

例えば、強調したい文章を青色にしてしまった場合、ユーザーがクリックできないと勘違いしてしまう可能性があります。そのようなブログはユーザーの使いやすいさに反しますので、離脱率が高くなる傾向にあります。

こうしたリスクを避けるためにも強調したい文章は赤やピンク、オレンジなどにするのが妥当です。文字の装飾は色だけでなく、筆記体や太文字などでも目を引く事はできるため、青色以外にすることがおすすめです。

 

カスタマイズテーマの色は決まっている場合がある

アメブロでカスタマイズを行う場合、サイトの色は決められています。

例えば、ピンクと白を基調としているカスタマイズテーマなら、リンク色もピンクを採用しているといった形です。このような場合には、サイトの一般的なルールであるリンクを青色に戻すことも検討しましょう。

 

既存のカスタマイズテーマで色が指定されている場合には、上記のコードを利用して変更することが推奨されます。「フリースペース編集」や「CSSの編集」による色の変更は、このような場合に備えている方法です。

閲覧数を減少させないためにも、デフォルトで備わっている色を使うのではなく、一般的に浸透しているリンクの色を活用することをおすすめします。

 

まとめ

【クリック率向上】アメブロでリンクの色を変更する方法についてお伝えしてきましたが、いかがでしたか?

一般的にリンクの色は青と決まっているため、これ以外にすることは非推奨となっています。クリック率を高めていきたい場合には青色にしていくことをおすすめします。カスタマイズも簡単にできますので、ぜひ実践して見てください。