投稿日：
2018年5月9日
最終更新日：
【使いこなすと最強】WordPressでショートコードを作って効率化をしてみた
YouTubeも見てね♪
[ノースフェイス] THE NORTH FACE メンズ アウター マウンテンライトジャケット
防水暴風で耐久性抜群なので旅行で大活躍です！
レッドブル エナジードリンク 250ml×24本
翼を授けよう！
モンスターエナジー 355ml×24本 [エナジードリンク]
脳を活性化させるにはこれ！
Bauhutte ( バウヒュッテ ) 昇降式 L字デスク ブラック BHD-670H-BK
メインデスクの横に置くのにぴったりなおしゃれな可動式ラック！
BANDAI SPIRITS ULTIMAGEAR 遊戯王 千年パズル 1/1スケール
もう一人の僕を呼び覚ませ！！
MOFT X 【新型 ミニマム版】 iPhone対応 スマホスタンド
Amazon一番人気のスマホスタンド！カード類も収納出来てかさ張らないのでオススメです！
サンディスク microSD 128GB
スマホからSwitchまで使える大容量MicroSDカード！
目次
WordPressのショートコード機能
What’s?
WordPressには、標準機能として搭載されているショートコード機能というものがあります。
これは、あらかじめfunctions.phpに登録しておいたPHP関数を、記事投稿画面から呼び出して利用することが出来る機能です。
この機能を使うことで、計算や文字列整形を自分でやらずにPHP関数を利用した動的処理を簡単に実行することが出来ます。
クイックタグとはどう違う？
WordPressには、よく使う文章をボタン一つで簡単に挿入するための機能としてクイックタグというものがあることは以前ご紹介致しました。
しかし、クイックタグはあらかじめ登録している文字列をそのまま貼り付ける機能となるので、動的処理をした結果を挿入したい！という用途では利用することが出来ません。
あくまで静的な挿入に限られます。
この機能はとても便利
前述の通り、この機能を使うこなすことで複雑なHTML構造を簡単かつ動的に挿入したり数字の計算を行うことが出来るので、記事の作成スピードが格段に上がります！
また、ショートコードの作り方もとても簡単です。
今回はショートコードの作り方をまとめてみましたのでご紹介致します。
手順
スポンサーリンク
336×280
前提
ショートコードは使用しているテーマのfunctions.phpを編集することになります。
このファイルが壊れてしまうとWordPressの管理画面が表示されなくなってしまうので必ずバックアップを取った上で作業を行うようにしてください。
また、作業は自己責任でお願い致します。
独立型ショートコード
まずは、単純にテキストを挿入するだけのショートコードを作ってみましょう。
functions.phpに以下のコードを追記して保存をしてください。
|
1
2
3
4
|
function helloWorldShotCode() {
return "Hello, World!!";
}
add_shortcode('helloWorld', 'helloWorldShotCode');
|
保存が完了したら、投稿の編集画面のテキストビューにて以下のコードを追加してプレビューしてみてください。
|
1 |
[helloWorld]
|
すると、以下のようにテキストが表示されたと思います。
これは、Wordpressのadd_shortcode( $tag , $func )という関数を利用しています。
$tagにはテキストエディターで呼び出す際の文字列を指定し、$funcにはfunctions.phpで定義したPHP関数名を指定します。
そして、テキストエディターから[$tag]という形で呼び出すことが可能になっています。
引数型ショートコード
次に、テキストエディターから呼び出す際に値を受け取ってそれを利用して処理を行うショートコードを作ってみましょう。
functions.phpに以下のコードを追記して保存してください。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
function oldCheckShortCode( $atts ) {
$atts = shortcode_atts(
array(
'old' => NULL,
), $atts, 'oldCheck' );
if (is_null($atts['old'] )){
echo 'oldを指定してください。';
}elseif($atts['old'] < 20 ){
return '未成年です。';
}else{
return '成年です。';
}
}
add_shortcode( 'oldCheck', 'oldCheckShortCode' );
|
保存が完了したら、投稿の編集画面でテキストビューにて以下のコードを追加してプレビューしてみてください。
|
1 |
[oldCheck]
|
すると、以下のように表示されると思います。
次に以下のように修正してプレビューしてみてください。
|
1 |
[oldCheck old=18]
|
すると、以下のようにoldで指定した値を元に判定処理が行われ表示テキストが変わりました。
さらに以下のように修正してプレビューしてみてください。
|
1 |
[oldCheck old=20]
|
同じようにoldで指定した値を元に判定が行われ表示テキストが変わりました。
shortcode_atts($defaultArray, $inputArray, $targetShortCode)という関数は、引数を必要としているショートコードで、引数が指定されなかった場合の初期状態の値で上書きするための記述になります。
終わりに
以上のように、PHP関数をエディター画面から呼べるようになるので、複雑な処理を簡単に挿入することが可能になります。
ただ、前述したようにfunctions.phpの編集はリスクが高いことなので、やりすぎないように注意しながらショートコードを使いこなすように心がけて使ってみてください。