WordPress技術ブログは、毎週月曜日の午前7時に更新!最新の情報をお見逃しなく!

Web制作の基本

WordPressのショートコードが便利!基本の作り方

プラグインを使っていると、投稿記事の中に[〇〇]のように[]で囲ったテキストを入力して、問い合わせフォームなどを追加するということがあります。この[]で囲ったテキストはショートコードといいます。

このショートコードを使うと、テンプレートで使っているテンプレートタグや、functions.phpに書いたプログラムを投稿記事で使うことができるようになります。知っているとちょっと便利なので、ぜひ覚えておきましょう。

簡単なショートコードの作り方

ショートコードを使う場合は、テーマ内のfunctions.phpに記入します。一番簡単な、ただのテキストを出力するショートコードです。fuctions.phpの一番下に次のコードを追加します。

function hogehoge() {
return "テキストを表示します";
}
add_shortcode('hoge', 'hogehoge');

これで、[hoge]といういショートコードを使うことができるようになりました。管理画面の投稿の編集画面で、[hoge]と入力し、プレビューを確認すると[hoge]と入力したところに、「テキストを表示します」と表示されます。

add_shortcode(‘hoge’, ‘hogehoge’);という関数で、ショートコードを追加しています。かっこの中の一つ目の「hoge」は、投稿の編集画面に入力するコード、二つ目の「hogehoge」はfunctions.php内で実行する関数を入力します。

とても簡単なショートコードですが、サイト内で繰り返し使う文言で、将来的に変更になる可能性がなるものをショートコードにしておくと、後から一括で変更できて便利です。

テンプレートタグを投稿記事内で使うショートコード

テンプレートの中で使うことができるテンプレートタグも、ショートコードで呼び出すことができます。functions.phpの一番下に次のコードを追加します。

function blogname_func() {
return get_bloginfo('name');
}
add_shortcode('blogname', 'blogname_func');

そして、編集画面で[blogname]と入力すると、記事内にサイトのタイトルを表示することができます。
テーマのディレクトリのURIを取得して、テーマで使っている画像のURLを出力したりと便利に使うことができます。

おまけ:ちょっとしたプログラムを動かす

phpが分かる場合は、ちょっとしたプログラムをfunctions.phpに書いて、結果をショートコードで出力することができます。
例えば、次のコードは、[countdate]というショートコードで、2020年7月24日まであと何日残っているかを出力するというものです。

function countdate_func() {
$datetime = new DateTime('2020/7/24');
$current = new DateTime('now');
$diff = $current->diff($datetime);

if ($diff->invert) {
$dead_line = ‘イベントは終了しました’;
} else {
$dead_line = ‘イベントまで’. $diff->format(‘%a 日’) . ‘です!’;
}
return $dead_line;
}
add_shortcode(‘countdate’, ‘countdate_func’);

ショートコードで便利に!

functions.phpにちょっと追記するだけで、簡単に使えるショートコード。何度も投稿に出てくる、これから変更になるかもしれない言葉を設定しておくと簡単に差し替えをすることができます。
ぜひ、使ってみてください!

WordPressでお悩みの方へ!
ABOUT ME
数藤圭介
株式会社ネクストアクション代表取締役、WEBディレクター、ワードプレス運営アドバイザー、ビデオグラファー。趣味:小旅行、ギター、硬式テニス