AdSense リンクユニットは、AMPページにも対応しています。AMPページ用の広告ユニットは、通常の広告ユニットのコードを元に作成します。リンクユニットも通常の広告ユニットと同様にAMP用のコードを作成して掲載することができます。
AMPページ用のAdSense リンクユニットの作成手順
Googleは、レスポンシブユニットを使用することを推奨しています。通常ページ用のレスポンシブ リンクユニットを作成し、AMPページ用のコードを作成、設置を行います。以下、手順を紹介します。
広告ユニット表示用のAMP スクリプトの設置
AMPページの<head>タグ内に以下のコードを設置します。
このスクリプトは、amp-adの必要なライブラリーをロードする機能です。AMPページで既にAdSenseの広告を掲載されている場合、既に設置済みとなっています。
amp-adについて、詳しくはAMPのドキュメント をご覧下さい。
新たにAMP用のレスポンシブの広告ユニットを作成する
新しく、レスポンシブのAdSense リンクユニットを作成し、コードを入手します。リンクユニットの作成方法は、以下の記事をご参照下さい。
リンクユニットのコードは以下の様な形式になっています。
<!– AMP リンクユニット –>
<ins class=”adsbygoogle”
style=”display:block”
data-ad-client=”ca-pub-1234567890123456”
data-ad-slot=”1234567890”
data-ad-format=”link”></ins>;
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
AMP用の広告コードを作成するためには、上のコード内のパブリッシャー(運営者）IDと広告ユニットIDを使用します。
AMP レスポンシブ リンクユニットのコード作成
作成したレスポンシブ広告ユニットの運営者IDと広告ユニットを、以下のコードの該当部に差し替えます。
layout=”responsive”
width=300
height=250
type=”adsense”
data-ad-client=”ca-pub-1234567891234567”
data-ad-slot=”1234567890“>
</amp-ad>
上記コードは、幅300、縦250の基本サイズ（縦横比として使われます）でレスポンシブで表示する設定です。お好みに合わせて、サイズを調整します。ページ内のリンクユニットのサイズ別表示例を以下に紹介します。
上のコードをコピーして、AMPページ内のリンクユニットを設置します。設置は、AMP化している方法などによってやり方が異なります。
AMP ページでの広告コード設置方法
AMP ページでの広告コードの設置方法は、AMP化の方法によって異なります。以下は、プラグイン AMP for WordPressを使用してAMP化したサイトにAd Inserterを使用して、AMPページ内に広告コードを挿入する方法を紹介した記事です。
プラグイン Ad Inserterを使用してAMPページに広告を挿入する方法
レスポンシブ AMP リンクユニットのモバイル端末での表示例
AMPページを表示して、設置したリンクユニットが適切に表示されるか確認します。
レスポンシブレイアウト、300×250の設定での表示例
幅300、縦250でレイアウトをレスポンシブに設定した場合の表示例です。画面の幅に合わせて大きくなって表示されます。
レスポンシブレイアウト、300×150の設定での表示例
上の表示では少し大きすぎる（縦が長すぎる）と思う場合は、縦のサイズを小さくします。以下では、縦を150に変更しています。
layout=”responsive”
width=300
height=150
type=”adsense”
data-ad-client=”ca-pub-1234567891234567″
data-ad-slot=”1234567890″>
</amp-ad>
上記コードの表示例です。
サイズを変更して、実際に表示してみて、ページ内の他のコンテンツと調和し程良いと思われる大きさにします。異なるサイズでA/Bテストを行なって、収益パフォーマンスの比較を行なってみるのも一案だと思います。AMPページ専用の広告ユニットで作成していれば、パフォーマンスレポートで収益の各指標を簡単に確認することができます。
リンクユニットは、サイトによっては意外なほど収益パフォーマンスが良い場合があります。通常ページで、リンクユニットを使用していて、パフォーマンスが良い場合は、AMPでもリンクユニットを試してみることをお勧め致します。
コメントを残す（承認後表示されます）