AMPページに自動広告
AMPページに自動広告を設定する手順（Adsense）
AMP自動広告はAMPページに自動でAdSenseの広告を表示してくれます。3つの手順で設置できます。
- アドセンスでAMPの自動広告をONにする
- AMPコードを取得・コピーする
- AMPコードを指定の場所に貼る
3つの手順を詳しく記載して行きます。
自動広告をオンにして、アドセンスコードを取得する
Adsenseにログイン→右のメニューより広告をクリック
- AMP自動広告をONにする
- ページ内広告をONにする
- アンカー広告をONにする
- スクリプトをコピー→
<head>～</head>内に貼る - AMP自動広告コードをコピー→
<body>～</body>のすぐ後に貼る
コードの貼り方は下記参照
自動広告のアドセンスコードについて
自動広告は AdSense コードを使用して取得できますが、現在はあらゆる AdSense 広告ユニットコードで自動広告をご利用いただけるようになりました。
Google Adsense
現在Adsense は広告ユニットでも自動広告を表示する仕様になっています。AMPでもAMPのアドセンス広告ユニットを貼れば、AMPの自動広告をONにするだけで、自動広告が表示されるのではないかと思います。
AMPサイトの自動広告の広告設定プレビューは、通常の広告設定プレビューで確認できます。
AMPサイトの広告設定のプレビュー方法
- Adsense→広告へ
- サイト名の鉛筆アイコンをクリック
- URLに「/amp」を付けてリロードする
これでAMPサイトが表示され、自動広告の位置がわかります。
左が「アドセンスの広告プレビュー」・右が実際のスマホで見たAMPページ
上の画像は、通常のAMPコードだけを貼り、AMP自動広告コードは貼っていませんが、自動広告は表示されています。
AMPコードを貼る場所
- 外観→テーマファイルエディッタをクリック
- 子テーマのAMPの「header.php」「body.php」などに貼る
テーマcocoonの場合
「header.php」「body.php」が無い場合は、子テーマを作るプラグインがあります。
AMP用のスプリクトをAMP HTML の<head>タグ内に貼る
子テーマの<head>～</head>内に貼ります。
AMP用のAdsenseコード
<script async custom-element="amp-auto-ads"
src="https://cdn.ampproject.org/v0/amp-auto-ads-0.1.js">
</script>広告コードをAMP HTML の＜body＞の開始タグ直後に貼る
<body>の開始タグ直後に貼ります。
AMP用の広告コード 赤文字の部分はサイト運営者のIDです。
<amp-auto-ads type=”adsense”
data-ad-client=”ca-pub-1234567891234567“>
</amp-auto-ads>実際の自動広告（画像の上に自動広告が入っています）
プラグイン「AMP for WP」はウェブページをAMPページに設定でき、広告の設置ができます。
AMP for WPの詳しい広告の設定は次のリンクをご参考下さい。
AMP 記事内へ広告を表示させる方法
「AMP for WP」はコンテンツの上や下などに広告を表示できますが、記事内への広告の設定はありません。「Advanced Ads」や「Ad Inserter」は、AMPでも記事に広告を表示できます。
Advanced Ads を使ってAMP自動広告を簡単に貼る
Advanced Adsで<head>タグ内と＜body＞タグ内へコードを貼る
Advanced Adsは、AMP用のスプリクトもAMP用の広告コードも貼る必要はありません。チェックを入れるとコードは自動で追加されます。
詳しい広告の設定は下のリンクをご参考ください。
Ad Inserter を使ってAMP自動広告を簡単に貼る
プラグイン「Ad Inserter」でも自動広告を貼ることができます。
自動広告の例 ページ内広告とアンカー広告
アンカー広告
Google 公式 AMP サイトに自動広告を設定する
