ブログを書いていると、当然レビュー記事なども書くことが多いと思います。
レビュー記事に商品リンクを貼って、それを読んだ読者にリンクを踏んで購入してもらうというのが理想ですが、
その大事な商品リンクがショッボいと
こんな顔になります。
この人、買ってもらおうという気持ちが全然ないんだな、そういうの気にしない人なんだなと。
角印を押されます。
ユーザーは帰ります。
と自分はそれくらい無頓着なリンクは嫌なんですが、自分が”書く側”の立場だからこう思うのかも。
リンクをまさかアフィリエイトリンクだなんて思わない一般の人は、そんなこと全く気にしないかもしれませんｗ
カエレバ・ヨメレバのおすすめカスタマイズ
自分はcss初心者もいいとこです。
自分で1からいじれ、作れと言われても無理なので、なにかいいテンプレcssはないかと探していたら、ドンピシャで可愛いcssタグを紹介しているブログさんを見つけました。
いいカスタムタグはないかとググってて、WordPressテンプレート「STINGER」っていうやつのカスタム方法ならいくつか出てくるんだけど、自分はSimplicityを使っているので、STINGER用ではようわからんので参ってました。
自分なりにカスタムしてみてもやっぱりうまくできませんでした。
そんな中、えむ氏さんが紹介しているコードは、どのWordPressテーマでも使えます！（多分！）
こちらに書かれている通りにcssを追加すると、こんな感じに。
デフォルトのままです。
黒×オレンジ×赤、色合いも絶妙、ボタンも可愛い！
完全に一目惚れです。
色を変えたいときには
cssのこの部分のカラーを変更すればOKです。
（Screenpresso初めて使って画像作ってみたｗ）
マウスオンの時は勝手に背景色が薄くなるんじゃなくて、ちゃんとこっちで色指定をしてあげる必要があるので、そこだけ注意です。
ブログ内でカエレバ・ヨメレバ、どっちも使いたい時
このヨメレバのテーマにカエレバのテーマも追加したい場合は、
お互いのタグが干渉しないようcssを追加する必要があります。
その場合は、こちらを参照すればOK。
こちらのデフォルトタグでは「Amazon」「楽天市場」のみの表示なのですが、これにYahoo!ショッピングも追加してみました。
そのタグがこちらです。
|
1 |
これをダッシュボード→テーマの編集をクリックするとはじめに出てくる、「style.css」の一番下に追加すればOKです。（Simplicityで動作確認済）
表示はこんな感じになります。Yahoo!ショッピングは青色にしました。
※追記
すいません、もうYahooショッピング還元率低くて使わなくなっちゃったので画像で失礼します。
もうWordPressでブログ書いてると、記事の更新よりデザインをいろいろいじるのが
楽しくて仕方なくなっちゃいますよね。そんなことしてる暇あったら1つでも多く記事入れろ！って毎回自分に対して思うけど、こればっかりは脳汁が出るくらい楽しいので仕方ないです。
WindowsLiveWriterの場合は、タグ挿入した時デフォルト設定をいじらないように
Simplicityをお使いの方は、
こちらの方法でWindowsLiveWriter（以下WLW）でもブログのデザインと同じ状態で記事を書くことができます。
この記事もWLWで、こんな感じで書いてます。
で、カエレバとかヨメレバのHTMLコードをWLW内に挿入すると、WLW上でもちゃんとブログと同じ表示でリンクが出るんだけど、
リンクを挿入した真下が不自然にあいちゃうんだよね。
選択するとこんなんなって、拡大縮小すると小さくできるんだけど、
そうするとモバイルで見たときにレスポンシブ表示がされなくなります。
↑正常に表示されてる状態。
崩れて、横長になってしまい、横スクロールが出ちゃってる状態。
横スクロールが出てしまうと、モバイルから、特に寝転がりながら読んでる人にとってはストレス以外の何物でもありません。
なんにもいじらなければ、綺麗にレスポンジブ化されます。
ちょっとでもいじれば、PCでは正常に見れるんだけどモバイルでデザイン崩壊。
なんでかはサッパリわからないけど、この不自然なスキマは我慢するしかなさそうです。
でも実際にブログで見るとそんなに気にならないので、すぐ慣れると思います。
改善方法知ってる方いたら、是非教えてください(笑)。
商品リンクは見栄え・遊び心が大事！
いろんなブログを見ていると、SNSシェアボタンとか、商品リンクとか、オリジナルですごく可愛く作ってる人いますよね。
例外なくCSSに強い方たちだと思うんですが、
ブログ・サイトもその人の一部なわけで、個性的なもの・オリジナリティあふれるものを見ると「ギャアアアア！！このデザイン好きいいいい！！」って興奮します。
「可愛い物を見せてくれてありがとう。あなたのリンクから買い物しちゃう！」ってレベルにまで達します。（少数派？）
たま～には、ブログのデザインに時間を割くことも必要かもね！