ショートコードの作り方

WordPress 3.6 を使用。

ショートコードとは、一言でいえば記事中に埋め込めるプログラムのこと。

記事中に直接 PHP のコードを埋め込めるようになる Exec-PHP 等のプラグインもあるけど、標準でサポートされてる&コードの使いまわしが容易なショートコードを使う方がずっとかしこい。

基本的には functions.php(Themify のテーマ使用時は custom-functions.php)にコードを記述して使用する。

詳しくはWordPress Codex 日本語版を参照。

自己完結型

[ショートコード] もしくは [ショートコード /] という記述がほかの文字列に置き換わって表示されるタイプ。

[ショートコード 引数1=”値1″ 引数2=”値2″] のように引数を定義することも可能。

作成方法

例として、本文中に [mod_date] と書くと 最終更新日を表示するショートコードを作成する。

1行目
ショートコードの定義。 [mod_date] というショートコードが書かれると get_modified_date という関数の戻り値に置き換えて表示する。
2行目以降
get_modified_date 関数の定義。この関数は引数を受け付ける。
3~6行目
このショートコードは formatclass の2つの引数を受け付ける。
format 引数の初期値は null、 class 引数の初期値は mod-date
formatclass の各引数の値を $format$class のローカル変数に格納する。
以上のことをいっぺんに書いている。
引数名(属性名)は必ず小文字に変換される。
8~13行目
format 引数がある場合は入力されたフォーマットを使用。
ない場合は設定画面で指定されている年月日フォーマットを使用。
15~17行目
class 属性の作成。
class 引数に明示的に null が指定された場合は class 属性自体を設定しない。
19行目
最終的な出力文字列の作成。

使用方法

最終更新日が 2013年10月31日、デフォルトの日付フォーマットが Y/m/d だとして…

[mod_date] と入力した場合
<time datetime="2013-10-31" class="mod-date">2013/10/31</time> というタグが出力される。
[mod_date format="m.d.y"] と入力した場合
<time datetime="2013-10-31" class="mod-date">10.31.13</time> というタグが出力される。
[mod_date class="hoge"] と入力した場合
<time datetime="2013-10-31" class="hoge">2013/10/31</time> というタグが出力される。
[mod_date format="Ymd" class="hoge2"] と入力した場合
<time datetime="2013-10-31" class="hoge2">20131031</time> というタグが出力される。

囲み型

[ショートコード]文章[/ショートコード] という記述で使用するタイプ。囲まれた文章を引数として受け取り処理する。

[ショートコード 引数1=”値1″]文章[/ショートコード] のように引数を定義することも可能。

作成方法

1行目
ショートコードの定義。 [unko] というショートコードが書かれると get_unko という関数の戻り値に置き換えて表示する。
2行目
get_unko 関数の定義。この関数は引数を受け付ける。
3行目
ショートコードに囲まれた文章を <span class="unko"></span> で囲って返却する。

使用方法

[unko]かりんとう[/unko] と入力した場合
<span class="unko">かりんとう</span> というタグが出力される。

テンプレート内でショートコードを使う

特に設定などは不要。下記のように書けばOK。

ウィジェット内でショートコードを使う

functions.php(Themify のテーマ使用時は custom-functions.php)にコードを記述して機能を有効にする必要がある。