WordPressで記事を作成していると記事中にphpで何かしらの処理を行いたい場合が出てきます。
他にもよく使う画像、アイコンを呼び出したいときに毎回毎回

<img src="アイコンのパス" />

という記述を書くのは非常に面倒くさいのです。

そういう場合にショートコードを使うと非常に便利にサクサク記事を書き進めることができますよ。
というお話。

ショートコードの作り方

function.phpを編集する

ショートコードを作成する事自体は非常に簡単です。
function.phpを編集するだけです。

構造から説明するとショートコードは

  • 関数
  • 関数を呼び出すフック

の2つから成り立っています。

下の画像では function hogeFuncという部分が関数です。
add_shortcodeという部分がフックと呼ばれるWordpressの専用関数です。

ショートコードの構造

これで記事中に

[shortcode]

と書くだけで”hello world!!”と表示されます。

色々なショートコードの例

単純に決められた文字列を返す

ほとんど実用的ではないです。
定型文とかの決まり文句があって、必ずではないけどたまに使うといった時は便利かもしれません。
ちなみに必ず入る定型文がある場合はsingle.phpを編集したほうが確実です。

function hoge() {
 return "こんにちは、◯◯です。皆様いかがお過ごしでしょうか。うんぬんかんぬん";
}
add_shortcode('sc_hoge', 'hoge');

HTMLを含む文字列を返す

冒頭に書いたような決まったアイコンを使う場合などに役立ちます。
いちいち画像のパスを覚えてなくても良いし、メディアから頑張って探す手間も省けます。

function hoge() {
 return "<img src=\"http://biz-crew.com/wp-content/uploads/icon.png\">";
}
add_shortcode('sc_hoge', 'hoge');

WordPressの関数を利用する

記事のタイトルを使いたいという場合などは以下のように書きます。

function hoge() {
 return the_title();
}
add_shortcode('sc_hoge', 'hoge');

ショートコードに引数を渡す

ショートコードに引数を渡すことも可能です。
引数を使えると用途がグッと広がります。

下記の定義は任意の名前を引数として渡してあげることで動的な文章を作成することができます。
‘name’ => ‘ichiro’
という部分が変数名とその初期値となります。
初期値というのは値が設定されてない場合のデフォルト値ということです。

複数の引数を使いたい場合はarrayの中に’tell’ => ‘09012345678’というような形で追加してけば良いです。

定義
function hoge($atts) {
    extract(shortcode_atts(array(
        'name' => 'ichiro',
    ), $atts));
 
    return $name . 'へのメッセージ';
}
add_shortcode('sc_hoge', 'hoge');
呼び出し方

[[sc_hoge name=”taro”]]

結果

taroへのメッセージ

編集後記

ショートコードはプラグインで使うこともできますがこの程度のことは自前でやるようにしましょう。
なんでもかんでもプラグインを入れると後で後悔することになりますし、セキュリティ的に危険なプラグインもあるみたいですので。

いつもシェアありがとうございます!気に入ったらシェアしていただけたら幸いです。