WordPressのショートコードって、活用していますか？
あまり聞きなれない言葉かもしれませんが、どんな事が実現できるか知っておくだけでもブログ運用が楽になります。
・自分のSNSへのリンクを貼る
・アフィリエイト等で外部サイトへのリンクを貼る
などなど、記事に毎回同じような定型文やリンクを書いている方は特にオススメ。
通常はWordPressテーマのfunctions.phpというファイルに記述する事で使えるようになるのですが、コードは苦手・・という方向けに、プラグインで簡単にショートコードが使えるようになる方法もご紹介します。
1. ショートコードって、何？
ショートコードをひと言で表すと、「文章やHTMLコードを登録して簡単に呼び出せる」機能です。
例えばブログ記事を書いている時に「自分の運営しているSNSや外部サイトへのリンク」を挿入したい時、普通なら以下のどちらかでやると思います。
１）リンクにしたい部分を選択して「ビジュアルエディタ」のリンク挿入ボタンから設定
２）HTMLタグで直接書く（<a href=”〜”>〜<a>）
・・これがショートコードだと、例えば以下のように書くだけ。
[tw]
たったこれだけを書けば、WordPress側が自動で、運営Twitterや外部サイトへのリンクに変換してくれます。
（※ こんな感じ）
こうした変換を自由に登録して使えるように出来るが、WordPressのショートコードです。
2008年3月に公開された
WordPressのバージョン2.5から搭載された機能なので、
最近WordPressを始めた方なら、大抵使えるはず。
2. ショートコードを使うメリット
僕もよくブログカスタマイズの依頼を受けた時に「ショートコードでこんな事できますよ」と提案するのですが、例えばこんな時に「ショートコードにしておいて良かった！」と感動（？）してもらえます。
(1) 定型文を登録できる
例えばブログ記事内にいつも書くフレーズがあれば、ショートコードとして登録しておくと簡単に呼び出せます。
メルマガ配信システムなどを利用された事のある方なら、メール内に例えば「%NAME%」と入力しておくと自動で配信相手の名前に変換してくれるような機能を使ったことがあるかもしれませんが、あれに似ています。
さらにショートコードの良い所は、システム側が用意してくれているもの（%NAME% とか）だけでなく、自分で自由に「何を書けば」「何に変換してくれるか」を設定できる点。
前述のように自分のTwitterへのリンクへ自動変換するショートコードを作りたいなら、
[tw]でも[twitter]でも[my-twitter]でも、
自分が覚えやすい名前で定義できます。
(2) 長いHTMLを毎回書く必要が無くなる
ショートコードは、HTMLコードを登録する事もできます。
TwitterやFacebookへのリンクだったり、
Youtube動画の埋込用コードだったり。
こうしたHTMLコードをショートコードとして登録しておく事で、毎回記述する必要が無くなり、作業が軽減できます。
(3) エディタの「リンク」ボタンをクリックする手間が省ける
「自分はビジュアルエディタ使っているからHTMLコードは書かないよ」という方も多いと思いますが、例えば自サイトのTwitterへのリンクを記事内に挿入しようと思ったら、以下のようにするかと思います。
１）記事内に「当サイトのTwitterはこちら」と書き、マウスでその文字を選択して「リンクの挿入ボタン」を押す
２）「URL」に運営TwitterのURLを入力または貼り付ける
３）「リンクを新ウィンドウまたはタブで開く」をチェックする
この手順、意外と面倒じゃないですか？
マウス動かして、クリックして、入力して・・。
これが、ショートコード化していれば、
[tw]
と書くだけでOKになる。これはなかなか、楽ですよね？
(4) 記述間違いを減らせる
人間、間違える生き物です。
例え同じような内容でも、１文字間違えれば動かないのがコードの世界。
毎回手入力でやっていると、リンク用のコードが間違っていて、実はクリックしても動かないリンク文字になっていた・・なんて事も。
ショートコード化しておけば、同じショートコードを書けば同じ変換結果になる事が保証されるので、安心です。
(5) 後からの修正がラクになる
はい。一番重要なのが、コレです。
これを伝えるために僕は、本記事を書いたと言っても過言ではありません。
例えば、ブログ内のすべての記事に「おすすめ商品Aへのリンク」を設定していたが、やっぱり今後はリンク先を商品Bに変更したい・・となった場合。
記事に直接、
「おすすめ商品Aへのリンク」を挿入していたら、
どうなりますか？
リンク先を変えなくちゃいけないので、全記事にあるすべてのリンク先を、商品Aへのリンクから商品Bへのリンクへ１つ１つ修正するハメになります。
・・記事が100も200もあったら、
ちょっと吐きそうですね（苦笑）
でも、もし予めこの商品リンクを、ショートコード [link_osusume] として登録していたら？
[link_osusume] で設定している『変換後の内容』内のリンクを商品Aから商品Bへ変更するだけで、すべての記事のリンク先が変わります。
たった１箇所変えるだけで、すべての記事が修正できちゃうわけです。
僕も最近ブログカスタマイズの依頼をよく受けるのですが、アフィリエイトや自社サービスへの案内などで同じようなリンクを頻繁に記事内で利用する方には、ほぼ必須でショートコードの利用を提案するくらい、後々「使っておいて良かったー！」と思える機能です。
(6) 記事内の好きな場所にパーツを追加できる（プラグインなど）
僕たちがWordPressプラグインを利用する時にも、実はこのショートコード機能の恩恵を受けていたりします。
例えばお問合せフォームが設置できる人気プラグイン「Contact Form 7」では、フォームを作成すると貼り付け用のショートコードが生成されます。
（例）[contact-form-7 id="xxx" title="xxxxxxxx"]
これを固定ページや記事に貼り付ける事で、Contact Form 7 側でこの貼付部分をお問合せフォームのHTMLコードに自動変換してくれます。
これまでプラグインを利用する際はあまり意識していなかったかもしれませんが、[〜] で囲まれたものがあれば、大抵それはショートコードです。
プラグイン側でショートコードを登録してくれているからこんな簡単にできるんだなーと、思ってください。
3. ショートコードの種類
ショートコードには大きく分けて４つの形式があります。
「引数」を設定するかしないか、
「単独で使うか」「（HTMLタグのように）囲んで使うか」の違い。
(1) [xxx]：単独型（引数無し）
単独で利用するタイプです。
変換後の内容が決まっている場合などに利用します。
（例）
・自分のTwitterやFacebookへのリンクを表示する
・毎記事に掲載したい広告リンクを表示する
(2) [xxx aa=””]：単独型（引数あり）
引数（パラメータ）を設定するタイプです。
表示数やIDなど、外部からのパラメータを受け付ける事で、
より柔軟なショートコードになります。
（例）
・関連記事や人気記事を表示する（引数：表示記事数を設定）
・Youtube動画を表示する（引数：YoutubeのIDを設定）
(3) [xxx]〜[/xxx]：囲み型（引数無し）
同じショートコードで囲むタイプです。
（HTMLタグのように、終了の方は先頭に /（スラッシュ）を付けます）
上の引数（パラメータ）でも代用できますが、
囲み内の長い文章を利用したい場合などはコチラの方が扱いやすいです。
（例）
・特殊なデザイン（ふきだし等）で囲まれた文章を表示する（表示したい文章で囲む）
(4) [xxx aa=””]〜[/xxx]：囲み型（引数あり）
(2) と (3) の組み合わせ。
（例）
・特殊なデザイン（ふきだし等）で囲まれた文章を表示する（表示したい文章で囲む、引数でデザインを選べる）
4. ２つの登録方法
さて、では実際にショートコードを利用するには、どうすれば良いでしょう？どこに登録すればよいでしょう？
(1) functions.php に直接記述する（上級者向け）
通常はWordPressテーマファイル内の「functions.php」に記述します。
ただ、テーマファイルは不用意に触ると壊れてしまい、WordPressの管理画面にすら入れなくなってしまう・・という恐ろしい状況になる事もありますので、不安な場合は次の (2) をお試しください。
functions.php に記述する場合は、以下のように書けばOKです。
※ [tw] と書くと、「運営Twitterはコチラ」のリンクに変換されるショートコード
function func_shortcode_tw() {
return '<a href="https://twitter.com/xxxxxx" target="_blank">運営Twitterはコチラ</a>';
}
add_shortcode('tw', 'func_shortcode_tw');
(2) プラグイン「Post Snipets」を利用する（初心者向け）
上記はWordPress独特のコードもあって難しそうだし、functions.phpを自分で触るのは怖い・・という方には、無料のWordPressプラグイン「Post Snippets」をオススメします。
Post Snippets
https://ja.wordpress.org/plugins/post-snippets/
このプラグインを使えば、(1) で書いたようなコードを書かなくても、「ショートコード名」と「変換したい内容」を以下のように設定するだけになるので、変換後のHTMLやPHPさえ書ければ、簡単に設定できるようになります。
[[link_osusume]] と書くと、おすすめ商品へのリンク画像が表示されるショートコードを設定
(3) それぞれのメリット＆デメリット
(1) と (2) の２種類を見てきましたが、
(1) が上級者向けだからといって常に (1) の方が良い・・という分けでもありません。
例えば、複数運用しているブログで同じ自作ショートコードを使いたい・・といった時は、すべてのブログのWordPressテーマ内functions.phpに書き込むよりも、プラグイン「Post Snippets」をインストールして同じ設定にした方が早いかもしれません。
（ちなみに「Post Snippets」にはImport/Export機能があるので、同じ設定を簡単に他のWordPressブログでも再利用できます）
逆に、同じWordPressテーマを使い回すような場合は、functions.phpに書いてしまった方が、毎回設定する必要がないのでラクです。
(1) と (2) のどちらを利用するか、ケースバイケースでお選びください。
5. まとめ
「定型的な文章などを扱いやすくする」機能として、WordPressのショートコードについて解説してきました。
ただ、ショートコードも万能ではありません。
例えば、記事の一番最後に常に表示させたい文章や画像リンクなどがあるなら・・
・WordPressテーマの「記事ページ」にあたるファイル（single.php）に直接記述する
・「記事ページ」の最後をウィジェットエリア化して、「外観」->「ウィジェット」から設定する
など、他にも選択肢があります。
どの場面でどんな機能を使うかは、ブログやWebサイトに何が必要か？どうやって運用していくか？によって変わってきますので、それぞれの機能で何が出来るのかを知った上で、ぜひ効果的に使ってみてください。