SANGO｜ヘッダー下に広告を表示させるカスタマイズ

ヘッダー下に広告を表示する方法
- ステップ1：entry-content.phpを編集する
- ステップ2：entry-header.phpを編集する
行った作業の確認
- entry-content.phpのコードの解説
- entry-header.phpの解説
ポリシー違反について
- では、禁止されている配置とは？

ヘッダー下に広告を表示する方法

SANGOでヘッダー下に広告を表示させるには「entry-content.php」と「entry-header.php」の2つを編集します。この2つのファイルを編集するには「FileZilla」などのFTPソフトを使って子テーマにファイルをアップロードする必要があります。

「FTPソフトの使い方がわからね〜！」という人はググるとたくさんの参考サイトが出てきますので、まずはそちらの方法をお試しください。

以降は「entry-content.php」と「entry-header.php」が子テーマにすでにアップロードされている前提ですすめます。

ステップ1：entry-content.phpを編集する

<section class="entry-content cf">
  <?php
	$show_ads = ( get_post_meta( $post->ID, 'disable_ads', true ) ) ? null : "1";
    // 記事の中身
    the_content();
    // 分割ページのページネイション
    wp_link_pages( array(
      'before'      => '<div class="page-links dfont">',
      'after'       => '</div>',
      'link_before' => '<span>',
      'link_after'  => '</span>',
    ) );
    // 記事下広告（ウィジェットで設定）
    if( wp_is_mobile() && is_active_sidebar('ads_below_contents_mb') && $show_ads ) {
      dynamic_sidebar('ads_below_contents_mb');
    } elseif( !wp_is_mobile() && is_active_sidebar('ads_below_contents_pc') && $show_ads ) {
      dynamic_sidebar('ads_below_contents_pc');
    }
  ?>
</section>

上記コードを子テーマの「entry-content.php」に上書きしてください。

ステップ2：entry-header.phpを編集する

<?php // 記事タイトルまわりのテンプレート ?>
<header class="article-header entry-header">
  <?php
    $show_ads = ( get_post_meta( $post->ID, 'disable_ads', true ) ) ? null : "1";
    // タイトル下広告（ウィジェットで設定）
    if( wp_is_mobile() && is_active_sidebar('ads_below_title_mb') && $show_ads ) {
      dynamic_sidebar('ads_below_title_mb');
    } elseif( !wp_is_mobile() && is_active_sidebar('ads_below_title_pc') && $show_ads ) {
      dynamic_sidebar('ads_below_title_pc');
    }?>
  <?php
    breadcrumb(); // パンくず
  ?>
  <h1 class="entry-title single-title"><?php the_title(); //タイトル?></h1>
  <div class="entry-meta vcard">
    <?php 
      if(get_option('show_only_mod_date')) {
        echo sng_get_single_date(null, 'entry-time');
      } else {
        echo sng_get_date(null, 'entry-time');
        echo sng_get_modified_date(null, 'entry-time');
      }
    ?>
  </div>
  <?php if (has_post_thumbnail() && !get_option('no_eyecatch')) : //アイキャッチ画像 ?>
    <p class="post-thumbnail"><?php the_post_thumbnail('thumb-940');?></p>
  <?php endif; ?>
  <?php
    // FABボタン
    if(!get_option('no_fab') && !sng_disable_share_button()) :
  ?>
    <input type="checkbox" id="fab">
    <label class="fab-btn extended-fab main-c" for="fab"><?php fa_tag("share-alt","share-alt",false) ?></label>
    <label class="fab__close-cover" for="fab"></label>
    <?php // FABの中身 ?>
    <div id="fab__contents">
      <div class="fab__contents-main dfont">
        <label class="close" for="fab"><span></span></label>
        <p class="fab__contents_title">SHARE</p>
        <?php if (has_post_thumbnail()) : // サムネイルあり ?>
          <div class="fab__contents_img" style="background-image: url(<?php echo featured_image_src('thumb-520'); ?>);">
          </div>
        <?php endif; ?>
        <?php insert_social_buttons('fab');?>
      </div>
    </div>
  <?php endif; // END FABボタン ?>
  <?php if(get_option('open_fab')) insert_social_buttons('belowtitle'); // 通常のボタン ?>
</header>

上記コードを子テーマの「entry-header.php」に上書きしてください。

以上の作業でヘッダーの下に広告を表示する方法は終わりです。

ウィジェットの「記事タイトル下広告（モバイル・PC）」に広告を貼り付けると以下の画像のようにヘッダー下とパンくずリストの間に広告が表示されるようになります。

行った作業の確認

entry-content.phpのコードの解説

まずは「entry-content.php」から見ていきます。

    // タイトル下広告（ウィジェットで設定）
    if( wp_is_mobile() && is_active_sidebar('ads_below_title_mb') && $show_ads ) {
      dynamic_sidebar('ads_below_title_mb');
    } elseif( !wp_is_mobile() && is_active_sidebar('ads_below_title_pc') && $show_ads ) {
      dynamic_sidebar('ads_below_title_pc');
    }

「entry-content.php」内の4行目にあるコードが「記事タイトル下広告（モバイル・PC）」のウィジェットを使うためのコードになります。

このコードを「entry-header.php」に移動するので「entry-content.php」からは削除しましょう。

そのまま残しておくとヘッダー下とタイトル下に同じ広告が重複して表示されるので見栄えがよくありません。（気にならない人は残しておいてもOKです）

entry-header.phpの解説

次は「entry-header.php」を見ていきます。

  <?php
    $show_ads = ( get_post_meta( $post->ID, 'disable_ads', true ) ) ? null : "1";
    // タイトル下広告（ウィジェットで設定）
    if( wp_is_mobile() && is_active_sidebar('ads_below_title_mb') && $show_ads ) {
      dynamic_sidebar('ads_below_title_mb');
    } elseif( !wp_is_mobile() && is_active_sidebar('ads_below_title_pc') && $show_ads ) {
      dynamic_sidebar('ads_below_title_pc');
    }?>

上記コードを広告を表示させたい好きな場所に貼り付けます。今回はパンくずリストの上に貼り付けましたが、アイキャッチの上に広告を表示させたい場合は、

  <h1 class="entry-title single-title"><?php the_title(); //タイトル?></h1>
  <div class="entry-meta vcard">
    <?php 
      if(get_option('show_only_mod_date')) {
        echo sng_get_single_date(null, 'entry-time');
      } else {
        echo sng_get_date(null, 'entry-time');
        echo sng_get_modified_date(null, 'entry-time');
      }
    ?>
  </div>

これの直下に先ほどのコードを貼り付けましょう。

コード内は表示箇所が親切にコメントアウトされているのでわかりやすいかと思います。基本はインパクトの強いヘッダー下を利用するのがおすすめです。

ポリシー違反について

Google AdSenseの「広告のプレースメントに関するポリシー」には、

スクロールしなければ見えない位置にコンテンツを配置するサイトレイアウトは避けてください。こうしたレイアウトでは、コンテンツと広告の区別が難しくなります。
広告掲載に関するポリシー

との記載があります。

しかし”禁止”をしているわけではありません。実際にヘッダー下に広告を配置しているサイトもありますし、僕が管理しているゲーム攻略サイトでも広告を配置してますが、半年以上経過した今もポリシー違反に関する通知はきていません。

では、禁止されている配置とは？

広告の配置で禁止されているのは以下の11パターンです。

禁止されている配置

その種類にかかわらず、ツールバーなどのソフトウェアアプリケーションに組み込むこと（AdMob のみ可能）
ポップアップまたはポップアンダーに表示すること（Google 広告、検索ボックス、検索結果を含むページが、ポップアップやポップアンダーで読み込まれる場合も含む）
メール内に組み込むこと、またはメールの内容が主なコンテンツであるウェブページに組み込むこと
主なコンテンツが動的なもの（チャット、インスタントメッセージ、自動更新コメントなど）であるウェブページに組み込むこと
ページのさまざまな要素によって不明瞭にすること
ボタンなどのすぐ近くまたは直下など、アプリや広告に対する一般的な操作の妨げになるような位置に広告を配置すること
コンテンツがないウェブページに組み込むこと（検索向け AdSense とモバイル検索向け AdSense では可能）
広告表示のみを目的として公開されているページに組み込むこと
ロゴや商標またはその他のブランド要素を不適切に用いることで、Google と関係があると誤解される可能性があるコンテンツや URL を含むページで使用すること
他の Google サービスのポリシーに違反する形で、各サービス上、サービス内部、サービスの近くで使用すること
コンテンツをフレーム処理するページに配置されました。コンテンツをフレーム処理するとは、サイトやアプリがそのコンテンツの所有者の許可なく他人のサイトでフレームまたはウィンドウ内に表示されることです

ヘッダー下はあくまで「避けて掲載してね」ということではありますが、「広告のプレースメントに関するポリシー」には”許可されない配置方法の例”というものも記載されているので、心配な人は今までとおり配置しないのが無難でしょう。