実は便利！ショートコードを自作してみよう #WordPress
Posted by admin at 18:50 日時 2010/11/12
WordPressはブログシステムなので、HTMLのことが全く分かっていなくても、Wordなどの文書作成ソフトが使える方であれば簡単にコンテンツを更新することができます。これは、WordPressの管理画面で入力した文章や画像を自動でHTMLに変換してくれる仕組みが備わっているからです。しかし、HTMLが分かる人にとってはこの自動変換がちょっとじゃまだなーと思うことがあります。
例えば記事の中にテキストや画像以外のものを埋め込みたい時。投稿編集画面をビジュアル表示からHTML表示に切り替えて、コピーしてきた埋め込みコードをペーストして保存。YouTubeの動画だと問題ないのですが、<iframe>タグを使用している場合は消去されてしまいます。これはiframeタグの使用が許可されていないからなので、WordPressのソースを書き換えて許可してしまうことも一応できるのですが…、詳しくない方にはおすすめできません。そこで、ショートコードを使うという手があります。
ショートコードとは、投稿やページの中の特定の文字列を、表示の際に別のソースに変換して表示する仕組みです。実例を見せましょう。投稿編集画面で「[my_shortcode]」のように書いて保存すると、同じ部分が実際の表示では「ショートコードテスト」と変換されるようなことが可能です。
このショートコードを追加するには、少しのPHPをテーマ内のfunctions.phpに追加するだけです。上で紹介した例の場合は…
add_shortcode("my_shortcode", "my_shortcode_func"); function my_shortcode_func($atts, $content){ $html = "ショートコードテスト"; return $html; } この5行をfunctions.phpに追加して保存するだけです。追加するのは念のため、ファイルの末尾がいいですね（途中だと他の処理をさまたげるおそれがあります）。
1行めの’my_shortcode’の部分が、追加したショートコードの名称です。半角英数字で書きます。このショートコード名称を各カッコ（ [ ] ）で囲めば、ショートコードの出来上がりです。
3行めの’ショートコードテスト’の部分を変更することで、通常埋め込むことが不可能なHTMLでも投稿やページの中で表示することができるようになります。例として、Googleドキュメントで作成できるフォームを埋め込むショートコードを書いてみました。
add_shortcode("googleform", "googleform_func"); function googleform_func($atts, $content){ $html = "<iframe src='http://spreadsheets.google.com/a/notnil-creative.com/embeddedform?formkey=dHRydW5ibERRNlVuTVZSa2xkd1V3aVE6MQ' width='600' height='554' frameborder='0' marginheight='0' marginwidth='0'>読み込み中...</iframe>"; return $html; } 埋め込みコードをそのままコピペしただけです。ページ内に[googleform]と書くと、このように表示されます。
本来表示できないiframeタグですが、問題なく表示できました！
ショートコードは、属性値の指定ができるようにしたり、管理画面の設定と連動したり、複雑なソースを出力するように拡張していくことができます。特定のパターンの投稿を繰り返す方などは、うまく使えばかなり楽ができるかもしれませんよ！
詳しくは、WordPress Codexを参照してください。
