はじめに
blogを始めてからしばらくすると、広告を載せてみたくなります。それはblogするための張り合いであり、自分のblogの評価の結果であるため、誰しも興味があるはずです。当サイトでは、Synology NASであるDS920+にWordPressを導入してblogを発信しています。レンタルサーバーよりは非力であることや、ネットワークの転送速度も1Gと低いため、苦労も多いことは否(いな)めません。広告が表示されない不具合もその一つです。
世界にはいろいろなアフィリエイト・プログラムがありますが、Google AdsenseとAmazon Affilicateは、比較的手を出しやすく、当サイトもこの2つについて広告表示の設定をしています。
マニュアルにより1ページ毎に広告コードを埋め込んで表示設定することも可能ですが、phpを少しは知っている必要があります。当サイトでは、最初から広告表示の専用プラグインを導入することは長い目で見た時、効率的であると考えました。2, 3の広告プラグインを試し、結果的には、Advanced Ads Pro (有料版)を導入しています。html文の見出しであるH2やH3、・・・などのを標的として広告を表示させたり、何個かの広告をグループにして、2段表示などのカラム組み表示も可能です。また、GoogleのAMPページ対応のページへの広告表示も可能であったり、add onプラグインにより色々な機能を追加することができます。
基本的には、Advanced Ads Proを導入し、追加的にGoogleのAMPページへの対応としてResponsive add onなどを、適宜、追加して好きな広告表示の機能を使うことができます。Amazon Affilicateの場合、Google Adsenseとは異なり、高度な広告表示はしていません。具体的には、価格表示対応の場合、html文である商品のiframeの広告コードを、Advanced Ads Proの設定にコピペしたり、単純なリンクとしてのurlをコピペしたりすれば広告表示が可能となります。Google Adsenseの場合は、広告内容は、Googleが自動で広告コードを、そのページにふさわしい内容のもので送る仕組みになっています。この対応としてResponsive add onが必要です。当サイトでは、AMPページに対応しているので、少なくとも、Advanced Ads ProとResponsiveの2つが必要でした。なお、Amazonの広告には、Responsive add onは必要ありません。
Amazonの広告
WordPressの投稿/ページの中に、Amazonの広告を表示させる方法をまとめました。Amazonの広告を掲載してそれに関連する収入を得る場合、広告収入というよりは、コンバージョン(商品が購入されて支払いが完了したとき)により収入が得られるコンバージョン型課金です。
「インプレッション」の意味とは?増やす方法についても解説 — LeadPlus —
https://www.leadplus.net/blog/impression.html
インプレッション課金型とクリック課金型及びコンバージョン課金型について理解できる解説がある
Amazonから提供させる広告形式
Amazon Affiliateでは、以下に示したようにAmazonから複数形式の広告コードが提供されています。そのフォーマットは、大きく3つ (html, iframe及びJavaScript)あります。
html形式では、画像を使って画像広告を作ることができます。画像広告の作成は、Advanced Ads Proを使えば簡単に作れて、作った広告はデータベースに保管されて管理されるので、使い回しも簡単にできます。
Amazonアソシエイトには、数種類の広告形式が提供されています (2020/3現在)
https://affiliate.amazon.co.jp/home
1) 商品リンク (html形式、AMPサイトで表示可能)
2) バナーリング (iframe形式、AMPサイトで表示不可能)
3) Mobile popover (JavaScript形式、基本的にはAMPサイトで表示不可)
4) テキストリンク (html形式、AMPサイトで表示可能、カテゴリー、サブカテゴリーとリンクに用いるテキストを指定して、html文を取得する)
AMPに対応する形式は限られています(表1)。しかし、広告プラグインであるAdvanced Ads Pro(有料版)とアドオンを使えば、自動的にAMP対応にしてくれます。当サイトでは、有料版を2020/03から使用して、あれやこれやと試行錯誤にて設定を検討しています。この記事では、Advanced Adsを使用しない場合で、マニュアル設定する場合を解説しています。
表1. 広告形態とAMP対応/非対応
広告形態 | AMP | 非AMP |
リンク形式(http://) | 可 | 可 |
JavaScript | 1) | 可 |
Mobile Popover | 2) | 可 |
iframe | 3) | 可 |
AMPページで広告を表示
1) JavaScriptコードの埋め込み
Amazonから提供させる広告コードのうちJavaScriptコードについては、AMPページに埋め込んで表示させる方法はありません.
2) Mobile Popoverの埋め込み
この形式は、JavaScriptなので、前述のJavaScriptコードの埋め込みと同様に、今現在対応策は不明です。試行錯誤注ですが、表示できる設定方法はわかっていません。
3) iframeの埋め込み
概要
iframeを使用するには、Header領域にAMP専用の宣言が必要です。もしも、Advanced Ads Proを導入していれば、このプラグインで処理してくれるので、宣言の対応は必要ありません。
Headerにコードを挿入できるプラグインで、その宣言のコードを挿入した上で、広告コードをページに埋め込みます。その際、AMP用のiframeであることを示すコード(amp-iframe)とする必要があります。
作業
- headerに宣言
- 以下のコードを埋め込む
- プラグインは、Header and Footerを使用する
- <script async custom-element=”amp-iframe” src=”https://cdn.ampproject.org/v0/amp-iframe-0.1.js”></script>
- 広告コードをページに埋め込む
- <amp-iframe>…</amp-iframe>の名式で、コードを埋め込む。コードは「…」に。
amp-iframe width="500"
height="281"
title="Netflix House of Cards branding: The Stack"
layout="responsive"
sandbox="allow-scripts allow-same-origin allow-popups"
allowfullscreen
frameborder="0"
src="https://player.vimeo.com/video/140261016">
</amp-iframe>
まとめ
Amazonの広告で提供されているコードの種類について、説明し、実際の埋め込み方についてまとめました。
現在、2020/05/03で新型コロナウイルスによる騒動の中です。03/19からAmazonの商品リンクを広告しています。残念ながら、一度も購入していただけた実績は、ありませんが、アクセス数の問題でしょう。まあ、人生なにごとも経験といいますし、コツコツとアクセス数を上げる案を考え/実行のサイクルを回しましょう。
広告が表示されない時の対策
広告が表示されない場合があります。特に、Google広告の場合です。AMP化した場合に起こりやすくなるようです。AMPでは、AMPに対応したコードに変換して、それを代替表示させています。もしも、AMPで問題が起こった場合は、AMPの作業の中で、ポストを「忘れる」処理をして、再度、元の記事の編集画面から更新することで、AMPに対応したコード変換をさせると、ほとんどの場合、問題が改善できます。それでも、改善できない場合もあります。その場合は、キャッシュの構築関連に問題があることを疑います。「キャッシュ」のフラッシュをしてみます。
それでも、Google広告が表示されない場合もあります。Googleの広告では、「Responsive」の設定が可能なので、その設定(Googleサイトでの設定、Advance Adsプラグインでの設定など)では、広告コードは、Googleサイドに存在していることの理解が必要です。更に、広告が存在するGoogleサイドから広告コードが、自分のblogサイドに届いている場合と、届いていない場合にケースを分類することができます。
もしも、以上の対応である「忘れる」、「キャッシュ」のフラッシュ、でも、Googleの広告が表示されない場合は、自分サイドに広告コードが届いていないことを疑います。対策は、以下の通りです。
- ブラウザで、該当ページを表示される
- Google広告の表示が出ないことを確認する
- しばらくの時間(数分間)、ページの上下をスクロールしたり、静観したりする。
- (広告コードの転送が行われていると推測しています)
- 最後に、ブラウザの再読み込みをクリック。表示されると思います。
- それと、注意ですが、決して自分で広告をクリックしないようにしてください。そのクリックの数は、少なけばミスとして許容されているようです。でも、多すぎると、Google Adsenseから「出禁」を食います(by 経験者)。
編集履歴
2020/03/19 はりきり(Mr) 2020/03/21 追記 (Amazonアソシエイト) 2020/05/03 追記 (購入実績についての記載) 2021/03/10 追記 (はじめに) 2021/04/11 追記(広告が表示されない時の対策)