WordPress・ブログ運営

WordPressショートコードの作り方｜ASP広告をAdSenseのようにランダム表示させる方法

  • 登録：
  • 更新：

WordPressには「ショートコード」と呼ばれる機能があり、長い広告コードや複雑なプログラムを短い記述に置き換えて、投稿エディタに簡単に挿入できるようになっています。

一度仕組みを理解してしまえば、あとはコピー＆ペーストで使い回せる場面が一気に広がります。WordPressでブログやサイトを運営しているなら、ぜひ取り入れておきたいテクニックのひとつです。

この記事では、ショートコードの基本的な作り方から、ASPアフィリエイト広告をGoogle AdSenseのようにランダム表示させる応用方法まで、順を追って解説していきます。

WordPressのショートコードは簡単に作れる

まずは、簡単なショートコードを実際に作ってみましょう。WordPressのテーマフォルダの直下には「functions.php」というファイルがあり、通常は「wp-content/themes/テーマ名/functions.php」という場所に格納されています。このfunctions.phpをテキストエディタで開き、ファイルの最下部に次のコードを追加します。

<?php
function abc_func() {
    return "簡単なショートコード";
}
add_shortcode('abc', 'abc_func');
?>

なお、functions.phpを直接編集すると、ちょっとした記述ミスでサイト全体が表示されなくなってしまうこともあります。編集に不安がある場合は、「Code Snippets」のようなコードスニペット管理プラグインを使うと、テーマ本体に手を加えることなく、同様のコードを安全に追加できます。

コードを追加できたら、WordPressの投稿画面を開きます。ブロックエディターの場合は、ブロック追加メニューの「ウィジェット」カテゴリから「ショートコード」ブロックを選び、追加したブロックに以下のように入力します。

[abc]

ここまでがWordPressショートコードの基本的な仕組みです。

WordPressのショートコードブロックの入力例

長文もショートコードでスッキリ

毎回同じような定型文をブログに投稿しているなら、ショートコードが力を発揮します。一度作成しておけば、その後はサイト内のどこでも同じ文章を簡単に呼び出せるようになるためです。

ASPのアフィリエイト広告コードを設置するときにも、ショートコードは役立ちます。同じ広告をサイト内の複数箇所に掲載したい場合、毎回長いコードをコピー＆ペーストするのは手間がかかります。「afi_001」のような分かりやすい名前でショートコードを登録しておけば、運用がぐっと楽になります。

いつも同じ広告では飽きられる

ショートコードを使って広告を管理すると、サイトの運用は格段に楽になります。ただし、表示される広告バナー自体は当然ながら毎回同じものです。読者の立場で考えると、ページを訪れるたびに同じ広告ばかりが表示されているのは、あまり新鮮味がないかもしれません。

その点、Google AdSenseのバナー広告はページが表示されるたびに内容が自動で切り替わります。読者は毎回違う広告を目にすることになるため、興味を引きやすいという利点があります。

実はWordPressのショートコードを応用すれば、ASPのバナー広告やテキスト広告についても、Google AdSenseと同じようなランダム表示の仕組みを作ることができます。

バナーやテキスト広告をランダム表示させるショートコードの作り方

ここからは、ASP広告をランダム表示させるショートコードの作り方を解説します。先ほど紹介した基本形を応用したもので、戻り値の文字列部分をJavaScriptに差し替えるのがポイントです。最終的にfunctions.phpへ記述する内容は、以下のようになります。

<?php
function abc_func() {$str=<<<eom
	<span id="abc"></span>
	<script type="text/javascript">
	var abc_list=[
		'広告コードA（改行不可）',
		'広告コードB（改行不可）',
		'広告コードC（改行不可）'
	];
	var rNo = Math.floor(Math.random() * abc_list.length);
	document.getElementById('abc').innerHTML = abc_list[rNo];
	</script>
eom;
return $str;
}
add_shortcode('abc', 'abc_func');
?>

注意_広告コードは改行しない

上記の例では、A～Cの3パターンの広告コードからランダムに1つを表示する仕組みになっています。ここで注意したいのは、それぞれの広告コードを必ず1行で記述することです。ASPからコピーした広告コードは複数行にまたがっていることが多いため、改行を取り除いて1行につなげる必要があります。なお、コード内に含まれる＜br/＞などのHTMLタグ自体は、基本的にそのまま残しておいて問題ありません。広告コードの内容そのものを書き換えてしまうと、成果が正しく計測されず報酬が無効になることもあるため注意してください。

ショートコードを反映させる方法

ここまでの手順で作成した広告ランダム表示用のショートコードは、投稿ページだけでなく、テーマを構成する各ファイルの中に直接記述して呼び出すこともできます。

投稿記事の中で使う場合は、先ほど紹介した方法と同じようにショートコードを挿入すればOKです。一方、テーマのphpファイルに直接組み込みたい場合は、次のように記述します。

<?php
echo do_shortcode('[abc]');
?>

ショートコードがWordPressの広告掲載を効率化

WordPressサイトで収益化を行う場合、広告コードの設置や管理は避けて通れない作業です。コードが増えるほど更新の手間も煩雑になりがちですが、ショートコードで一元管理しておけば、メンテナンス性は大きく向上します。さらに今回紹介したランダム表示の仕組みを組み合わせれば、AdSenseのように広告内容を変化させ、読者を飽きさせない工夫もできます。ぜひこの記事を参考に、ショートコードをサイト運営に取り入れてみてください。

もしショートコードを設置したのに記事内に表示されない場合は、WordPressでショートコードが表示されないときのチェックポイント３つもあわせて確認してみてください。

このテーマの関連記事はこちら