アドセンス広告をショートコードにして記事内に挿入する方法。

記事上、記事下などの決まった位置に掲載することが多いGoogleアドセンスですが、記事内の文章と文章の間に表示したいことってありますよね。

適切に表示することで収益化にもつながるので、Googleアドセンスの新しい広告ユニットとしても追加されたほどです。

Googleアドセンス記事内広告の掲載方法は？効果はある？ Fantastech!! もっと見る

ただ、ファイルに直接貼り付けるのとは違い、Googleアドセンスのコードをそのまま記事内に貼るのは面倒ですし、そもそもどうやって使えばいいのかわからない方もいると思います。

そこで今回は、Googleアドセンス広告を記事内に簡単に表示できる「ショートコード」の登録方法や使い方を詳しくご紹介します。

1
ショートコードとは？
2
使い方
3
条件分岐をする
4
まとめ

ショートコードとは？

ショートコードとは、HTMLを特定の文字列として登録することで呼び出せるWordPress固有のコードです。簡単に言えばショートカット機能のことですね。

どんなに長いHTMLでも、〇〇や△△のような短い文字列にできるので、気軽に使える上に、視認性が非常に高くなるのが最大の特徴です。

また、一回一回コードを記述しているわけではなく、登録されたコードを呼び出しているだけなので、登録元のコードを修正するだけですべての記事で修正が反映されるのも大きな利点です。

その他にも条件分岐ができるなどの特徴がありますが、そこら辺は後述します。

使い方

functions.php（子テーマでも可）に下記のコードをコピペし、アスタリスクの部分にアドセンスのコードを上書きするだけでショートコード化は完了です。

通常の広告ユニットはもちろんのこと、新しく追加された記事内広告でも使えます。

function adsense_in_article_shortcode_child_4536() {
 $adsense_code = '***'; //アドセンスコードを貼り付け
 return '<div class="ad-wrapper clearfix">'.$adsense_code.'</div>';
}
add_shortcode('adsense', 'adsense_in_article_shortcode_child_4536');

後は、アドセンス広告を表示したい場所で[[adsense]]と入力するだけ。テキストモードに切り替える必要もありません。

スタイルの変更

こちらがサンプルCSSですが、余白などは適宜変更していただければと思います。

.ad-wrapper {
 margin: 2rem auto;
 text-align: center;
}

条件分岐をする

ショートコードの便利なところは、条件分岐ができることです。いくつかサンプルコードをご紹介します。

PCページとモバイルページで表示切り替え

function adsense_in_article_shortcode_child_4536() {
 if( is_mobile() ) {
  $adsense_code = '***'; //モバイルページ用のアドセンス
 } else {
  $adsense_code = '***'; //PCページ用のアドセンス
 }
 return '<div class="ad-wrapper clearfix">'.$adsense_code.'</div>';
}
add_shortcode('adsense', 'adsense_in_article_shortcode_child_4536');

通常ページとAMPページで表示切り替え

通常ページ用のアドセンスのコードの中にある

data-ad-client
data-ad-slot

の2つの値をそれぞれAMPページ用のアドセンスコードにコピペするだけでOKです。

function adsense_in_article_shortcode_child_4536_amp() {
 if( is_amp() ) {
  $adsense_code = '<amp-ad layout="responsive" width=336 height=280 type="adsense" data-ad-client="ca-pub-***" data-ad-slot="***"></amp-ad>'; //AMPページ用のアドセンス
 } else {
  $adsense_code = '***'; //通常ページ用のアドセンス
 }
 return '<div class="ad-wrapper clearfix">'.$adsense_code.'</div>';
}
add_shortcode('adsense', 'adsense_in_article_shortcode_child_4536_amp');

このコードでは、is_ampという関数でAMPページかどうかの条件分岐をしていますが、上手くいかない場合は下記記事で紹介している方法を試してみてください、

PHP（WordPress）でAMP対応ページかどうか判別する方法。 Fantastech!! もっと見る