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

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

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パターンです。

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