タイトル文字に影をつけて読みやすくする
※下記の情報は、2014.8.13まで使用されていた旧レイアウトをご利用の場合のみ該当します。
「ヘッダーに画像を入れたら、
サイトタイトル文字がイマイチ見にくい～っ」
そんな状態に陥っている人はいませんか？
画像の加工ができてしまえば、ベストですが、
画像ソフトを使うハードルがちょっと高い。
そんな方の為に、右のような縁取りを、画像を加工なしで、簡単に作れる方法をご紹介します。（実際は、シャドウ＝影を入れる方法です）
▼やり方は簡単♪
「設定」→「ヘッダーを編集」を開いて、下記の内容を貼り付けるだけ。
↓ここからコピペどうぞ
<style type="text/css">
/*<![CDATA[*/
#emotion-header-title
{
text-shadow: 2px 2px 5px darkblue,
-2px 2px 5px darkblue,
2px -2px 5px darkblue,
-2px -2px 5px darkblue;
}
/*]]>*/
</style>
darkblueの箇所は、色指定です。 #000088と掲載してもOK.。
色設定のバリエーションは、「文字のサイズや色を変更する」ページでご確認ください。
【独り言】
文字の縁取りも試したみたのですが、影と比べるといまいち綺麗に表示されませんでした。
縁取りの文字を使いたい場合は、やはり画像ソフトで作成がよさそうです。