【使いこなすと最強】WordPressでショートコードを作って効率化をしてみた

What’s?

WordPressには、標準機能として搭載されているショートコード機能というものがあります。

これは、あらかじめfunctions.phpに登録しておいたPHP関数を、記事投稿画面から呼び出して利用することが出来る機能です。

この機能を使うことで、計算や文字列整形を自分でやらずにPHP関数を利用した動的処理を簡単に実行することが出来ます。

クイックタグとはどう違う？

WordPressには、よく使う文章をボタン一つで簡単に挿入するための機能としてクイックタグというものがあることは以前ご紹介致しました。

参考

【QuickTagsで効率化】WordPressのクイックタグをカスタマイズして記事投稿をスピードアップ！

Wordpress お小遣い稼ぎ カスタマイズ ブログ

しかし、クイックタグはあらかじめ登録している文字列をそのまま貼り付ける機能となるので、動的処理をした結果を挿入したい！という用途では利用することが出来ません。
あくまで静的な挿入に限られます。

この機能はとても便利

前述の通り、この機能を使うこなすことで複雑なHTML構造を簡単かつ動的に挿入したり数字の計算を行うことが出来るので、記事の作成スピードが格段に上がります！
また、ショートコードの作り方もとても簡単です。

今回はショートコードの作り方をまとめてみましたのでご紹介致します。

スポンサーリンク

前提

ショートコードは使用しているテーマのfunctions.phpを編集することになります。
このファイルが壊れてしまうとWordPressの管理画面が表示されなくなってしまうので必ずバックアップを取った上で作業を行うようにしてください。
また、作業は自己責任でお願い致します。

独立型ショートコード

まずは、単純にテキストを挿入するだけのショートコードを作ってみましょう。
functions.phpに以下のコードを追記して保存をしてください。

保存が完了したら、投稿の編集画面のテキストビューにて以下のコードを追加してプレビューしてみてください。

すると、以下のようにテキストが表示されたと思います。

これは、Wordpressのadd_shortcode( $tag , $func )という関数を利用しています。

$tagにはテキストエディターで呼び出す際の文字列を指定し、$funcにはfunctions.phpで定義したPHP関数名を指定します。
そして、テキストエディターから[$tag]という形で呼び出すことが可能になっています。

引数型ショートコード

次に、テキストエディターから呼び出す際に値を受け取ってそれを利用して処理を行うショートコードを作ってみましょう。
functions.phpに以下のコードを追記して保存してください。

保存が完了したら、投稿の編集画面でテキストビューにて以下のコードを追加してプレビューしてみてください。

すると、以下のように表示されると思います。

次に以下のように修正してプレビューしてみてください。

すると、以下のようにoldで指定した値を元に判定処理が行われ表示テキストが変わりました。

さらに以下のように修正してプレビューしてみてください。

同じようにoldで指定した値を元に判定が行われ表示テキストが変わりました。

shortcode_atts($defaultArray, $inputArray, $targetShortCode)という関数は、引数を必要としているショートコードで、引数が指定されなかった場合の初期状態の値で上書きするための記述になります。

以上のように、PHP関数をエディター画面から呼べるようになるので、複雑な処理を簡単に挿入することが可能になります。

ただ、前述したようにfunctions.phpの編集はリスクが高いことなので、やりすぎないように注意しながらショートコードを使いこなすように心がけて使ってみてください。