GoogleのDoubleClick for Publishers(DFP)タグを設置します。

AdSenseは広告を表示する場所にスクリプトを置くだけですが、DFPタグの場合はヘッダ内で広告枠を定義して広告を表示したい位置に定義した広告を呼び出すタグと<DIV>を設置します。

DFPのGoogle Publisher Tag

面倒なことに、DFPのGoogle Publisher Tagは、管理画面で生成するたびにタグについているIDが変わっていきます。そのため、出てくるタグをそのままコピーアンドペーストすると、ヘッダで定義したスロットと、設置場所に定義したスロットが違うIDになってしまうので表示されません。

ヘッダ用のタグ

前半(共通の設定)

<script type='text/javascript'>
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
(function() {
var gads = document.createElement('script');
gads.async = true;
gads.type = 'text/javascript';
var useSSL = 'https:' == document.location.protocol;
gads.src = (useSSL ? 'https:' : 'http:') +
'//www.googletagservices.com/tag/js/gpt.js';
var node = document.getElementsByTagName('script')[0];
node.parentNode.insertBefore(gads, node);
})();
</script>

後半(広告枠定義)

<script type='text/javascript'>
googletag.cmd.push(function() {
googletag.defineSlot('ユーザー名とユニット名', [[サイズ]], '枠固有のID').addService(googletag.pubads());
googletag.pubads().enableSingleRequest();
googletag.enableServices();
});
</script>

表示位置用のタグ

<!-- ユーザー名とユニット名 -->
<div id='枠固有のID'>
<script type='text/javascript'>
googletag.cmd.push(function() { googletag.display('枠固有のID); });
</script>
</div>

設置方法

AdSenseは専用拡張機能がありますが、DFP用のものはなさそうです。

ヘッダ用のタグは、テンプレート上で編集するか、「EasyScript」や「TagMeta」などのヘッダ編集プラグインを使って設置します。

後半のタグは、記事内に埋め込んだり、カスタムHTMLモジュールを使って設置します。どちらの場合も、スクリプトを使うので「Sourcerer」プラグイン—PHPやiframe、Javascriptを簡単に使う設定が必要です。

また、AdSenseの場合はレスポンシブ広告タグがありますが、DFPは残念ながらモバイルアプリ専用です。レスポンシブ対応させるのは、Bootstrapのテンプレートなら比較的簡単ですが、ちょっと面倒です。

WordPressなら簡単

WordPressなら、プラグイン「Simple Ads Manager」を使えば簡単に設置できます。

簡単に、設置できたような気もしていたのですが、高機能なプラグインなので、配置を変えたり、頻繁に違う広告キャンペーンを置いたりするのでなければ、タグを直接設置したほうが早くて簡単ですね・・・