SOFTELメモ Developer's blog

会社概要 ブログ 調査依頼 採用情報 ...
てるてる動画

【WordPress】投稿本文でちょっとしたタグをお手軽実装The Shortcode API

概要

WordPressで使えるこんなタグを、簡単に実装できる。

[hoge] → 何かhogeの動きをする
[hoge/] → 何かhogeの動きをする
[hoge foo='bar'] → 引数fooをbarとして、何かhogeの動きをする
[hoge foo='bar'/] → 引数fooをbarとして、何かhogeの動きをする
[hoge]content[/hoge] → 引数に内容contentを渡して、何かhogeの動きをする
[hoge foo='bar']content[/hoge] → 引数にfoo=barとcontentを渡して、何かhogeの動きをする

手順

テーマファイルのfunctions.phpに書いてもよし、プラグインの形にしてもよし。

関数を定義して、add_shortcode()関数でショートコードハンドラ関数を登録する。

(ここで使用されている shortcode_atts()という関数は、WordPressに組み込まれている便利関数)

function hoge_handler( $atts, $content = null, $code = '' ) {
    extract( shortcode_atts( array(
        'foo' => '属性fooのデフォルト値 ',
        'bar' => '属性barのデフォルト値 ',
        // ...etc
    ), $atts ) );
    return $foo . $bar . $content . $code;
}
add_shortcode('hoge', 'hoge_handler');

書いてみる


[hoge]content[/hoge]
[hoge]content[/hoge]

[hoge foo='bar']content[/hoge]
[hoge foo='bar']content[/hoge]

[hoge/]
[hoge/]

[hoge foo='bar']
[hoge foo='bar']

なお、同じタグを入れ子にする場合には注意が必要だそうで、上の動作サンプルは順番を考えて配置しています。同じタグを多数挿入するときは書き方に注意した方がよさそうです。

参考

http://wpdocs.sourceforge.jp/%E3%82%B7%E3%83%A7%E3%83%BC%E3%83%88%E3%82%B3%E3%83%BC%E3%83%89_API

関連するメモ

コメント