WordPressを便利に運用できるようにするのがショートコード。ショートコードを使えば、HTMLやPHPコードを含めた定型文を固定ページや投稿の本文中で呼び出すことができます。
ショートコードの基本的な使い方は上記記事で解説しましたが、もっと発展的な使い方をすることもできます。
- ショートコードで出力される定型文に、WordPressで利用できる変数を含める。
- ショートコードで出力される定型文の一部を、記事ごとに自由に入力できるようにする（引数を利用する）。
こう書いてもあまりイメージが湧かない方もいるはずなので、事項で具体的な例を挙げていきます。
またこのカスタマイズでは子テーマの利用が必須です。functions.phpを編集するカスタマイズを行う場合は、必ず子テーマを利用しましょう！
ショートコードで変数や引数を使うと何ができるか？
WordPressで利用できる変数をショートコードを登録すると、記事ごとに異なる部分を自動でショートコードの定型文に入れ込むことができます。例えば、
この記事のタイトルは「〇〇」です。
と出力されるショートコードを作り、〇〇の部分にその記事のタイトルが自動で入るようなショートコードを作ることができるのです。
この記事のタイトルは「ショートコードに変数や引数を組み込み、もっと便利に使う方法」です。
このような変数を使えば、「この記事をツイートする」リンクをショートコードとして登録して、記事ごとに好きな場所に入れ込むこともできます。
また、引数を使えるショートコードでは、例えば以下のように、〇〇や××の部分を毎回自由に記述できる定型文を登録することができます。
ショートコードの一部が「〇〇」および「××」に置換されます。
ショートコードに、〇〇をmaruに、××をbatsuに対応するような引数を設定すれば、[shortcode maru=あいうえお batsu=かきくけこ]のように書くことができます。上記のショートコードは、固定ページや投稿に記述すると、以下のように出力されます。
ショートコードの一部が「あいうえお」および「かきくけこ」に置換されます。
変数を使えるショートコードの登録方法
変数を使うには、ショートコードの定型文の途中でPHPコードを入れ込みます。
function add_shortcode00(){
date_default_timezone_set('Asia/Tokyo'); // この行は時刻を出力しない場合は削除してOK
ob_start(); ?>
この記事のタイトルは「<?php echo get_the_title(); ?>」です。<br>
この記事のIDは「<?php echo get_the_ID(); ?>」です。<br>
この記事のURLは「<?php echo get_permalink(); ?>」です。<br>
現在の時刻（このページを開いた時刻）は「<?php echo date("Y年m月d日 H時i分"); ?>」です。
<?php return ob_get_clean();
}
add_shortcode("shortcode00", "add_shortcode00");定型文の途中に、<?php ... ?>と書かれたPHPコードが入っていますね。この部分が、見ているページや現在時刻などによって変化する部分です。このコードで登録したショートコード[[shortcode00]]を実際に出力すると、以下のようになります。
この記事のタイトルは「ショートコードに変数や引数を組み込み、もっと便利に使う方法」です。
この記事のIDは「271」です。
この記事のURLは「https://wp.gt-gt.org/tips/use-shortcode-more/」です。
現在の時刻（このページを開いた時刻）は「2024年04月19日 14時10分」です。
「現在の時刻」のところから、PHPを使って動的に出力されているのが分かるかと思います。このように、PHPコードを使えばいろいろな情報をショートコードに入れ込むことができます。
よく使いそうな変数を以下にまとめておきます。
| 出力するもの | コード |
|---|---|
| 記事タイトル | <?php echo get_the_title(); ?> |
| 記事ID | <?php echo get_the_ID(); ?> |
| 記事URL | <?php echo get_permalink(); ?> |
| 記事を書いた日 | <?php echo get_the_date(); ?> |
引数を使えるショートコードの登録方法
functions.phpに、以下のように記述します。
function add_shortcode01($atts){
extract(shortcode_atts(array(
'maru' => '〇〇',
'batsu' => '××',
),$atts));
ob_start(); ?>
ショートコードの一部が「<?php echo $maru; ?>」および「<?php echo $batsu; ?>」に置換されます。
<?php return ob_get_clean();
}
add_shortcode("shortcode01", "add_shortcode01");通常のショートコード登録と同じように、コード中に3か所出てくるshortcode01の部分を全て同じ記述に変更すると、ショートコードの登録名を変更できます。
4行目および5行目が引数の設定にあたります。=>で表現されている矢印の左側が引数の名前、右側が引数を設定しなかった場合に表示されるデフォルトの値です。
ob_start(); ?>から<?php return ob_get_clean();までの部分が実際に出力される定型文ですが、その途中に<?php echo $maru; ?>とPHPコードが挟み込まれています。変数を使う場合と同様、このPHPコードが引数を出力する部分になるというわけです。
また、'maru' => '〇〇',の部分の行数を増やしたり減らしたりすれば、利用する引数の数を増やしたり減らしたりすることもできます。
上記のショートコードをそのまま利用した場合、[shortcode01]と引数を設定せずに打ち込むと以下のように出力されます。
ショートコードの一部が「〇〇」および「××」に置換されます。
設定しなかった引数がちゃんとデフォルトの値で反映されていますね。では、引数を[shortcode01 maru=あいうえお batsu=かきくけこ]のように設定すると、以下のようになります。
ショートコードの一部が「あいうえお」および「かきくけこ」に置換されます。
ショートコードを活用してもっと機能的なサイトに！
ショートコードを上手く使えば、もっとサイトを便利に運用できます。ぜひ挑戦してみてください！
