wordpress

wordpressにadsenseのインフィード広告を設置する

wordpressのデフォルトのトップページには最新の記事一覧が表示されますが、ここにインフィード広告を設置します。毎回同じ場所だとつまらないので、記事一覧のランダムな位置に配置されるようにします。

google adsenseのアカウント作成・サイトの審査が済んでいる前提です。その方法は前回の記事に書きました。

インフィード広告の設置

インフィード広告というのは、メディアサイトのコンテンツの間に挿入されていたり、SNSのタイムラインの間に挿入されているようなタイプのものを言います。通常のバナー広告に比べてクリック率は高いようです。ただ記事と区別がつかないようにすると騙してしまうことにもなるので注意が必要です。記事内の段落の間に入っている広告はまた別で、記事内広告です。

目標

こんな感じで、記事の間に広告が入るようにする。

adsense側の手順

まずadsenseで「新しい広告ユニットを作成」する


真ん中の「インフィード広告」を選択


上部の画像、横の画像、上部のタイトル、テキストのみ、の4タイプあるので、配置する部分のデザインにあったものを選択。今回は記事一覧に設置するので、上部のタイトルかテキストのみが良さそう。私のサイトはアイキャッチ画像なしなので、テキストのみにした。


設置される広告のプレビューが表示されるので、右の入力欄に広告ユニット名を入力する。あとは好みでフォント、背景色、パディング、枠線等をカスタマイズできるので、自分のサイトに合うように設定。私は面倒なので何もいじらなかった。設定したら「保存してコードを取得」をクリック。


コードが表示されるので、これを記事一覧を出力するループの中にコピペして突っ込む。


wordpress側の手順

wordpressの管理画面から、「外観」 → 「テーマの編集」をクリックし、「メインインデックスのテンプレート(index.php)」を選択。


この28行目付近から以下のような記述があるはず(まだこのファイルをいじっていない前提)。この辺りを書き換えてさっきの広告コードをコピペする。

// ここがindex.phpの28行目あたり(まだ何も書き換えてない状態)
<?php
endif;

/* Start the Loop */
while ( have_posts() ) : the_post();

    /*
     * Include the Post-Format-specific template for the content.
     * If you want to override this in a child theme, then include a file
     * called content-___.php (where ___ is the Post Format name) and that will be used instead.
     */
    get_template_part( 'template-parts/content', get_post_format() );

endwhile;

ここからindex.phpに追記したり書き換えたりしていくので、不安な場合は元のコードをどっかにコピーして残しておいた方が良い。

上のコードの5行目で、whileループで記事を順に表示しているので、ここで条件分岐させて途中に広告を出すようにしたい。広告を出す位置が毎回変わるように、乱数で出す位置を決める。逆に毎回同じ位置(例えば3記事目と4記事目の間とか)に出したいなら数字を決めればいい。以下のコードで、公開済み記事数を取得して1〜記事数-1までの整数乱数を取得する。公開済み記事がない場合は-1にしておく。このコードを上のコードの2行目の下に挿入する。

// 広告を出す位置(何記事目か)を決める処理
// 上のコードの2行目の下に挿入する。
$num_posts = wp_count_posts();
$num_published = $num_posts->publish;
if ( $num_published > 0 ) :
    $ad_index = rand( 1, $num_published-1 );
else :
    $ad_index = -1;
endif;

次にwhileループのところに条件分岐を入れて、もしループカウント数とさっきの整数乱数($ad_index)が一致したらそこに広告を表示する処理を書く。whileループの場所を丸ごと以下のコードに書き換えればよい。ただし広告コードの部分はadsenseからコピーしてくる。

// 記事と記事の間に広告を挿入する処理。
// whileループの行を丸ごと以下のコードに置き換える。
$counter = 0;
/* Start the Loop */
while ( have_posts() ) :
    the_post();
    if ( $counter == $ad_index ) : ?>
        <!-- ここにadsenseの広告コードをコピペ -->
    <?php
    endif;
    $counter++;

最終的に以下のようになる。どうなっているのかよくわからない場合は、28行目あたりの<?phpからwhileループの終わり(endwhile;)までの部分を丸ごと以下のコードに置き換えて、あと広告コードをコピペすれば多分広告が表示されるが、間違ったらそもそも記事が表示されなくなったりするかもしれないので注意。

// ここがindex.phpの28行目あたり
<?php
endif;

$num_posts = wp_count_posts();
$num_published = $num_posts->publish;
if ( $num_published > 0 ) :
    $ad_index = rand( 1, $num_published-1 );
else :
    $ad_index = -1;
endif;

$counter = 0;
/* Start the Loop */
while ( have_posts() ) :
    the_post();
    if ( $counter == $ad_index ) : ?>
        <!-- ここにadsenseの広告コードをコピペ -->
    <?php
    endif;
    $counter++;

    /*
     * Include the Post-Format-specific template for the content.
     * If you want to override this in a child theme, then include a file
     * called content-___.php (where ___ is the Post Format name) and that will be used instead.
     */
    get_template_part( 'template-parts/content', get_post_format() );

endwhile;

うまくいっていればサイトへアクセスするたびに違う位置に広告が表示される。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です