【WordPress】ショートコードの使い方

#WordPress
written by みよしや

こんにちは、みよしやです。

WordPressでサイトを作成していると、PHPを使いたくなる場面が出てくると思いますが、
固定ページ内ではPHPの処理を行うことはできません。

そこで活躍するのが’ショートコード’です。

今回はこのショートコードの作成&使用方法について書いていこうと思います。


ショートコードとは?

ショートコードは、functions.phpに定義した関数を、
WordPressの固定ページや投稿から呼び出せる機能です。


ショートコードの作成方法

functions.phpの場所
[WordPressディレクトリ]/wp-content/themes/[テーマディレクトリ]/functions.php
※WordPressディレクトリとテーマディレクトリは各環境で異なります。


まずは呼び出したい関数を定義します。
今回は文字列を返すだけのシンプルなものにします。

function sample_function() { return 'サンプルです'; }

 

このままでは固定ページから呼び出すことができないため、
次にショートコードを定義します。

add_shortcode('sample', 'sample_function');

引数の1つ目にはショートコード名(‘sample’)、2つ目には実行する関数名(‘sample_function’)を指定します。
ショートコード名が固定ページから呼び出す際の名前となります。


ショートコードの使用方法

固定ページに、下記のようにショートコード名を[]で囲んで記述するだけです。
(※イメージしやすいようにタグを付けています)

<div>
     [sample]
</div>

 

出力結果:

サンプルです

引数ありのショートコードの場合

渡した値によって挙動を変えたいという場合は、PHPの関数に引数を定義しておきます。

function join_name_function( $atts ) {
     $last_name = get_query_var($atts['last_name']);
     $first_name = get_query_var($atts['first_name']);
     return $last_name . $first_name;
}

 

add_shortcodeの記述方法は引数なしの場合と同一です。

add_shortcode('join_name', 'join_name_function');

 

呼び出す際は、ショートコード名の後にスペースを入れて引数の値を設定します。

<div>
     [join_name last_name="山田" first_name="太郎"]
</div>

 

出力結果:

山田太郎


最後に

WordPressのプラグインにはショートコードが用意されているものも多いため、
固定ページからの呼び出し方だけでも覚えておくと便利です。