【WordPress】値を渡すショートコードを作成・使用する例｜shortcode_atts()

WordPress では、投稿や固定ページ本文内の任意の箇所で、指定した関数を呼び出せるショートコードという機能があります。

また、そのショートコードを利用する際には任意の値を渡すことも可能ですが、今回は、その任意の値を渡せるショートコードを作成・使用する例となります。

ショートコード機能を追加する方法

ショートコードを利用するには、まず、ショートコード機能を追加するadd_shortcode関数をfunctions.phpに記述します。

また、add_shortcode関数の引数には以下を指定します。

• 第1引数にショートコードタグ名を指定
• 第2引数に、第1引数に指定したショートコードタグで実行する関数名を指定

任意の値を渡すショートコードについて

ショートコードを利用する際に「属性」を使い任意の値を渡すことができ、その値はデフォルト値を設定しておくことも可能です。

以下、ショートコードで属性のデフォルト値を設定しない場合と、設定する場合の追加方法・使用例となります。

属性のデフォルト値を設定しないショートコードの例

ショートコード機能を追加

以下は、属性を利用するショートコード機能を追加する際に、デフォルト値を設定しない場合の例となり、functions.phpに記述します。

function my_tagfunc( $atts ){
	return '<p>' . $atts['name'] . 'は、' . $atts['price'] . '円です。</p>';
}
add_shortcode( 'my_tag', 'my_tagfunc' );

上記例では、ショートコードタグmy_tagを使用した際に、関数my_tagfuncを実行します。

また、関数my_tagfuncの引数 $attsに、ショートコードで指定した属性名と属性値がセットで配列で格納されます。

そのため、関数内では、その配列のキー名（属性名）を指定することにより、属性値を取得できます。

追加したショートコードの使用例

追加したショートコードで属性を指定し使用するには、add_shortcode関数の第1引数で指定したタグ名の後に、「属性名」と「属性値」を=でつなぎ、[ ]（角括弧）で囲んだ文字列を、管理画面から投稿や固定ページの本文内に入力します。

例えば上記で作成した関数を実行する場合には、以下のような属性を指定したショートコードを本文内に入力して保存します。

[my_tag name="食パン" price="100"]

また、上記ショートコードで属性を指定しない場合には、デフォルトの属性値を設定していないため、属性値が出力される箇所は空文字となります。

ショートコードの出力結果

上記例のショートコードを入力した箇所には、以下の文字列が出力されます。

食パンは、100円です。

属性のデフォルト値を設定するショートコードの例

ショートコード機能を追加

以下は、属性を利用するショートコード機能を追加する際に、デフォルト値を設定する場合の例となり、functions.phpに記述します。

function my_tagfunc( $atts ){
	// デフォルトの属性を設定
	$pairs = array(
		'name' => '食パン',
		'price' => '100'
	);
	$atts = shortcode_atts( $pairs, $atts );
	
	return '<p>' . $atts['name'] . 'は、' . $atts['price'] . '円です。</p>';
}
add_shortcode( 'my_tag', 'my_tagfunc' );

上記例では、ショートコードタグmy_tagを使用した際に、関数my_tagfuncを実行します。

また、関数my_tagfuncの引数 $attsに、ショートコードで指定した属性名と属性値がセットで配列で格納されます。

そのため、関数内では、その配列のキー名（属性名）を指定することにより、属性値を取得できます。

属性のデフォルト値を設定するshortcode_atts関数

デフォルトの属性値を設定するには、ショートコードで実行する関数内で、shortcode_atts関数を使用します。また、shortcode_atts関数の引数には以下を指定します。

• 第1引数にはデフォルトで設定したい属性名と属性値をセットで配列として指定
• 第2引数にはショートコードで実行する関数の引数を指定

それにより、それぞれの属性値に配列$pairsの値がデフォルトの値としてセットされます。

追加したショートコードの使用例

追加したショートコードを属性を指定して使用するには、add_shortcode関数の第1引数で指定したタグ名の後に、「属性名」と「属性値」を=でつなぎ、[ ]（角括弧）で囲んだ文字列を、管理画面から投稿や固定ページの本文内に入力します。

例えば上記で作成した関数を実行する場合には、以下のような属性を指定したショートコードを本文内に入力して保存します。

[my_tag name="ランチパック"]

また、上記ショートコードで属性を指定しない場合、属性値が出力される箇所には、それぞれデフォルトの属性値の「食パン」と「100」が出力されます。

ショートコードの出力結果

上記例のショートコードを入力した箇所には、以下の文字列が出力されます。

ランチパックは、100円です。