アドセンス 「関連コンテンツ」をカスタマイズする方法

Google AdSense「関連コンテンツ」ユニットのレイアウトを変更する方法を紹介します。

「関連コンテンツ」をカスタマイズする方法

アドセンス関連コンテンツをカスタマイズしてレイアウトを変更する方法を紹介します。デフォルト設定より多くのコンテンツを表示させたり、モバイルとPCにそれぞれ異なるレイアウトを設定したりする事も可能です。レスポンシブ対応の関連コンテンツ ユニットをカスタマイズする方法は、Google AdSenseからも許可されている変更方法です。これらの方法で関連コンテンツのコードを修正した場合は、AdSense プログラム ポリシー違反とみなされません。

AdSense : https://support.google.com/adsense/answer/7533385

関連コンテンツ ユニットの「レイアウト」を変更

関連コンテンツ ユニットに「テキスト」と「画像」をどのように配置するかを指定するには、レイアウトパラメータを使用します。

画像とテキストを横に並べて表示

画像とテキストを横に並べて表示するレイアウトです。このレイアウトを選択するには、広告コードに下のパラメータを追加します。

data-matched-content-ui-type="image_sidebyside"

画像とテキストを横に並べてカード内に表示

画像とテキストを横に並べてカード内に表示するレイアウトです。このレイアウトを選択するには、広告コードに下のパラメータを追加します。

data-matched-content-ui-type="image_card_sidebyside"

テキストの上に画像を配置

テキストの上に画像を配置するレイアウトです。このレイアウトを選択するには、広告コードに下のパラメータを追加します。

data-matched-content-ui-type="image_stacked"

テキストの上に画像を配置してカード内に表示

テキストの上に画像を配置し、カード内に表示するレイアウトです。このレイアウトを選択するには、広告コードに下のパラメータを追加します。

data-matched-content-ui-type="image_card_stacked"

テキストのみ

画像を表示しない、テキストのみのレイアウトです。このレイアウトを選択するには、広告コードに下のパラメータを追加します。

data-matched-content-ui-type="text"

カード内にテキストを表示

カード内にテキストのみを表示するレイアウトです。このレイアウトを選択するには、広告コードに下のパラメータを追加します。

data-matched-content-ui-type="text_card"

関連コンテンツ ユニットの「行数」と「列数」を変更する

関連コンテンツ ユニットは、おすすめのコンテンツが「縦横」に並んで表示されるのですがパラメータを使用すると「行数」と「列数」を変更する事ができます。モバイルとPCで異なるレイアウトにする事も可能で、下の例の場合はモバイルでは、15×1（縦15で横1）となり画像とテキストを横に並べて表示するレイアウトで、PCでは、5×4（縦5で横4）となりテキストの上に画像を配置するレイアウトとなります。「,」で区切って数値を入れます「モバイルが左」で「PCが右」になります。

data-matched-content-rows-num="15,5"
data-matched-content-columns-num="1,4"
data-matched-content-ui-type="image_sidebyside,image_stacked"

コードをコピペする時は、下のような位置にペーストするだけです。関連コンテンツは、簡単に自分のWEBサイトやブログにあったレイアウトに変更できるのでクリック率を少しでも上げたい方は試してみて下さい。

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block"
     data-ad-format="autorelaxed"
     data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
     data-ad-slot="xxxxxxxxxx"

     data-matched-content-rows-num="15,5"
     data-matched-content-columns-num="1,4"
     data-matched-content-ui-type="image_sidebyside,image_stacked"

></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

#