前回の設定でURL毎のクリック数・収益は確認できるようになりました。 しかし、ページ内の「どこに表示されている広告」が一番クリックされているのかは分かりません。今回はそれを確認するために広告のタイプを切り替えます。
Adsense広告の種類について
サイト運営編で挿入したAdsenseの“自動広告”は、一つのコードを挿入するだけでページ内の各所に広告を配置してくれる…というものでした。
Google AdSenseには本来、６種類の広告タイプが存在しています。 “自動広告”はこの6種類の広告を自動的に選択し、サイトに配置するという機能です。広告の種類や設置箇所は、Googleのシステムが判断して決めてくれるという仕組みです。
画像元：https://www.google.com/intl/ja_jp/adsense/start/solutions/auto-ads/
「うちの自動プラットフォームは優秀だから、どこに広告を配置したら儲かるか考える時間はコンテンツ作りに使ってね」というのがGoogleの主張です。 Googleは数年前から自動広告を押しに押しています。
しかし、自動広告には * サイトデザインを損いやすい * 広告の種類/掲載位置によるクリック率（CTR）の変化が分からない
というデメリットもあります。 冒頭の「ページ内で一番クリックされている広告がどれか分からない」というもの、このデメリットに含まれていますね。
このため、それぞれのパフォーマンスを計測しやすいように個別で広告を設定しておく方法を取る方も少なくありません。高パフォーマンスな広告種類・位置を割り出すことで、ほとんどクリックされない広告を削除してサイトをスッキリさせることも出来ます。
デザイン/ユーザー体験を邪魔しない範囲で効果的に広告を掲載したい、という場合は自動広告を使わずに自分で掲載する広告を決める方が適していると言えるでしょう。
AdSense広告の種類
AdSenseで設定することが出来る広告は、６種類に分けられます。
- ディスプレイ広告
- インフィード広告（ネイティブ広告）
- 記事内広告（ネイティブ広告）
- 関連コンテンツ（ネイティブ広告）
- 検索エンジン
- リンク広告
ネイティブ広告とは自然にサイトに溶け込むようなデザインの広告です。広告の存在がユーザー体験を邪魔せず、記事を読む行為の延長で広告にも目を通してもらえるように最適化した広告です。
それぞれの特徴を簡単に見ていきましょう。
ディスプレイ広告
Webサイトを眺めている時に表示される「広告」としては最もオーソドックスなタイプ。 テキストのみ、もしくは画像付きのバナー広告ですね。
インフィード広告
記事一覧に表示される広告で、記事と記事の中間に広告が挟まるような形になります。
記事内広告
呼び名通り、記事の本文中に表示される広告です。 クリック率が高く、多くのサイトで最も収益を上げていると言われています。
関連コンテンツ
関連する同サイトの記事に混じって、他サイトの広告が表示されます。 自サイト内の関連記事もGoogleが出力してくれます。WordPressプラグインなどと同等以上の精度なので、関連記事部分はAdsenseにしているサイトも多いですね。
検索エンジン
Googleの検索バーをサイトに追加します。 ユーザーが検索すると、検索結果のページの上部に広告が表示されます。 検索対象を自サイトのみにすることも出来るので、サイト内検索用に入れられているケースが多いです。
リンク広告
テキストのリンクのみで構成された広告が表示されます。 この広告タイプは新規ユーザーは利用出来ないようになっているようです。
広告ユニットを使用する
では、実際に表示する広告を決めて挿入してみましょう。
Google AdSenseにログインし、広告 > サマリーを開きます。 上部のタブ「広告ユニットごと」をクリックして画面を切り替えます。
↓
“新しい広告ユニットの作成”という見出しの下に、上でご紹介した広告タイプが並んでいます。この中からサイトで使いたい広告をクリックしましょう。 どのタイプを選んでも、それぞれ選択した広告の設定画面が開きます。
A:記事内広告の設置方法
※作成中のサイトに挿入する予定のない場合、行う必要はありません。
「記事内広告」を選択します。
設定が終わったら「保存してコードを取得」ボタンをクリック。 下図のような、広告挿入についてのページに切り替わります。
表示されたコードを記事内に挿入しましょう。
WordPress管理画面から、広告を表示したい記事の編集画面を開きます。 広告を挿入したい位置で、ブロックの追加をクリック。
ブロックの種類が表示されるので「カスタムHTML」を選びます。 探しにく時は上部の検索フォームを使うと早いです。
カスタムHTMLのブロックが入りました。 ここにコピーしたAdSenseのコードをペーストします。
変更を保存して下さい。 記事を表示してみると、コードを挿入した箇所にスペースが出来ています。
↓水色の部分
少し時間が経つと、広告の配信がスタートします。
初期状態であれば上図のように余白がなく、みっちり表示されてしまいます。
* Adsenseのコードを<div>タグで囲んでクラスを付ける
* 検証ツールでAdsense広告のクラスを確認し、style.cssでスタイルを追加する
などの方法で、調整して下さい。
【Adsenseコードのショートコード化】
上記の方法で、記事内の好きな場所にAdSense広告を表示できるようになりました。 ・・・が、記事を書くたびに毎回コードを入れるのは大変ですよね。 エディター画面も一部分だけHTMLブロックになり、長いコードが入るので見にくいです。
ですので、WordPressの「ショートコード」という機能を利用してみましょう。 ショートコードを使用すると、別のファイルを一行で呼び出せるようになります。
※ここから先の作業は、ローカル環境で行います。 funcsions.phpを編集するので、まずローカル環境でテーマを編集して動作が確認できてから、本番環境にアップロードするようにして下さい。
①phpファイルを新規作成
作成中のテーマフォルダ内に、新しい空phpファイルを作成します。 ファイル名は任意で構いません。 解説では「ad-inarticle.php」としました。
確認用に、作成したphpファイル（ad-inarticle.php）に「AdSense広告」というテキストを入れてみましょう。下記の３行で保存しておきます。
ad-inarticle.php
②functions.phpに記述
ショートコードを使ってphpファイルの呼び出しが出来るよう、設定します。 以下をfunctions.phpに記述し、保存してください、
functions.php
<? //この行はコピーしない
/* phpファイルをショートコードで読み込む
-------------------------- */
function include_adsense_inarticle( $atts ){
ob_start();
get_template_part('ad-inarticle'); // ad-inarticle.phpを読みこみ
return ob_get_clean();
}
add_shortcode( 'ad-inarticle', 'include_adsense_inarticle' );
get_template_part部分は、作成したphpファイル名に合わせて変更して下さい。
赤線で囲ったショートコード名も任意で設定して頂けます。
詳細はWordPress Codex-関数リファレンス/add shortcodeをご確認下さい。
③ショートコードが有効か確認
記事編集画面を開きます。 ブロックの追加、から「ショートコード」ブロックを選択して下さい。
↓
ショートコードブロックに変わりました。
②functions.phpで定義したショートコード名を、大括弧で囲って入力します。
[ad-inarticle]
保存して、表示を確認してみましょう。 ad-inarticle.phpに入れた「AdSense広告」というテキストが表示されていれば成功です。
④Adsenseのコード変更
ショートコードでphpファイルを呼び出せることが確認できたら、確認用のテキストを削除し、Adsenseの広告表示コードに切り替えましょう。
ad-inarticle.php
FTPソフト等で、 * ad-inarticle.php * functions.php
をサーバーにアップロード（上書き）すれば完成です。
これで毎回コードを貼り付けなくても、ショートコードブロックで[ad-inarticle]とだけ記述すれば記事内広告が呼び出せるようになりました。
B:関連コンテンツ広告の設置方法
サイト内の関連記事と、広告を混ぜて表示してくれる関連コンテンツユニット。
こちらをsingle.phpに入っている、自作した関連記事部分と変更してみましょう。 解説ではポートフォリオサイトと同様の方法で、関連記事を表示させています。
Google AdSenseにログインし、 広告 > サマリー > 広告ユニットごと から「関連コンテンツ」をクリック。設定画面を開きます。
分かりやすい広告ユニット名を付けて、必要があればスタイルを設定して下さい。 稀にプレビューが表示されないことがあります。 その場合はユニット名だけ付けておけば大丈夫です。
設定が終わったら「保存してコードを取得」ボタンをクリック。 コードが表示されます。
Aの記事内広告と同じく“広告を表示させたい場所にこのコードを配置”とのことですので、使用しているテーマフォルダを開きましょう。
今回は記事下に入れたいので、single.phpを変更します。 念の為バックアップをとっておきましょう。
single.phpで関連ブログを表示させている箇所、条件定義、記事出力部分を削除します。 見出しはあったほうが分かりやすいので、残しています。
single.php（元）
見出しの下に、Adsense関連コンテンツ広告のコードを貼り付けます。 必要に応じて見出しを変更する等、調整して下さい。
single.php（変更後）
single.phpを保存して、サーバーにアップロードします。
投稿記事ページの表示を見てみましょう。 変更後すぐは関連コンテンツが表示されず、空白になっていると思います。
検証ツールで空白を確認してみて下さい。 adsbygoogleなど自分で設定していないGoogleのclass,idが入っていれば、コード挿入は出来ています。少し時間をおいてから、関連コンテンツユニットが表示されているか再確認して下さい。
検証ツールでクラスを確認すれば、サイズ等のスタイル変更もstyle.cssへの追記で可能です。
C:そのほかの広告ユニットについて
【ディスプレイ広告、検索エンジン】 ディスプレイ広告、検索エンジンも上で紹介した２つの広告と同じように“広告を表示させたい場所にコードを配置する”タイプです。
- テンプレートファイルに貼り付ける
- ブロックエディター（カスタムHTML）に貼り付ける
- phpファイル化してショートコードで呼び出す
等の方法で、表示させたい場所にコードを入れれば設定できます。
【インフィード広告】 インフィード広告は少し特殊で、フィード（記事リスト）の途中、先頭、または末尾に配置すると決められています。先頭もしくは末尾であれば、ループ開始の直前もしくは直後にコードを貼り付ければ良いですが、途中に広告を表示したい場合は設定が少し難しいです。
AdSenseヘルプ等を参考にコードを書くか、 Adsenseの広告設定を行える【Ad Inserter】のようなプラグインを使用して下さい。