THE THORにAMP自動広告が表示されない事象を解決【設定方法解説】

THE THORでAMP自動広告を設定しようとしたものの、なかなかAMPページに表示されない。
そんな悩みをお持ちの方へAMP自動広告設定方法を画像付きで詳しく解説します。

THE THORへのAMP自動広告設定

THE THORはデザイン性に優れた有料テーマです。
豊富なデザインやカスタマイズ性に優れていて、当ブログでも採用しています。

ただ、THE THORはまだ公開されてから日が経過していないこともあり、何か問題があった時、調べても解決法が見つけにくいというデメリットがあります。（これはどんなテーマでも最初は通る道なので時が経てば解決すると思ってます）
そんな中、AMP自動広告を設定できない問題に出くわしました。

AMPとはAccelerated Mobile Pagesの略で、モバイル端末で高速にページを表示するための技術です。
現代はスマホ社会ですから記事のAMP化は今後重要になると私は考えています。

AMP化はプラグインを使ったりしても色々設定が大変なようですが、THE THORではプラグインなしで記事をAMP化する事ができます。
私もこれまではAMP化を見送ってきましたが、THE THORの購入を機にAMPに対応しました。

ここではGoogle AdSenseの自動広告を指します。
Google AdSenseの自動広告には、通常の自動広告とAMP自動広告の２つがあります。

私は記事に、通常の自動広告を使っていたので、AMP化対応を機にAMP自動広告を表示させたいと思いました。
しかし、2019年6月現在、たくさんあるカスタマイズ項目をいくら設定してみても、AMP自動広告が一向に表示されません。

このままだとAdSense収入が無くなってしまいます。
選択肢として

も検討しましたが、自力で解決することを選択しました。

THE THORでAMP自動広告を設定する方法を次の順で解説します。

THE THORではカスタマイズでAMP化に関する設定ができます。

外観→カスタマイズ→AMP設定[THE]→AMPページ用広告設定

いかにもここに設定さえすれば対応できそうな場所です。
しかし、ここは自動項目ではない広告をAMPページに合わせた広告を表示するための場所なのでここではありません。
AMP自動広告設定場所１

外観→カスタマイズ→基本設定[THE]→高度な設定

AMP自動広告についてググっていると、高度な設定にコードを貼り付けることで表示されると書かれている記事を見かけます。
私も試してみました。
記事によっては、上側は不要で下側だけ入力するといったものもありましたがどれも表示されませんでした。
なのでここも使いません。
AMP自動広告設定場所２

外観→テーマエディター→THOR→single-amp.php
試行錯誤した結果、表示されたのはここの編集をした時でした。

AMP自動広告テーマの編集

ここでは親テーマのエディターを編集するのでバックアップは取ってから作業してください。
編集にあたっては自己責任でお願いします。

AMP自動広告を表示するための具体的な設定手順についてみていきます。

最初はGoogle AdSense側の設定です。
広告→自動広告→AMP広告の順にクリックし、ステップ１のバーをオンにします。

AMP自動広告手順１

さっきはステップ１だったのに、次はなぜか手順２ですが気にしないようにします。
Google AdSense側のコードをコピーします。
AMP自動広告手順２コピー

次に、</head>を探して、直上に貼り付けます。
AMP自動広告手順２貼り付け

やることは手順２と同じです。
Google AdSense側のコードをコピーして・・・
AMP自動広告手順３コピー

single-amp.phpで</body>を探して、直上に貼り付け。
AMP自動広告手順３貼り付け

最後に更新を押して設定は終わりです。

Google AdSenseでは通常広告表示まで20分程度かかるとのことですが、たぶんもっとかかります。
私は夜設定して、1時間後はまだ表示されておらず、翌朝見ると表示されていました。

自分の端末では表示されたかどうかわからない場合はGoogle AdSenseのレポートで確認できます。
レポート→広告フォーマット
で確認しましょう。
AMP自動広告結果確認

2019年6月現在、THE THORのカスタマイズ設定のみではAMP自動広告は表示できないようです。
single-amp.phpを編集することでAMP自動広告が出力することができるようになります。

本記事を参考にAMP自動広告が表示されるようになれば嬉しいです。