【WordPress】簡単！ショートコードで作業効率のアップ！
こんにちは、kokaです。今回はWordPressのショートコードについてです。ショートコード使ってますか？ ショートコードを使っていない方のためにショートコードについての簡単な説明やメリット・デメリット、いくつかの使えるショートコードをご紹介します。ショートコードで記事の更新を効率化しましょう！
ショートコードとは？
そもそもショートコードとはなんでしょうか。ショートコードとはWordPressの機能の一つです。
ショートコードを簡単に説明すれば事前に登録したプログラムコードを、記事投稿時に短いコード（ショートコード）で呼び出し、それを実行するものです。
プログラムコードは、テーマフォルダの中のfunctions.phpに記述します。
簡単なHTMLのタグやCSSから複雑なphpやJSなどのプログラムまで色々なものを呼び出すことができます。
ショートコードの記述の仕方
ショートコードはビジュアルエディッタ、テキストエディッタどちらでも同じように利用できます。ショートコードには囲み型と自己完結型の二つのタイプがあり、一般的に[******]という形式と、[******]コンテンツ[/******]で記述します。＊の部分は自分で好きな名前をつけることができますが、プログラムですので日本語は使用できません。
それでは具体的に各ショートコードの書き方の例をご紹介していきます。
自己完結型ショートコードの例１
まずは自己完結型ショートコードの具体例をお見せします。よくある例ですが “おはよう！”という挨拶を表示するショートコードを作ってみましょう。
まずは関数を設定して、ショートコード名を「[ohayou]」とします。
プログラムのコードとしてはこんな感じです。↓
function PrintOhayou(){
return "おはよう！";
}
add_shortcode("ohayou", "PrintOhayou");これをfunctions.phpに記述して、記事の投稿画面でショートコードを入力すると、
[ohayou]
プレビュー画面や実際の記事では
と表示されます。
今回の例では短いテキストですが、長めの定型文などをショートコードとして登録しておけば入力の手間が省けます(^^)
自己完結型ショートコードの例2（引数）
さらに自己完結型ショートコードでは、データを受渡して、それを反映することもできます。
先程の例を少し変えてみましょう。
function PrintOhayou($attr){
return "{$attr[0]}さん、おはよう！";
}
add_shortcode("ohayou", "PrintOhayou");上記の例では引数を渡すように変更し、受け取った変数を出力に追加しました。
投稿画面での記述方法は、ショーコード名の後ろに半角の空白を空けて、プログラムに渡したい値を入力します。
[ohayou 山田]
こんな感じです。
これを入力するとプレビュー画面や実際の記事では
というように出力されることになります。
もちろん『山田』の部分は『鈴木』でも『１』でも何でもかまいません。
これは説明用の簡単な例ですから、あまり意味のないものですが、引数を渡すことでより複雑なプログラムを組めるようになります。たとえば、苗字によって挨拶を敬語にしたりもしくは英語にしたりなんてことも可能です(^^)
ちなみに、「Contact Form 7」のようなプラグインもこの自己完結型ショートコードを利用して作られています。
囲み型ショートコードの例
続きましては囲み型のショートコードの具体例をお見せします。
function PrintWakusen( $atts, $content = null ) {
return '<p style="border:1px solid #666666;padding:10px;">' . $content . '</p>';
}
add_shortcode('wakusen', 'PrintWakusen');囲み型ショートコードの場合はHTMLの閉じタグのようなコードでテキストを囲みます。入力例としては下記のような形です。
[wakusen]ショートコードのテスト。この部分が枠線に囲まれます。[/wakusen]
HTMLのタグのようにテキストを囲む形です。
これがプレビューや実際の記事では下記のように出力されます。
出力されるHTML
実際の表示
ショートコードのテスト。この部分が枠線に囲まれます。
囲み型のショートコードでも、引数を渡すことで複雑な処理が可能になります。
WordPressのメディアのキャプションもこの形を利用しているように、数多くの公式プラグインでも使われています。
ここまでが簡単なショートコードに関する説明です。
ショートコードを使うメリット・デメリット
続いては、そんなショートコードのメリット・デメリットについてご紹介していきましょう。
ショートコードを使うメリット
まずはショートコードを使うメリットからです。ショートコードを上手く使うと入力作業を単純化することができます。
長々とした定形文はもちろん、tableタグやstyleをあてたタグのように入力が面倒くさい部分を、ショートコードと引数だけで簡単に入力できるようになります。
例（通常）：
<table> <tr><th>背番号</th><th>名前</th><th>打率</th><th>打点</th><th>本塁打</th></tr> <tr><th>9</th><td>柳田</td><td>.341</td><td>15</td><td>5</td></tr> <tr><th>5</th><td>松田</td><td>.294</td><td>19</td><td>7</td></tr> <tr><th>10</th><td>李大浩</td><td>.281</td><td>21</td><td>9</td></tr> ...
例（ショートコード）：
<table> [player 背番号 名前 打率 打点 本塁打] [player 9 柳田 .341 15 5] [player 5 松田 .294 19 7] [player 10 李大浩 .281 21 9]
いかがですか？ これくらい変わってくるとかなり作業時間は変わってくるはずです。
また、phpで組んだ複雑なプログラムを簡単に呼び出せますし、いちいち更新しないといけないようなものも自動的に更新させたりすることができます。
例えば、自分の年齢を現在の時間から自動的に計算するようなショートコードを作っておけば、プロフィールページを誕生日のたびに書き換えるという面倒を避ける事ができます。
例：
年齢：[age 2000/01/01]歳
他にも、消費税を自動的に計算するようなショートコードを作っておけば、価格を入れるだけで税込みの金額が表示されるようなプログラムも可能です。
例：
少年ジャンプ価格：[zeikomi 236]円
そして、なによりも一番のメリットが一箇所の変更でショートコードの使用箇所全てが変更できるということです。
先ほどの例の消費税のショートコードの場合、消費税が上がったらfunctions.phpのプログラムの税率の箇所を修正するだけで、すべてのページの税込価格が新しい金額に変更できるのです！
他にも、広告のスクリプトをショートコードに登録して記事に記述しておけば、後に広告を差し替えたいと思った場合も、functions.phpの修正のみですべての広告の差し替えが完了するのでとても便利です。
さて、ここまではショートコードのメリットをご紹介してきましたが、続いてはショートコードを使う場合のデメリットについてもご紹介しておきます。
ショートコードを使うデメリット
ショートコードのデメリットとしては、いくつか注意点があるのでそれをご紹介します。
プログラムミスに注意
ショートコードはfunctions.phpを変更する必要があるので、プログラムにミスがあるとホームページが真っ白になって表示されない場合があります。（よくあるミスとしては、日本語の空白が混じっているなど）
ですからショートコードを設定する場合は、絶対にバックアップをとってから作業をしてください。
サイトが表示されない場合は、すみやかにバックアップと差し替えましょう。
テーマのアップデートにも注意
また、テーマをアップデートするときも注意が必要です。
テーマをアップデートするとfunctions.phpがデフォルトに書き換えられるので、せっかく登録しておいたショートコードが全て消えてしまうということが起こりえます。
テーマの更新をする前に、functions.phpのショートコードの部分は別に保存しておくようにしましょう。
functions.phpファイルの肥大化に注意
ありがちなことですが、無尽蔵にショートコードを追加していき、さらにいくつものサイトで使いまわしていると、どのコードが必要なものか分からなくなってしまいます。その結果ファイルが無駄に肥大化してしまい、場合によってはページの遅延につながることもあります。
functions.phpにショートコードを追加する際は、必要なものを見極めてから追加していくようにしましょう。また不要になったらすみやかに削除しましょう。（PCの中にライブラリとしてコードを保存しておくとよいでしょう）
以上が、ショートコードのデメリットというか注意点でした。
ただ、今回紹介した注意点は初心者用のプラグイン『Shortcoder』でカバーすることができます。
というわけで、続いてはショートコードと相性抜群のプラグインをご紹介していきます。
ショートコードと相性抜群のプラグイン
簡易ショートコード入力の『Shortcoder』
まず最初にご紹介するのは先ほども名前を上げた『Shortcoder』です。
『Shortcoder』はFTPを使う必要がなく、またfunctions.phpを変更することなくショートコードを作成・管理することができるプラグインです。
簡易的な自己完結型ショートコードしか作れませんが、デメリットのところで紹介した注意点をまったく気にせず、オリジナルのショートコードを作ることができます。しかも、作ったショートコードはエディット画面にボタンとして表示されるので挿入も簡単です。
ショートコード初心者はまずは、このプラグインで慣れてみるのがよいでしょう。ぜひ、広告やAdsenseなどをショートコードとして登録してショートコードを体験してみてください(^O^)/
ショートコードの最高の相棒！『AddQuicktag』
続いて紹介するのはショートコードと相性抜群のプラグイン、ご存知『AddQuicktag』です。
この『AddQuicktag』があれば、自作したショートコードをボタンとして定義することで、投稿画面ではボタンひとつでコードを呼び出すことができるようになります。
つまり入力の手間すら必要なくなるのです！
私も[adsense]や[gotop]といったショートコードをボタン化してガンガン使ってます。
ショートコードを使う際には必須のプラグインです。必ずインストールしましょう(^^)
記事の一括変換が加速！『Serch Regex』
全ての記事の一括置換ができる『Search Regex』もショートコードと相性がいいプラグインです。このプラグインがあれば複数記事で使っているショートコードを一括で差し替えや削除することができます。
この『Search Regex』については、過去記事で詳しく説明していますので、気になった方はご覧ください。
参照：初心者向け。過去記事の一括置換に大活躍！『Search Regex』の使い方。
以上の３つがショートコードと相性がいいプラグインになります。
次は私の自作のショートコードをご紹介しましょう。
もちろんコピペで使用することができますよ。
管理人が作ったショートコード
それでは、先ほど紹介した年齢の自動更新、税込価格の２つをご紹介します。
年齢を自動更新するショートコード
このショートコードは生年月日を入力することで自動的に現在の年齢を表示してくれるショートコードです。もちろん、固定ページでも使用することができます。
まずは以下のコードをfunctions.phpにコピーしてください。
//現在の年齢を返すショートコード
function get_age($attr){
$birth = preg_replace("/\//","",$attr[0]);
$age = floor((date('Ymd',time()) - $birth) / 10000);
return $age;
}
add_shortcode('age', 'get_age');入力の方法は最初にショートコード名『age』を入力し、半角空白を空けて生年月日を半角で入力します。
西暦４桁と月日は『/』で区切って入力してください。
入力例：
[age 2000/01/01]歳
上記の例ですと、出力時は『15歳』と表示されます。
税込価格を計算するショートコード
このショートコードは入力した価格に現在の消費税率8%を盛り込んだ税込価格を計算してくれるショートコードです。もちろん、固定ページでも使用することができます。
まずは以下のコードをfunctions.phpにコピーしてください。
//税込価格を返すショートコード
function get_plice($attr){
$plice = floor($attr[0]*1.08);
return $plice;
}
add_shortcode('plice', 'get_plice');入力の方法は最初にショートコード名『plice』を入力し、半角空白を空けて価格を半角で入力するだけです。
入力例：
254円
上記の例ですと、出力時は『254円』と表示されます。もし、消費税が上がって10％になった場合は、『1.08』の部分を『1.1』に変更するだけで修正は完了です。
以上のように簡単なショートコードをご紹介してみましたが、いかがでしたか？
もし使えそうであればどうぞご利用ください(^^)
この他にもネット上では、いくつもショートコードは公開されています。
『wordpress ショートコード ◯○○』といった感じで検索してみると、意外と見つかるものです。場合によっては、プラグインよりも高性能なものもありますので、ちょっと気になる場合はぜひ検索してみてください。
次はショートコードを使い始めた方が必ずぶつかる壁の一つ、ショートコードをテンプレートで使用する方法をご紹介します。
ショートコードをテンプレートで使う方法
ショートコードは基本的には投稿ページか固定ページでしか使えませんが、以下の方法でテンプレートでも使用することができます。
テンプレートの表示したい場所に下記のように入力してください。
<?php echo do_shortcode('[ショートコードの文字列]'); ?>これだけです。
先ほど紹介した年齢を取得するショートコードをテンプレートで使いたいと思ったら、表示したい箇所に
<?php echo do_shortcode('[age 2000/01/01]'); ?>このように入力すれば良いわけです。簡単ですね(^^)
この方法を使えば記事とテンプレートに同じ広告を、ショートコードで埋め込むなんてことができるわけです。
ショートコードのプラグイン化
じつはショートコードは簡単にプラグインにすることができます。
プラグイン化するとテーマのアップデートの影響を受けなくなりますし、違うテーマでも使えるようになるのでとても便利です。
ショートコードのプラグイン化については過去の記事で詳しく説明していますので、興味があればご覧ください。
参照：【WordPress】意外と簡単！自作プラグインの覚書
最後に
プログラムが分からないから、大変そうだからと敬遠されている方も多いショートコードですが、使いこなすと本当に便利なものです。
作業効率のアップをはかるためにも、まずは相性のいいプラグインでも紹介した『Shortcoder』で広告の管理だけでもやってみてください。きっとショートコードの可能性に必ず気づいていただけると思います。
ずいぶん長くなってしまいましたが、この記事を読んでもらってショートコードを使いたいと思っていただける方が一人でも増えれば幸いです。
以上、『【WordPress】簡単！ショートコードで作業効率のアップ！』でした。
それでは、次の記事で！
投稿者プロフィール
