スマホの画面下に貼り付いている広告。露出が多いためクリックされる傾向があります。クリック広告で提供されているものが多く、アフィリエイト広告ではほとんど見かけません。それを貼り付ける方法をご紹介します。
スマホの画面下にアフィリエイトを広告する方法
方法としては「CSS」を使って貼り付けることになります。スマホ画面のヘッダやフッタに以下のCSSをコピペします。
<style>
#fixed_footer{
z-index: 1;
position: fixed;
right: 0;
bottom: 0;
text-align:center;
}
そしてヘッダやフッタにこのコードを貼り付け、アフィリエイト広告のコードを挿入します。
<div id="fixed_footer">
<----アフィリエイトのコード---->
</div>
スマホの画面下のアフィリエイトがうまく貼りつかない場合も
基本的なリンクと画像だけで構成されたアフィリエイトリンクなら、これでうまくいくでしょう。幅が合わない場合は<img>タグに以下のスタイルを追加してやればはまります。
style="width: 100%"
しかしアフィリエイトのコードが<script>で構成されている場合、きれいにはまらないことがあります。これは<script>のスタイルを調整してやればいいかもしれません。しかし広告によってそれぞれなので、ここでの説明は難しいです。
うまく貼れた場合はこのような感じで、スクロールしても表示されたままになります。
うまく貼れない場合はテキストのアフィリエイトでもOK
どうしても画像がうまく貼れない場合はテキストのアフィリエイト広告でもいいのかなと思います。その場合は先ほどのCSSをこのようにします。
<style>
#fixed_footer{
z-index: 1;
position: fixed;
right: 0;
bottom: 0;
width: 100%;
}
#fixed_footer p{
text-align:center;
background: #cde4ff;
border-top: solid 5px #5989cf;
border-bottom: solid 5px #5989cf;
}
そして実際の広告の方はこんな感じです。
<div id="fixed_footer">
<p><a href="http://h.accesstrade.net/sp/cc?rk=0100nafq00is03" rel="nofollow" target="_blank">Amazonギフト券を毎月100名様に！<img src="http://h.accesstrade.net/sp/rr?rk=0100nafq00is03" width="1" height="1" border="0" alt="" /></a></p>
</div>
広告テキストを＜p＞でくくって、それに枠をつけるわけです。するとこんな感じになります。
使い方次第でいろいろできるので、共有ボタンを並べている例も見たことがあります。参考にしてみてください。
