アドセンスを配置・記事目次の上(h2)編【ストーク】

みなさん、こんにちは!!

管理人のピーディー( @PD_bloger ) です。

Googleアドセンスの広告配置はクリック率を大きく変えるため、超重要です

広告の貼り付け場所は「目次上」、「記事下」、(「記事中」)です。

今回は「目次上」に広告を配置する設定方法を解説していきます。すこし細かな作業が必要になります。

あわせて読みたい
記事下に広告を配置する設定についてはこちらを参照してください

詳細 ⇒ アドセンス配置・ダブルレクタングル編【ストーク】

スポンサーリンク

目次すぐ上に広告を配置する理由

訪問してくれた人が最後まで記事を読み切ってくれるように、さりげなく広告を貼り付けておくことがポイントです

適当な場所に広告を貼り付けたり、広告をむやみやたらに貼りまくったりすると『クリック率』はもちろん、『PV』『セッション継続時間』も激減していきます。

なぜクリック率らが減少するかというと、記事を読む人にとって『広告が目障り』と感じるからです。

コンテンツが良くてもゴリゴリ広告を貼りまくってる記事って読む気なくしますよね?w

広告配置イメージ

どのように広告を配置するかのイメージ図をご覧ください。↑ ↑

冒頭分と目次の間に広告が表示されているのがわかります。

これから記事を読みはじめる区切りがいいところなので、それほど広告が邪魔に感じることはないでしょう。

広告の設置方法

全体の流れ

① テーマのための関数(functions.php)を開く

② 目次に配置するためのコードのテンプレをコピペ

③ アドセンスの広告コードを ② にコピペ

おおまかに 3 つの作業です。

「 アドセンス配置・ダブルレクタングル編【ストーク】 」ではウィジェットにコードを貼り付けていましたが、今回は「テーマの編集」というところに貼り付けることがポイントです

テーマの編集を開く

ダッシュボードの左側画面「外観」から「テーマの編集」を選択します。

デフォルトでは「テーマのための関数 (functions.php)」「yarpp-template-relative.php」「スタイルシート (style.css)」の 3 つが表示されているはずです。

注意すべきポイントは、「テーマファイル」は「テーマのための関数 (functions.php)」を選択すること。

もうひとつ、「編集するテーマを選択」欄が「stork_custom(子テーマ)」になっていることを確認することです。

超重要です

ストークの親テーマ、子テーマについてはこちら
 ⇒ WordPress にストークをインストール・初期設定【2018年版】

広告配置用のテンプレコードをコピペする

「テーマのための関数 (functions.php)」のなかには既にいくつか英数字が記載されています。

これらは消さないでください

function add_ad_before_h2_for_3times($the_content) {
//広告(AdSense)タグを記入
$ad = <<< EOF

ここにアドセンス広告コードをコピペ

EOF;

if ( is_single() ) {//投稿ページ
 $h2 = '/^<h2.*?>.+?<\/h2>$/im';//H2見出しのパターン
 if ( preg_match_all( $h2, $the_content, $h2s )) {//H2見出しが本文中にあるかどうか
 if ( $h2s[0] ) {//チェックは不要と思うけど一応
 if ( $h2s[0][0] ) {//1番目のH2見出し手前に広告を挿入
 $the_content = str_replace($h2s[0][0], $ad.$h2s[0][0], $the_content);
 }
 }
 }
 }
 return $the_content;
}
add_filter('the_content','add_ad_before_h2_for_3times', 10);

一番下にテンプレコードを貼り付けます。

「ここにアドセンス広告コードをコピペ」というところに、後ほど広告コードをコピペします。

※ 上記のメッセージは消します。

ひとまず、テンプレコードをコピペし、「ファイルを更新」してしまいましょう。

Googleアドセンスから広告コードを取得

Googleアドセンスのページを開きましょう。

リンクはこちら ⇒ https://www.google.com/adsense/login/ja/

広告コードを取得します。

ホームボタンすぐ下にある「広告の設定」をクリックし、「広告ユニット」を選択します。

広告コードを取得するには「新しい広告ユニット」を選びます。

広告のタイプ・種類の選択画面です。

「テクスト広告とディスプレイ広告」を選びましょう。

主に設定するのは、広告の「名前」「サイズ」です。

● 「名前」は何でもよいのですが、今後の管理をするうえで、あらかじめ設定しておくことをおすすめします。(例)ブログ名、貼り付け場所、etc..

● 「サイズ」は「自動サイズ レスポンシブ」を選択します。

これで「保存してコードを取得」をし広告コードを作成します。

できたての広告コードを全選択し、コピーします。

では、アドセンスの画面は閉じてしまってよいので、WordPressのダッシュボード画面に戻りましょう。

テーマのための関数 (functions.php) に広告コードをコピペする

アドセンスの広告コードを入れると、「EDF ⇒ <script ・・・ほにゃらら ・・・</script> EDF;」こんな感じになります。

これで目次の上に広告が表示されるようになります。

補足で、広告の上に「スポンサーリンク」という文字を表示させたいなら、

<p style="text-align: center;"><span style="font-size:85%">スポンサーリンク</span><br />

アドセンスのコードの頭「<script ・・・ほにゃらら 」の一行上に上記コードを入れてみてください。

「”font-size:85%”」の数値を変更することで文字の大きさを調整できます。いろいろ試しましたが、85%がちょうど良いかと思います。お好みでどうぞ。

今回のポイント

① 編集するテーマは「子テーマ」

② テーマファイルは「テーマのための関数 (functions.php)」

③ アドセンス広告サイズは「自動サイズ」

これらの 3 つに気をつけましょう。

それでは、よいアドセンスライフを送ってください!!

わからないことがあれば、メッセージくださいませ。

ここまでお読みいただきありがとうございました。