Mobile Popoverを設置する方法【Amazonアソシエイト&WordPress】

アメリカで売上30%アップの実績を誇るモバイル専用ウィジェット Mobile Popover を導入してみました。
記事内に商品を Amazon リンクで掲載している場合、その商品をオーバーレイで画面の下部に表示してくれます。

Amazon アソシエイト→商品リンク→モバイルポップオーバーを開きます。

表示されたコードを </body> タグの直前に貼り付けます。

<script type="text/javascript">
amzn_assoc_ad_type = "link_enhancement_widget";
amzn_assoc_tracking_id = "トラッキングID";
amzn_assoc_linkid = "コード";
amzn_assoc_placement = "";
amzn_assoc_marketplace = "amazon";
amzn_assoc_region = "JP";
</script>
<script src="//ws-fe.amazon-adsystem.com/widgets/q?
ServiceVersion=20070822&Operation=GetScript&ID=OneJS&WS=1&MarketPlace=JP"></script>

テーマCocoonの貼り付け場所

  1. 外観
  2. テーマの編集
  3. 子テーマ Cocoon Child
  4. tmp-user
  5. body-top-insert.php

<?php //ログインユーザーも含めてカウントする場合は以下に挿入 ?>の下に追記します。

テーマSimplicityの貼り付け場所

  1. 外観
  2. テーマの編集
  3. 子テーマ Simplicity2 Child→footer-insert.php「//↓ここに挿入?>」の下に追記

テーマLuxeritas Themeの貼り付け場所

  1. Luxeritas
  2. 子テーマの編集
  3. フッターに追記

モバイル端末で確認

Amazon の商品を紹介しているページの下部にポップアップが表示されます。

Mobile Popoverが表示されない場合

残念ながら AMP ページや <iframe> タグを使っているページでは表示されません。
どちらかを諦めるしかないです。

後日Mobile Popoverやめました

文中に Amazon リンクを入れている場合、その部分全体が「ぼこっ」という感じで文字が大きくなって変なのでやめました(※テーマ Cocoon の場合。他のテーマは不明)