WordPressショートコードをPHPで作成・設定方法。意外と便利！

今まで長いことWordpressのテーマをたくさん作ってきましたが、「ショートコード」を作ったことはありませんでした。

今回、ショートコードが適していそうな対応依頼があって、調べてみたところ実装も簡単そうだったので試してみました。使ってみると、思っていたよりも便利な使い方が出来たので、今後のことも考えて書き残しておきます。

スポンサーリンク

ショートコードの作成

//ショートコード作成
function my_shortcode() {
  $ret .= '<div class="shortcode">';
  $ret .= '<p>ショートコード</p>';
  $ret .= '</div>';
  return $ret;
}
add_shortcode('my_code', 'my_shortcode');

上記のように書いて実装は完了です。とても簡単です。

戻り値に設定した値がショートコードと差し替えられますので、戻り値の設定だけ編集していただければ使えると思います。

簡単な説明

では、簡単に説明します。

add_shortcode('my_code', 'my_shortcode');

「add_shortcode」でショートコードを登録します。1つ目の引数（my_code）がショートコードを呼び出すときに使用するコードです。

2つ目の引数（my_shortcode）がショートコードと置き換えるための関数名です。
※1つ目の引数も2つ目の引数もどちらも好きな名前で問題ありません

function my_shortcode() {
  $ret .= '<div class="shortcode">';
  $ret .= '<p>ショートコード</p>';
  $ret .= '</div>';
  return $ret;
}

「my_shortcode」関数の戻り値とショートコードを置き換えます。置き換えたいタグや文字列を戻り値に設定しましょう。

ショートコードの使い方

テキストです。テキストです。テキストです。
[my_code]
テキストです。テキストです。テキストです。

投稿の本文に[my_code]と書けばOKです。「ビジュアル」でも「テキスト」でも[my_code]で問題ありません。

登録も使用もとても簡単です。

便利なショートコード（SNSのシェアなど便利）

// ショートコード：シェアボタン
function sns_shortcode() {
  $url = get_the_permalink(); // ページURL取得
  $title = get_the_title(); // ページタイトル取得
  $ret .= '<div class="sns">';
  $ret .= '<p class="sns-title">この記事をシェアする</p>';
  $ret .= '<div class="sns-list">';
  $ret .= '<a href="https://www.facebook.com/sharer/sharer.php?u='.$url.'" target="_blank">Facebookでシェアする</a>';
  $ret .= '<a href="https://twitter.com/intent/tweet?text='.$title.'&url='.$url.'" target="_blank">twitterでシェアする</a>';
  $ret .= '<a href="https://social-plugins.line.me/lineit/share?url='.$url.'" target="_blank">LINEでシェアする</a>';
  $ret .= '</div></div>';
  return $ret;
}
add_shortcode('sns', 'sns_shortcode');

上のようにページURLやページタイトルを取得して使用したいときにたいへん便利です。

他の関数も使えます

例えば、get_the_content()で本文を取得出来たり、その他にも様々な情報を取得できます。
他にも色々な種類のショートコードが作れそうですね。

簡単に説明

上のショートコードを使うと、Facebook、twitter、LINEで表示ページをシェアするボタンが表示してくれます。

シェアボタンのリンクにはページURLやタイトルが必要になります。ですが、ショートコードでページURLやタイトルを取得し設定しておくと、どのページにも利用できるようになります。

また、投稿者は細かいことは気にせず、シェアボタンを入れたいところにショートコードを入れるだけOKです。お客さん自身が投稿する場合には、とても便利な機能だと思います。

まとめ

・ショートカットの実装・使用（下記）ともに簡単

//ショートコード作成
function my_shortcode() {
  $ret .= '<div class="shortcode">';
  $ret .= '<p>ショートコード</p>';
  $ret .= '</div>';
  return $ret;
}
add_shortcode('my_code', 'my_shortcode');
テキストです。テキストです。テキストです。
[my_code]
テキストです。テキストです。テキストです。

・ショートコードでget_the_permalink、get_the_titleなど色々な値を取得して利用できる
・投稿者に特定の知識がなくても簡単に使える

今後「ショートコード」という選択肢が広がりました。お世話になる機会が増えそうです。

スポンサーリンク