WordPressテーマ「AFFINGER6」で設定する「Googleアドセンス広告を横並び（ダブルレクタングル）で表示する方法」を解説していきます。
こんにちは。WordPressテーマ研究家SHINです。
AFFINGER5はたくさんのウィジェットが実装されているので、簡単にアドセンス広告を横並び表示できます。表示可能な場所は王道の3箇所。
ダブルレクタングル表示箇所
- 投稿記事の上下
- 固定記事の上下
- 各途中見出し前
この3箇所へ横並び表示する方法を解説していきます。
アドセンス広告コードを「AFFINGER5管理」「ウィジェット」2つの指定箇所に貼り付けるだけで、アドセンス広告を横並び（ダブルレクタングル）で表示が可能です。
投稿記事で広告コードを都度貼り付けるようなアナログ作業は一切なく、全て「自動化」で広告を表示できます。
また当記事では、アドセンス横並び広告の下に「リンク広告」を表示する方法も解説していきますので、特に記事下にお試し下さい。
広告ユニット完成イメージ
では早速実装していきましょう。
Googleアドセンス広告コードを準備
横並び表示用アドセンス広告コード取得方法
まずレクタングル広告（横並び）用の広告ユニットを準備します。
step
1GoogleAdSenseにログイン後「広告」＞「サマリー」＞「広告ユニットごと」＞「ディスプレイ広告」と進みます。
step
2ここで「広告ユニット名」を入力し、広告サイズは「固定」を選択して、幅を「336」高さを「280」と入力して「完了」で進みます。
設定補足
- 広告ユニットの名前…「記事下レクタングル広告」など分かりやすく名前を入力。
- 広告サイズ…「固定」を選択して「幅336」「高さ280」と入力。
- 最後に「作成」をクリックして進みましょう。
step
3これで幅336px × 高さ280pxサイズのアドセンス広告コードが無事発行。下にある「コードをコピー」をクリックして「完了」に進みましょう。
AMPページの場合
AMP専用コードを使用する場合
AMPコードはAMPページでしか広告が表示されないので、記事（投稿・固定）もAMPページにする必要があるので注意です。
またAFFINGER5には、ステップ1にある「コード入力」をする必要はありません。「AFFINGER5管理」内にある広告コード入力箇所へ記述するだけでOK。
投稿・固定記事上下に横並び表示する方法
アドセンス広告コードを取得したら、さっそくAFFINGER5で投稿ページ、固定ページの記事上または下に広告を横並び（ダブルレクタングル）表示する手順を見ていきましょう。
step
1まずWordPressダッシュボードから「AFFINGER5管理」へ進みます。
step
2メニューから「投稿・固定記事」＞「PC閲覧時に～」にチェックを入れておきます。最後は右上「保存」を忘れずに。
step
3次にメニューから「デザイン」へ進み、PC閲覧時のサイトの幅を「1114px」へ変更します。右上の「保存」を忘れずに。
step
4まずWordPressダッシュボードから「外観」＞「ウィジェット」へ進みます。
step
5左側に並ぶウィジェットの「カスタムHTML」を選択し、「広告・Googleアドセンス用336px（A）」を選び、ウィジェットを追加します。さらに右側でストックされたカスタムHTMLへアドセンス広告コード貼り付けます。
同じ要領で左側にもウィジェット「カスタムHTML」を追加し、全く同じ広告コードを貼り付けます。以上！これで横並びダブルレクタングルが完成です。
指定の見出し前に横並び表示する方法
AFFINGER5には、投稿記事・固定記事それぞれに1～5までの見出し前へ広告を自動表示できる機能があります。
この便利な機能を使って、指定する見出し前にアドセンス広告を横並び（ダブルレクタングル）表示する方法を見ていきましょう。
step
1まずWordPressダッシュボードから「AFFINGER5管理」へ進みます。
step
2左メニューの「Google連携/広告」に進み、見出し前に広告挿入欄へ広告コードを貼り、記事・場所をチェックで選択して「保存」で完了です。
<div class="clearfix responbox50">
<div class="lbox">
アドセンス広告コード（左）
</div>
<div class="rbox">
アドセンス広告コード（右）
</div>
</div>
注意したいのは「1見出し以上間隔を空ける」ことです。全見出しに表示すると・・かなり"ウザく"なりますので要注意です…。
横並び広告下へリンク広告をセットで表示する方法
最後に、アドセンス広告横並びの下に「リンク広告」もセット表示する方法です。
このセット広告は「記事上」もしくは「記事下」限定で表示することをおすすめします。各見出しで表示するのは、かなり"広告臭"が強いのでおすすめできません…。
step
1GoogleAdSenseにログイン後「広告」＞「サマリー」＞「広告ユニットごと」＞「リンク広告」と進みます。
step
2ここでは「広告ユニット名」を入力し、広告タイプを「横長タイプ」にし、広告サイズは「レスポンシブ」を選択して「作成」へ進みます。
設定補足
- 広告ユニットの名前…「ダブルレクタングル下リンク広告」など分かりやすく名前を入力。
- 広告タイプ…「横長タイプ」を選択。
- 広告サイズ…「レスポンシブ」を選択。
- 広告のスタイル…テキスト色はクリック色に近いカラーがベター。背景色は白ベースがおすすめ。
step
3リンク広告も作成後は広告コードが発行されるので、こちらをクリップボードにコピーしておきます。
step
4ウィジェット「広告・Googleアドセンス用336px（A）」にセットしたダブルレクタングル用広告コードを、「投稿記事の下に一括表示」のウィジェットへ移動し、更にその下へリンク広告コードを貼った「テキスト」を追加します。
これでダブルレクタングル＋リンク広告のセット表示ができます。
まとめ
今回は、アドセンス広告王道の横並び表示（ダブレクタングル）を投稿記事・固定記事の上下と各見出し前、またその下へ横幅を合わせて「リンク広告」を表示する3つの方法を解説しました。
AFFINGER5はウィジェットが豊富なので、いろんなタイプのアドセンス広告も表示場所がたくさんあります。ぜひ一度ウィジェットを確認してみてください。
ps.アドセンスの基本イロハが掲載されている書籍「Google AdSense マネタイズの教科書」はおすすめ。
アドセンス広告最適化の基本・クリック解析・ブログデザイン別広告表示最適化など、アドセンス入門として手元に持っておきたい書籍。アドセンス戦略をもっと知りたい方は、ぜひチェックしてみてください。
