ブログのトップページでは、下の画像のように記事が並んでいると、読者にとって見やすいというメリットがあります。見たい記事にアクセスしやすく、便利です。
(このブログはワードプレステーマ【THE THOR(ザ・トール)】で作っています)
しかし、グーグルアドセンスの自動広告を設定すると、通常はトップページも含めて、すべてのページに自動的に広告が表示されます(広告を外すように設定したページは除きます)。
このブログの場合、アドセンスの自動広告を設定すると、トップページの表示が崩れてしまい、見づらい状態になってしまいました。
グーグルアドセンスの自動広告を設定すると、トップページの表示が崩れる
このブログでは、グーグルアドセンスの自動広告を設定すると、上の画像のように、トップページの左側半分にグーグルアドセンスの広告が表示されてしまいました。
さらに何度かアクセスしてみると、画面の大半に広告が表示されてしまいました。画面のほとんどが広告に占領されてしまい、記事一覧が右端に細長く表示されるため、とても見づらい状態でした。
そこで、グーグルアドセンスの広告をトップページのみ外すことにしました。
グーグルアドセンスの広告を非表示にする方法
グーグルアドセンスの広告コードに、コードを書き足して設置する
グーグルアドセンスの広告コードは、ページの <head> ~ </head> の間に設置します。
調べてみると、グーグルアドセンスのコードを設置する際に、コードの前後に、下のようにコードを書き足して設置すれば、トップページのみ広告非表示にできることがわかりました。
<?php if ( !is_front_page() ) : ?>
〜自動広告のコード〜
<?php endif; ?>
https://karaagebow.com/archives/5652
上に挙げたコードは、header.phpに貼り付ける必要があります。通常は子テーマのheader.phpに貼り付ける場合が多いです。(親テーマのheader.phpに貼り付けると、テーマ更新の際に、header.phpも更新されてしまう場合があるため。)
しかし、このブログで使用しているワードプレステーマ、【THE THOR(ザ・トール)】の場合は、子テーマにはheader.phpのファイルが無く、親テーマのみに入っています。
これを解決するためには、FTPソフトを使って、親テーマのheader.phpのファイルを子テーマにアップロードしてから、そこにアドセンスのコードを設置する必要があります。
子テーマにheader.phpファイルをアップロードする
FTPソフトを使用して、親テーマのheader.phpを子テーマにアップロードします(ここではFFFTPを使用しています)。
FFFTPにログインします。
上の画像の赤枠で囲んだ「wp-contemt」をクリックします。
上の画像の赤枠で囲んだ「themes」をクリックします。
上の画像の赤枠で囲んだ「the-thor」をクリックします。
上の画像の赤枠で囲んだ「header.php」をクリックします。
これで、左側のカラムに、 header.phpがダウンロードできました。
次に、初めの画面に戻り、 wp-contemt → themes →the-thor-childへ進みます。上の画像の赤枠で囲んだ 「header.php」を、右側のカラムへアップロードします。
これで、子テーマにheader.phpのファイルをアップロードすることができました。次は、ここにアドセンスの広告コードを貼り付けます。
アドセンスの自動広告コードの設置
ワードプレスのダッシュボードから、外観→テーマエディターへ進みます。
先ほど、子テーマにheader.phpをアップロードしたので、THE THOR CHILD(子テーマ)に「テーマヘッダー」が表示されます。
上の画像の赤枠で囲んだ、「テーマヘッダー」をクリックします。
上の画像の赤枠で囲んだ、</head>の直上(すぐ上)にアドセンスの広告コードを貼り付けます。
この時、アドセンスの自動広告のコード+前後にコードを書き足して、貼り付けます。
これで、子テーマのheader.phpにアドセンス自動広告をのコードを設置できました。
この方法で、トップページは広告非表示にして、他のページにはアドセンス広告を表示させることができます。
手間はかかりますが、トップページがすっきりし、広告が無い分、表示速度も速くなります。
注意点*the thor(ザ・トール)の場合
【THE THOR(ザ・トール)】では、グーグルアドセンスの広告コードを設置する場合、通常は、
外観→カスタマイズ→基本設定→高度な設定へ進み、指定された枠の中にアドセンスのコードを設置します。
枠の中にアドセンスのコードを設置する際に、トップページのみ広告非表示にさせるコードを書き足したアドセンスコードを入力しても、効果はありませんでした。
つまり、トップページのみ広告非表示にしたい場合は、通常の方法(「高度な設定」にコードを入力する)ではなく、header.phpを子テーマにアップロードして、そこにアドセンスのコードを入力する必要があります。
番外編*トップページ以外のページのアドセンス広告を外す方法
トップページ以外のページについて、アドセンス広告を外したい場合は、以下の方法で外すことができます。
まず、グーグルアドセンスにログインします。ログイン後、メニューの「自動広告」へ進みます。
赤枠で囲んだ「新しいURLグループ」をクリックします。
表示されているURLをチェック選ぶか、一覧に無い場合は、「URLを追加」をクリックしてURLを追加します。URLにチェックを入れたら次へ進みます。
上の画像の、赤枠で囲んだ部分をクリックすることで、広告の表示・非表示を選ぶことができます。
選んだら「次へ」をクリックします。
「保存」をクリックします。これで、選択したページについて、アドセンス広告の表示・非表示を設定することができました。
トップページ以外のページについては、この方法で広告非表示の設定ができます。
(この方法ではトップページのみ非表示にすることはできませんでした。全てのページについて広告非表示になってしまいました。)
まとめ
グーグルアドセンスの自動広告は、設定するだけで、サイト全体に広告が表示されてとても便利です。でも、広告がうまく表示されず、肝心の記事が見えづらくなることがあります。
とくにトップページは、広告が表示されると、記事一覧が見づらくなります。このブログも、トップページを広告非表示にしたことで、表示がスッキリし、記事一覧も見やすくなりました。
トップページを広告非表示にすることで、表示速度が上がるというメリットもあるので、この記事にまとめた方法で、トップページの広告を外して、読者にとって見やすいサイトにしてみてくださいね。