● スマホのリンクカラーをカンタンに青くする方法!

こんにちは、石川聡です。

あなたは、ご自分のブログをスマホで見たことがありますか。

何年も前からアメブロをされていますと、アメブロでのデザインがアメブロ側で自動的に指定されているケースが多いのです。

たとば、下の図のようなデザインになっている人、意外と多いかな。



この場合、デザインによってリンクの色が自動的に決められてしまいます。

上の図を見ると、リンクの文字はすべて薄いピンク。

一見、かわいらしい色に見えますが、スマホユーザーさまは本文の中のリンクがよくわかりません。

薄いピンクをリンクだと思っている人はいませんから、あなたが折角書いたサービスメニューへのリンクがクリックされないのです。

これ、あなたがご存じないだけで、ほとんどのユーザーさまがタップしません。

では、スマホでリンクの色を青くすることは不可能なのでしょうか。

いえ、可能ですよ。^^

下の図は、左が何もしてない状態。右が、ある方法を使った場合。



いかがでしょうか。

左や薄いピンク色。右は、青くてリンクだとすぐにわかりますよね。

「ブログ」と「こちらはテスト用の記事を書いたものです。」の色を見くらべてください。

選んだデザインによっては、こんなふうにパステルカラーになってしまいます。

そこで、どんなスマホ版がどのようなデザインであろうとも、必ずリンクを青くするしてくれるのでうs。

記事の最後に、次の文章をコピペしておくだけで、スマホのリンクカラーが変わります。

<style><!--@import url(http://subblog.web.fc2.com/bluelink.css);--></style>

この記述をそのままコピペして、記事を書くときに、文章のいちばん下に追加するだけ。

「毎回いれないとダメですか?」

はい、スマホの場合、パソコン版CSSみたいに一括でコントロールができません。

なので、毎回、記事の下にいれる必要があるのです。

アメケアをお使いの方は、この記述を最後に追加しておくと、自動ではいりますね。

私も、すこし前からやっています。

なので、スマホで見たときには、キレイな青ですよね。

ちなみに、これはタグなので、エディタの切り替えをしてからコピペしてください。

HTML表記に切り替えないとダメです。

通常の表記のままコピペしても、単に文字が入るだけなので気をつけてくださいね。


初心者の方のための、お店やお仕事ブログづくりを基礎からお手伝い。アメブログのプロフィール写真のアップの方法。

記事への画像の入れ方。リンクのつけ方、問合せ申し込みフォームの入れ方、デザイン、カスタマイズをサポートします。