ブログ PR

【JINカスタマイズ】WordPressで広告を2番目以降のH2タグの直前に挿入する方法

  /
wordpress広告設定
記事内に商品プロモーションを含む場合があります

このブログにも使用しているWordPress用のJINというテーマでは「広告管理」というメニューから広告の一元管理をする事ができます。

詳細は、公式サイトの広告管理の使い方をご参照ください。

ただし記事内（ヘッダーや記事の最後を除く）に表示する広告は、「最初のH2タグの直前に挿入する」のみで、2番目、3番目などのH2タグの直前に挿入する機能はありません。

本記事では、カスタマイズすることにより、指定したH2タグの直前に広告を挿入する方法について記載します。

なお前提条件として、WordPressのテーマとしてJINを利用しており、さらに子テーマとしてJIN Childを利用している事とします。

記事内に広告を表示する一般的な方法

まずはJINの広告管理を使用せずに、記事内に広告を表示するための一般的な３つの方法について記載します。「カスタマイズとか面倒くさい事はしたくない」という方はこちらの方法を参考にしてください。

  1. 記事ごとに広告タグを設定する。
  2. 自動広告を設定する。
  3. プラグインを利用する。

記事毎に広告タグを設定する。

記事ごとに広告タグを設定するのは、単純にエディタをテキスト表示にして、挿入したい箇所に広告タグを記載すれば良いだけです。

この方法ならば、H2タグの直前以外でも自由に設定する事が出来ます。

手間に思わないならば、素直にこの方法でも良いかもしれません。

自動広告を設定する。

googleアドセンスには「自動広告」という機能があり、記事内の「適当」な箇所に自動で広告を設定してくれます。

ここで「適当」というのは、「ほど良い」という意味ではなく、悪い意味での「適当」です・・

リストの途中とかに挿入されたりする事もあるので、ちょっと勘弁して欲しいです。

うまく活用している方もいるようですが、個人的には、まだ、発展途上の機能かと思います。(2020年4月時点)

プラグインを利用する。

広告の挿入のための機能を提供しているプラグインもあります。

その中でも以下の２つが高機能で良いという評判を聞きます。

  • Advanced Ads
  • Ad Inserter

私は、それほど高機能な機能は必要もないので使用しておりませんが、手軽に導入したい方は使用してみるのも良いかもしれません。

カスタマイズ

ではいよいよカスタマイズして、指定したH2タグの直前に広告を挿入する方法について記載します。

JINの広告管理画面をカスタマイズして、広告を挿入したいH2タグを指定できるようにするのもそれほど難しくはないと思いますが、テーマをアップデートした時に若干面倒臭いので、子テーマのfunction.phpのみをカスタマイズする方法について記載します。

ダッシュボードのメニューの「外観」→「テーマエディタ」から「テーマファイル」（テーマのための関数(function.php)」を開きます。

※もしくは、サーバにアクセスにて、以下を開いて編集します。

<サイトのホームディレクトリ>/public_html/wp-content/themes/jin-child/function.php

function.phpに以下のソースコードを追加して保存します。

/*記事中の最初以外のh2タグの上に広告自動設置*/
function content_insert_ad_custom($the_content) {
	global $post;
	//広告を設定するh2タグ（何番目か) ※1が2番目(最初(0)はデフォルトで設定済)
	$insert_num_array = [2,4,6];
	// 投稿のみに適用
	if ( ! is_single() ) {
		return $the_content;
	}
	$h2_ad = get_post_meta($post->ID, 'custom_ad_off', true);
	//管理画面で設定したテキスト(※例:スポンサーリンク)
	$ad_text = get_option('ad_setting_text');
	if( ! $h2_ad == 'この記事で広告を表示しない' ){
		//管理画面から設定した広告タグ
		$ad_single_h2 = is_mobile()?get_option('ad_single_h2_sp'):get_option('ad_single_h2_pc');
		if ( $ad_single_h2 ){
			$ad = '<div class="sponsor-h2-center">'.$ad_text.'</div><div class="ad-single-h2">'.$ad_single_h2.'</div>';
			$tag ='/^<h2.*?>.+?<\/h2>$/im';
			if ( preg_match_all( $tag, $the_content, $tags )) {
				if ( $tags[0] ) {
					//指定したh2タグの前に広告を挿入
					for ($i = 0 ; $i < count($insert_num_array); $i++){
						$insert_num = $insert_num_array[$i];
						if ( $tags[0][$insert_num] ) {//H2見出し手前に広告を挿入
							$the_content  = str_replace($tags[0][$insert_num], $ad.$tags[0][$insert_num], $the_content);
						}
					}
				}				
			}			
		}
	}
	return $the_content;
}
add_filter('the_content','content_insert_ad_custom');

 

上記コードでは、JINの広告管理で「最初のH2タグの直前に挿入する」で指定した広告タグを３番目、５番目、７番目のH2タグの直前にも挿入するようにしています。

指定している箇所は5行目の以下となります。（０番始まりなので、プラス1した数がN番目の「N」となります。）

$insert_num_array = [2,4,6];

 

挿入したいタグの番号を変更する場合は、この「$insert_num_array」の値を変更します。（なお、０を指定すると、JINのデフォルトの関数と被って最初のH2タグの直前に２回、広告が表示されてしまうので注意してください。）

また15行目にて広告管理画面で設定した広告タグを設定しています。

$ad_single_h2 = is_mobile()?get_option('ad_single_h2_sp'):get_option('ad_single_h2_pc');

 

もし、管理画面で設定したものと別の広告タグを設定したい場合は「$ad_single_h2」に別の広告タグを設定してください。

ハードコーディングする場合は以下のようにします。（「ここに広告タグを記載する。」の箇所に実際の広告タグを記載します。）

$ad_single_h2 = <<< EOF
ここに広告タグを記載する。
EOF;

 

まとめ

以上、WordPressのJINをカスタマイズして、指定したH2タグの直前に広告を挿入する方法について記載しました。

googleアドセンスの自動広告がもう少し頭がよくなれば（もしくはもっと細かい設定ができれば）、そちらを使いたいのですが、まだ時間がかかりそうです。

また記事内広告は、あまり入れすぎると読みづらくなるので、広告はほどほどに入れるようにしましょう。

こんな記事もおすすめ