アフィリエイトリンク画像をならべたり、寄せたりする方法

記事の最下部に300☓250サイズの広告を横に並べる時、ただ単に表を制作してならべたら、Googleさんにモバイルで不適切という通知を受けていたので、修正しました。

そして、Amazonなど縦に横長い広告は記事文字も回り込みの感じにしたいので、忘備録として残しておきました。

広告を3つ横並べにする

<div style=”float:left;padding-right:10px;”>
広告アフィリエイト
</div>
<div style=”float:left;padding-right:10px;”>
広告アフィリエイト
</div>
<div style=”float:left;padding-right:10px;”>
広告アフィリエイト
</div>
<div style=”clear:both;”></div>

2列の場合は、下記を削除　：　4列の場合は最上部に下記を書き加える

<div style=”float:left;padding-right:10px;”>
広告アフィリエイト
</div>

最後に<div style=”clear:both;”></div>を忘れないようにしてください。

広告は右側で文章回り込み

アマゾンなどの細長の場合、文章に回り込みした感じにしたいので、右の広告「王道SEO]のようにしました。

テキストに下記をコピーするだけなので、とてもカンタンに広告を設置できます。

<div style=”float:right;padding:10px;”>
アフィリエイト
</div>

本文

<div style=”clear:both;”></div>

広告は左側で文章回り込み

右側と同じで、細ながい記事を文章に回りこむ感じで、設置します。

テキストに下記をコピーするだけなので、とてもカンタンに広告を設置できます。

強調したい商品の時には、画像→説明文の方がわかりやすいですね。

<div style=”float:left;padding:10px;”>
アフィリエイト
</div>

本文

<div style=”clear:both;”></div>

理想通りの記事の大きさがない場合など、記事文章に埋め込む方が、広告が浮かないですね。

もしよろしければ、ご使用ください。