ブログパーツをcssでカスタマイズ
07/10/05 Comment(2) Trackback(0)

アフィリエイトインテリジェンスさんで、楽-yahをcssでカスタマイズする方法を紹介してもらいました。

以前からcssを利用できるようにしてありました。
ところが、告知するのを忘れてました!

本家がこれではダメですね……。

アフィリエイトインテリジェンスさんの記事を読んで思い出しました。ありがとうございます!

ちなみに、楽-yahのフィールドはこんな感じになっています。
ご自分でcssを編集すれば、こんな「かっこいいデザイン」も可能になります。

他のブログパーツ(Amazon360楽市360)も同じようにidを入れてあります。その内訳は順次公開します。

タイプ1
<tr>
<td class="r-main1" style="font-size:x-small;" align="left" >
<div class="r-sub1"><a href="" target="_blank">商品名</a></div>
<div class="r-sub2">
<font size="-1" color="#636363">商品説明</font>
</div>
</td>
<td width="60" class="r-main2">
<div class="r-sub3">
<center>
<b><font color="#990000">○○○円</font></b>
</center>
</div>
</td>
<td width="50" align="center" class="r-main3">
<a href="商品URL" target="_blank">
<img alt="楽天市場" src="" border="0"/><br>
<small>ショップ名</small>
</a>
</td>
</tr>
・・・

タイプ2
<tr>
<td class="r-main1" style="font-size:x-small;" align="left" >
<div class="r-sub1"><a href="" target="_blank">商品名</a></div>
<div class="r-sub2">
<font color="#636363">商品説明</font>
</div>
<div class="r-sub3">
<b><font color="#990000">○○○円</font></b>
<a href="商品URL" target="_blank">ショップ名</a>
</div>
</td>
</tr>

タイプ3
<tr>
<td class="r-main1" style="font-size:x-small;" align="left" >
<div class="r-sub1"><a href="" target="_blank">商品名</a></div>
<div class="r-sub2">
<b><font color="#990000">○○○円</font></b><br>
<a href="商品URL" target="_blank">ショップ名</a>
</div>
</td>
</tr>

タイプ4
<tr>
<td width="60" class="r-main1">
<a href="" target="_blank"><img src="商品画像URL" /></a>
<td class="r-main2" style="font-size:x-small;">
<div class="r-sub1"><a href="" target="_blank">商品名</a></div>
<div class="r-sub2"><font size="-1" color="#636363">商品説明</font></div>
</td>
<td width="60" align="center" class="r-main3">
<div class="r-sub3">
<b><font color="#990000">○○○円</font></b>
</div>
</td>
<td width="50" align="center" class="r-main4">
<a href="商品URL" target="_blank"><img alt="楽天市場" src="ロゴURL" border="0"/><br>
<small>ショップ名</small></a>
</td>
</tr>

タイプ5
<tr>
<td width="60" class="r-main1">
<a href="" target="_blank">
<img src="" /></a>
</td>
<td class="r-main2" style="font-size:x-small;">
<div class="r-sub1">
<a href="商品URL" target="_blank">商品名</a></div>
<div class="r-sub2">
<font color="#636363">商品説明</font></div>
<div class="r-sub3"><b><font color="#990000">○○○円</font></b>
<a href="商品URL" target="_blank"><small>ショップ名</small>
</a
</div>
</td>
</tr>

タイプ6
<tr>
<td class="r-main1">
<a href="商品URL" target="_blank"><img src="商品画像URL" /></a>
</td>
<td class="r-main2" style="font-size:x-small;" align="left" >
<div class="r-sub1"><a href="商品URL" target="_blank">商品名</a></div>
<div class="r-sub2"><b><font color="#990000">○○○円</font></b>
<a href="商品URL" target="_blank">
<small>ショップ名</small>
</a>
</div>
</td>
</tr>

タイプ7,8
<td class="r-main1" valign="top" align="left" style="font-size:x-small;">
<div class="r-sub1">
<a href="商品URL" target="_blank">
<img src="商品画像URL"/>
</a>
</div>
<div class="r-sub2">
<a href="商品URL" target="_blank">商品名</a>
</div>'+'<div class="r-sub3">
<b><font color="#990000">○○○円</font></b><br>
<a href="商品画像URL" target="_blank">
<small>ショップ名</small>
</a>
</div>
</td>

トラックバック


※当サイト内ページへのリンクがないと、受け付けない仕様になっています
トラックバック一覧
コメント
Posted by うか at 07/10/09

勝手に紹介させていただきましたm(_ _)m
それにしても、このセレクタ公開、すっごくありがたいです!
ただですらポップアップ機能でクリック率が高い楽-Yahに、ちょっとだけ見た目のエッセンスを加えてさらにクリック率が高まればいいなーなんて思ってます。

Posted by かん吉 at 07/10/14

>勝手に紹介させていただきましたm(_ _)m

こちらこそ、ありがとうございます。
見た目の綺麗さもクリック率に影響あると思います。今回のうかさんのTipsは、すばらしいです。

私も逆輸入で利用させて頂きますよ♪

コメントを投稿
上の情報を保存する場合はチェック
月別エントリー
2009年6月(5)2009年5月(12)2009年4月(6)2009年3月(4)2009年2月(4)2009年1月(6)2008年12月(4)2008年11月(5)2008年10月(4)2008年9月(8)2008年8月(6)2008年7月(4)2008年6月(4)2008年5月(6)2008年4月(7)2008年3月(8)2008年2月(14)2008年1月(22)2007年12月(10)2007年11月(10)2007年10月(5)2007年9月(7)2007年8月(5)2007年7月(16)2007年6月(1)2007年5月(4)2007年4月(9)2007年3月(9)2007年2月(10)2007年1月(20)2006年12月(6)2006年11月(15)2006年10月(11)2006年9月(27)2006年8月(9)2006年7月(5)2006年6月(11)2006年5月(2)2005年9月(1)
264
228