ずれる画像やリンク文字の設定カスタマイズ方法（FC2ブログ編）

2009年09月19日(土)

皆さんこんにちは。



輪になって稼GO!です＾＾

このコーナーでは
読者の皆様からのアフィリエイト関連のご質問に対するQ&Aを記事にしていきます。

今までは個別にメールでお答えしていたのですが、
もしかしたら同様のケースでお悩みの方って
結構いらっしゃるのかもしれないと思いますので
気になるものがありましたら、参考程度に気軽に読んでくださいね＾＾


初回の今回のテーマは、

FC2ブログのずれる画像や文字の設定、カスタマイズ方法についてです。


この件についてエディ友さんからご質問がありましたので、
設定方法を解説しようと思います＾＾


すでにお気づきの方もいらっしゃるかもしれませんが、

僕のブログ内のリンク文字や画像にマウスを置くと、
ボタンのように右下にずれるようになっています。


例えばですが、、


↓↓↓　画像の場合はこんな感じです。




↓↓↓　テキストリンクの場合はこんな感じですね＾＾


ブログアフィリエイト初心者講座


画像やリンクの上にマウスを置くと、まるでボタンのように右下にずれると思います。

（現在はテンプレート設定を変えた為ずれません。ご了承ください）


実はこの設定はテンプレートをちょっといじる事で簡単に出来ます。
ちょっと気分が変わっていい感じでしょ♪


参考までに以下にカスタマイズ方法を書いておきますので
ご興味のある方はぜひやってみてくださいね＾＾




１、FC2ブログ管理画面にログイン

２、管理メニューの環境設定からテンプレートの設定をクリック。

３、スタイルシート編集を選択してマウスポイントをCSSが書かれている枠の中に置く

４、そのままCtrl +　Fを押すと以下のような検索窓が出てきます。





その検索窓に、[　a:hover　］を入力して検索してみてください。


↓↓↓　後は、[　a:hover　］の部分に以下のような記述を入れればOKです＾＾


position:relative; top:1px; left:1px;


何箇所かありますので「次へ」ボタンを押して全て記述を変更すれば、
画像もテキストリンクもずれる画像とずれる文字へと設定できます。


ちなみに輪になって稼GO!の場合は以下のように記述してます（*^_^*）



a:hover { color: #FF0000;
position:relative; top:1px; left:1px;　}



positionの数字部分を変更すると、
ずれる方向や、動き方を変えられますよ☆


後はプレビュー画面で設定の反映を確認しながら、
皆さんの直感と感性で色々といじってみてくださいね＾＾


宜しかったらおためしあれ♪



※注意点

慣れないうちはHTMLやCSSをカスタマイズする時は、
メモ帳などに全てコピーを取っておいてから行いましょう！
そうすれば分からなくなった場合に、すぐに元に戻す事が出来ますよ＾＾

CSSの記述方法はテンプレートによって異なりますので、
もし上記の方法で設定が変えられなかったら、
皆さんがお使いのテンプレートの
公式ホームページのカスタマイズヘルプ等も参考にしてみてくださいね。




今回の記事が少しでも皆様のお役に立てたら幸いです（*^_^*）



・・・それではまた！
管理人　輪になって稼GO!でした(^O^)／