実際にサンプルコードを動作させながらWordPressショートコードの作り方を確認してみました。
下記サイトを参考にしました。
http://wp.smashingmagazine.com/2009/02/02/mastering-wordpress-shortcodes/
※目次をクリックすると目次の下部にコンテンツが表示されます。
１）functions.phpにショートコードを定義
function hello() {
return 'こんにちは!';
}
add_shortcode('hl', 'hello');
●サンプルコードの説明
・add_shortcode()関数を使って、hello()関数をショートコードとして登録します。hello()関数の下に下記記述を追加します。
○構文
add_shortcode( $tag , $func );
$tag
記事の本文でこのショートコード実行するのに指定するタグ
$func
上記タグが見つかった場合に実行される関数
２）投稿本文にショートコードのタグを記述
下記の構文でショートコードのタグを記述します。
[hl]
３）表示確認
ブラウザで投稿を表示し、ショートコードのタグを記述した部分が”こんにちは!”と表示される事を確認
[url 引数1]引数2[/url]の形で使用するショートコードを作成します。
下記のように使用します。
ショートコードのタグ
[url href=”http://www.example.com”]ショートコードの例[/url]
出力結果
<a href=”http://www.example.com”>ショートコードの例</a>
●作成方法
functions.phpに下記コードを記述します。
function myUrl($atts, $content = null) {
extract(shortcode_atts(array("href" => 'http://'), $atts));
return '<a href="'.$href.'">'.$content.'</a>';
}
add_shortcode("url", "myUrl");
●コードの説明
○shortcode_atts( $defaults_array, $atts );
・ショートコードの無効な属性値を除外し、属性とその値を格納した連想配列を返します。
・引数
$defaults_array：認識される属性名とそのデフォルト値を指定する連想配列
$atts：ショートコードハンドラに渡される生の属性配列
・上記例では、属性名がa要素のhref属性でデフォルト値が’http://’としています。
$attsがショートコードの一番目の引数に指定する文字列で、上記例では、”href=”http://www.example.com”です。
引数1に”href”という属性値が指定されている場合はそこで指定された値が使用され、hrefが指定されていない場合は、デフォルト値を使用します。a要素には指定出来る属性が決まっていますが、shortcode_atts()使用する事によって、入力ミスをしてhref以外の文字を入力してしまった場合は除去してデフォルト値にしてくれるので安全に使用できます。
○extract()
・array(“href” => ‘http://www.example.com’, “name” => ‘名前’)といった連想配列を$href, $name などの属性キーの名前のローカル変数を作成します。
$href = “http://www.example.com”
$name = “名前”
・ショートコードの第二引数はa要素の外で使用される文字列なので入力値をそのまま出力しています。
今この記事を読んでいます。[その記事のURL]
１）ショートコードを作成
functions.phpに下記コードを登録
function twitt() {
return '<div id="twitit"><a href="http://twitter.com/intent/tweet?text=今この記事を読んでいます。 '.get_permalink($post->ID).'" title="クリックするとこの記事をツイッターに送信" target="_blank">ツイッターに共有</a></div>';
}
add_shortcode('twitter', 'twitt');
２）動作確認
①WordPressの記事内に[twitter]を記述
②ブラウザで記事を表示し、”ツイッターに共有”のリンク押下
③ツイッターに”今この記事を読んでいます。[その記事のURL]”のメッセージが送られます。