Amazonアソシエイトのイージーリンクを指定箇所へランダム表示させる方法
2019年2月20日ブログ関連WordPress,ブログ関連
Amazonアソシエイトのウィジェットは2018年7月以降のChromeだと自動で動作しなくなりました。
ユーザーが手動で広告を動かす、というなんだかよく分からない事になっています。そこで今回、自動的にランダムで内容が変わる様な広告表示をしたく調べて見ました。
上手く出来たのでメモとして残しておきます。
スポンサーリンク
やりたかった事
別に管理しているサイトに付ける広告で、バナーリンクを取り付けることにしました。
その際、フッターとして登録しているテンプレートファイルに広告を取り付けるので、複数ページでいつも同じ広告が出続けることになります。
見ている方も同じ物が出続けるのはストレスなので、違うページに移動または更新した場合に違うバナーが出る様にしたかったのです。
やり方
リストを作りランダムで表示させるという方法で、具体的にはこんなJavaScriptです。
<div id="myplace"></div>
<script type="text/javascript">
var lists=[
'バナーリンクのイージーリンクで表示されたコード 1つ目',
'バナーリンクのイージーリンクで表示されたコード 2つ目',
'バナーリンクのイージーリンクで表示されたコード 3つ目',
'バナーリンクのイージーリンクで表示されたコード 4つ目',
'バナーリンクのイージーリンクで表示されたコード 5つ目',
];
var rNo = Math.floor(Math.random() * lists.length);
document.getElementById('myplace').innerHTML = lists[rNo];
</script>この「’バナーリンクのイージーリンクで表示されたコード 1つ目’,」の所ですが、コードの「＜」から「＞」までを「’（シングルクォート）」で囲ってやれば大丈夫です。
表示させたいバナーの数だけ行を作って下さい。なので3つなら3行ですし、二桁あれば二桁行になります。
参考にした記事
参考にしたのはこちらの記事です。
参考サイトが参考にしていた記事はこちら。
この両方を参考にして無事目的を達成できました。
参考記事は商品の個別リンクをランダム表示させたい場合でしたが、改めて見ると参考の参考記事の「
サンプルソース sample1.html 」とほぼ同じ内容になってますね。
また参考の参考記事では文字をCSSで整えたり、複数アイテム表示させたい場合についての説明もありますので参考にしてみて下さい。
おわりに
ウィジェットが自動で再生されるならこんな手間いらないんですが、そうなっちゃった物は仕方が無いですよね。
ここについてもAmazonアソシエイトの表示方法がランダムに出来ないか、とかテンプレートを読み込む形に出来ないか、とかちょっと考えてみたいと思います。
レクタングル
スポンサーリンク