WordPress のテーマに Cocoon を使っている場合、Google AdSense の広告を設定する方法は次の三つです。
- Google AdSense の自動広告を使う（以下「①自動広告」と記載）
- Cocoon のアドセンス設定で設定する（以下「②Cocoonアドセンス」と記載）
- Cocoon のウィジェットで設定する（以下「③Cocoonウィジェット」と記載）
本稿では、これらの方法の違いと、それぞれの設定方法についてご紹介します。
- 最初は簡単な①自動広告がおすすめ
- もっとカスタマイズしたくなったら②Cocoonアドセンス
- それでも足りなければ③Cocoonウィジェットを試してみましょう
前提条件
Google AdSense を利用するには、Google AdSense に登録し、Google による審査に合格している必要があります。この記事は、すでに審査に合格していることを前提としていますので、まだ審査に合格していない場合、まずは審査に合格するようにしてください。Google AdSense の登録・審査方法は以下のリンク先をご覧ください。
特にAdSense プログラム ポリシーに従ってサイトを作ることが重要です。
当ブログでは、プライバシーポリシー と お問い合わせ のページを作成し、記事を5つ作成した状態で審査に合格しました。10～20ぐらい記事がないとダメという情報をよく見かけますが、そこまで必要なわけではなさそうです。なお、審査に出した時期は2020年7月です。
各広告表示方法の特徴
①自動広告
少し設定すれば後は自動でいい感じにしてくれます。逆に細かい設定はできません。
主な特徴：
- 記事に関係する広告を記事中に自動的に挿入してくれる
- スクロールしてもついてくるアンカー広告を表示できる
- モバイル端末のページ読み込み時に画面全体に表示するモバイル全面広告を表示できる
- プレビューを見ながら不要な広告を削除できる
- 広告表示の除外はページ単位でしかできない
私の場合、タイトル横に表示される広告を消せなかったため、利用するのをやめました。自動広告をオフにしてもすぐには広告は消えないのでご注意ください。コードを削除してもキャッシュを削除しても広告はしばらく残ります。私の場合はオフにしてから広告が消えるまで24時間ぐらいかかりました。
②Cocoonアドセンス
広告ユニットコードを一つ設定しておけば、あとは表示位置や表示形式を選ぶだけです。
主な特徴：
- インデックスページ、サイドバー、投稿・固定ページごとに表示位置を広告表示位置を指定できる
- 広告表示位置ごとに広告表示形式を指定できる
- 記事中に表示する広告は表示個数の上限を指定できる
- 広告表示の除外をカテゴリや記事単位で一括設定できる
③Cocoonウィジェット
更に細かく表示位置を指定できます。複数の広告ユニットコードを使い分けられます。
主な特徴：
- 記事内広告ユニットを利用できる
- スクロール追従する広告を設定できる
- 広告表示の除外をカテゴリや記事以外にも、著者やタグなどでウィジェットごとに設定できる（すべてのウィジェットを一括設定できない）
私の場合、スクロール追従を使いたかったため、これを利用しています。ただ、記事内広告は表示位置を自分で決めたかったため記事作成時にカスタムHTMLブロックを使って手動で設定しています。
広告を設定する手順
大まかな流れは次の通りです。
- AdSense の広告コードを生成する
- Cocoon に広告コードを設定する
- 広告の表示位置と表示形式を設定する
①自動広告
認証用のコードと次に説明する広告コードは同じなので、認証用コードが WordPress に設定済みであれば、広告の表示位置と表示形式を設定する の手順に進んでください。
AdSense の広告コードを生成する
Google AdSense にログインします。
左上のハンバーガーメニューをクリックし、[広告]、[サマリー] をクリックします。
[コードを取得] をクリックして広告コードを生成します。
[コードをコピー] をクリックし、[完了] をクリックします。
Cocoon に広告コードを設定する
WordPress の管理メニューから [Cocoon 設定] をクリックし、[アクセス解析・認証] のタブをクリックします。
[ヘッド用コード] にコピーしたコードを貼り付けます。似たような [ヘッダー用コード] が近くにあるので間違わないように注意してください。
画面上にスクロールし、[変更をまとめて保存] ボタンをクリックします。
広告の表示位置と表示形式を設定する
Google AdSense にログインします。
左上のハンバーガーメニューをクリックし、[広告]、[サマリー] をクリックします。
右側の編集ボタン（ペンのマーク）をクリックし、設定編集画面に移動します。
画面左上の [自動広告] がオフ（グレー）になっている場合、クリックしてオン（青）にします。
表示されているプレビューを確認し、不要な広告があれば、ゴミ箱アイコンをクリックして削除します。一度削除した広告は、右下の「○個のエリアを削除しました」ボタンからもとに戻せます。
[サイトに適用] ボタンをクリックすると、設定した内容が保存されます。ただし、自動広告が反映されるまでにはしばらく時間がかかります。
②Cocoonアドセンス
AdSense の広告コードを生成する
Google AdSense にログインします。
左上のハンバーガーメニューをクリックし、[広告]、[サマリー] をクリックします。
[広告ユニットごと]、[ディスプレイ広告] を選択します。
左上に広告名を入力し、[作成] をクリックします。この広告名は Google AdSense 上で他に生成した広告と区別するための名前なので、適当で問題ありません。
[コードをコピー] をクリックして広告ユニットコードをクリップボードにコピーし、[完了] をクリックします。
Cocoon に広告コードを設定する
WordPress の管理メニューから [Cocoon 設定] をクリックし、[広告] のタブをクリックします。
画面を少し下にスクロールし、[アドセンス設定] の [広告コード] に広告ユニットコードを貼り付けます。
画面を上にスクロールし、[変更をまとめて保存] をクリックします。
広告の表示位置と表示形式を設定する
WordPress の管理メニューの [Cocoon 設定]、[広告] のタブの以下の箇所で設定します。表示したい位置のチェックボックスをオンにします。
表示形式の設定は [詳細設定] をクリックした先の [フォーマット（広告ユニット）] でできます。
[記事内広告]は選択肢として表示されるのですが、期待通りに表示されない場合があるため、今は使わないようにした方がよさそうです。本来、記事内広告を出すには以下の図の選択肢で[記事内広告]を選び生成したコードが必要です。ところが、記事内広告ユニットコードを用意しても Cocoon の広告設定側が対応していないため設定できません。記事内広告を使う場合は③Cocoonウィジェットを使う必要があります。
[リンクユニット]も専用のコードを使う必要があります。Cocoon の広告設定内にコードを設定する箇所はありますが、Google AdSense のサイトでリンクユニットのコードを生成しようとしても、現在は広告ユニットの選択肢からが削除されてコードを生成できません。
広告表示数は、[本文中] の [詳細設定] 内の以下の箇所で設定可能です。
設定を保存するには、画面を上にスクロールし、[変更をまとめて保存] をクリックします。
③Cocoonウィジェット
AdSense の広告コードを生成する
②Cocoonアドセンス と同じです。手順はこちら。
Cocoon に広告コードを設定する
②Cocoonアドセンス と同じです。手順はこちら。
広告の表示位置と表示形式を設定する
WordPress の管理メニューから[外観]にある[ウィジェット]をクリックします。
用途に応じて次のいずれかのウィジェットをクリックします。PC用とモバイル用の違いは、画面幅が 834px以下で表示されるのがモバイル用で、それより大きい場合に表示されるのがPC用です。上の手順で設定した広告コードは自動的にサイズが変わるので、「[C]広告」を選んでおけば問題ありません。
- [C] 広告
- [C] 広告（PC用)
- [C] 広告（モバイル用）
ウィジェットを追加する位置を選択して [ウィジェットを追加] をクリックします。
選択した位置にウィジェットが挿入されます。
「投稿本文中」の位置にしても、最初のH2見出しの手前1箇所にしか表示されません。
挿入された広告ウィジェットをクリックするとより詳細な設定が可能です。
詳細設定画面の中に広告ユニットコードを設定する [広告タグ] 欄があり、ウィジェットごとに広告ユニットコードを設定できます。[広告タグ] が空欄のままだと Coccoon設定の [広告コード] に設定したこうものが使われて広告が表示されます。
[広告フォーマット] では広告の表示形式を選択できます。
設定を保存するには [保存] をクリックします。
記事内広告を使いたい場合、Google AdSense のサイトで生成した記事内広告のコードを設定することで利用できるようになります。
ただ、Google は記事内広告を記事の冒頭から 2段落下の位置に挿入することを推奨していますが、
おすすめの配置は、記事の冒頭から 2 段落下の位置です。
記事内広告ユニットを作成する – AdSense ヘルプ
ウィジェットで記事内広告を設置すると2段落下の位置になるとは限らないので、2段落下に広告を挿入するには、広告ユニットコードを貼ったカスタムHTMLブロックを記事ごとに手動で挿入する必要があります。
エラーが表示されたら
「閲覧できません」のエラーが表示される場合
サーバー側の WAF(Web Application Firewall)の設定が影響している場合があります。サーバー側の WAF を一時的にオフに設定して再度 Cocoon の広告コードの設定を試してみてください。
WAFは、サーバーを乗っ取ったり、データベスを改ざんしたり、ユーザーに不正なスクリプトを実行させたりする攻撃から防御する役目を持っているので、作業が終わったら必ず WAF を オン に戻してください。
（非推奨）ConoHa で WAF をオフに設定する方法
私の利用しているレンタルサーバーConoHa WING での WAF をオフに設定する方法は次の通りです。ただし、この方法はあまりおすすめではありません。この次に説明する方法がおすすめです。
- ConoHa のコンソールにログインし、左のメニューから [サイト管理] をクリックします。
- サブメニューから [サイトセキュリティ] をクリックします。
- [WAF] のタブをクリックします。
- [WAF] の [利用設定] で [OFF] をクリックします。（もとに戻す場合は [ON] をクリックします。WordPress の設定変更が終わったら必ず [ON] に戻しておきましょう。）
ConoHa WING についてはこちらの記事で詳しく説明しています。
（推奨）ConoHa の WAF の設定で特定の攻撃内容を除外する方法
短い時間だとしても WAF を完全にオフにしてしまうのはあまり好ましくありません。ConoHa では特定の攻撃内容だけを WAF による防御対象から除外するように設定できます。やり方は次の通りです。
攻撃元が自分自身であることを確認するため、WordPress の設定変更に失敗したPCでグローバルIPアドレスを確認します。グローバルIPアドレスは以下のリンク先で確認できます。
攻撃と判断された WordPress の設定変更の操作をログの中から見つけ、WAF の防御対象から除外します。ConoHa の WAF 設定画面の下に防御した攻撃内容の一覧が表示されていますので、下のすべての条件に合った行を探し、行の左にある[除外]ボタンをクリックします。
- [日時] が WordPress の設定更新が失敗した時
- [攻撃元IPアドレス] が自分のIPアドレス
- [攻撃内容] が [クロスサイトスクリプティング]
除外の確認画面が表示されるので [はい] をクリックします。
対象の行の左のボタンがグレーの[除外解除]に変われば成功です。WordPress の設定を変更したら除外した攻撃内容を必ずもとに戻しておきましょう。もとに戻すには[除外解除]ボタンをクリックします。
除外設定解除の確認画面が表示されるので[はい]をクリックします。
「A potentially unsafe operation has been detected in your request to this site」のエラーが表示される場合
WordPress のプラグイン Wordfence が危険な操作としてブロックしているため、エラーが表示されています。以下の手順でエラーを回避するように設定し、再度 Cocoon の広告コードの設定を試してみてください。
- [I am certain this is a false positive.]（訳：これは誤検知であることが分かっています）にチェックを入れます。
- [Whitelist This Action]（訳：許可リストに追加）をクリックします。
エラーの詳細
以下は Wordfence のヘルプからの抜粋です。
403 Forbidden. A potentially unsafe operation has been detected in your request to this site.
Blocking Troubleshooting – Wordfence
If you see this message it means Wordfence has blocked you for violating a Firewall rule. If you are an admin on the site, check “Live Traffic” and locate the request that was blocked. If you are sure that the request is safe and should not be blocked, you can whitelist the action from there. If you are not an admin on the site, contact the site owner for assistance.
翻訳すると次の通りです。
このメッセージが表示された場合、Wordfence がファイアウォールのルールに違反してブロックされたことを意味します。あなたがサイトの管理者であれば、「Live Traffic」を確認し、ブロックされたリクエストを見つけてください。もし、そのリクエストが安全でブロックされるべきではないと確信しているなら、そのメッセージの画面から該当するアクションを許可リストに登録することができます。サイトの管理者でない場合はサイトの所有者に連絡してください。
Live Traffic を確認しなさいという内容ですが、今回のエラーは Cocoon の広告設定を反映するときに検知されているので、ブロックされなくてよいものです。
ただ、絶対安全というわけではないので、心配な場合は Live Traffic を確認してみてください。Live Traffic は WordPress の管理メニューの [Wordfence]、[Tools] にあります。
「Background Request Blocked」のエラーが表示される場合
WordPress のプラグイン Wordfence が危険な操作としてブロックしているため、エラーが表示されています。以下の手順でエラーを回避するように設定し、再度 Cocoon の広告コードの設定を試してみてください。
該当する操作を許可リストに追加するために [Whitelist this section] をクリックします。
許可リストに追加してよいかの確認で [OK] をクリックします。
許可リストに追加されたので再度試すように促す画面で [OK] をクリックします。
エラーの詳細
Background Request Blocked
The Wordfence Firewall can block background requests that use AJAX, showing a message that says “Background Request Blocked”. This can prevent certain types of attacks, but some plugins and themes may cause this message as well, even when their requests are safe. It is most likely to occur when adding custom HTML or javascript code in fields that are separate from the WordPress core.
As the admin of the site, you can choose to whitelist these blocked requests by clicking the Whitelist button, if you were simply working on the site when they occur. The message is only shown for logged-in admins of the site, so regular visitors, subscribers, authors, editors, or other types of users on your site will not see them.
If you see this message when clicking a link that was sent to you by another person, or a link from another site that leads to your site, it may not be safe to whitelist. You can contact us about blocked requests if you are not sure whether they are dangerous or not. Be sure to include a description of what you were working on at the time.
Wordfence Web Application Firewall (WAF) – Wordfence
翻訳すると次の通りです。
Wordfence Firewall は AJAX を使用するバックグラウンドリクエストをブロックすることができ、”Background Request Blocked “というメッセージを表示します。これは特定の型の攻撃を防ぐことができますが、プラグインやテーマによっては、リクエストが安全な場合でもこのメッセージが表示されることがあります。これは、WordPressコアとは別のフィールドにカスタムHTML や javascript のコードを追加した場合に発生する可能性が高いです。
サイトの管理者としてサイトで作業をしていてこのエラーが発生した場合、[許可リスト] ボタンをクリックしてこれらのブロックされたリクエストを許可リストに追加することができます。このメッセージはサイトにログインしている管理者のみに表示されるので、通常の訪問者、購読者、著者、編集者、などのその他のユーザーには表示されません。
他人から送られてきたリンクや、自分のサイトにつながる他のサイトからのリンクをクリックした際にこのメッセージが表示された場合は、許可リストに登録しても安全ではない可能性があります。ブロックされたリクエストについては、危険かどうかわからない場合はお問い合わせください。その時に何をしていたのかを必ず記載してください。
追加する広告コードに含まれる javascript が原因で Wordfence にブロックされてしまっているようです。
今回の場合、管理者としてサイトで作業をしているときに表示されているため、許可リストに追加すれば問題ありません。
コメント