WordPress

WordPressのShortCode(ショートコード)を使いこなす

記事内に商品プロモーションを含む場合があります

WordPressの投稿画面や固定ページなどに直接PHPのコードを書きたいことってありますよね。テンプレートファイルだったら素直にPHPのコードが記述できますが、投稿画面となるとそうは行きません。

投稿画面に直接PHPを記述できるプラグイン「Exec-PHP」というものがありますが、セキュリティ的にも芳しくありません。そこでShortcode(ショートコード)の出番です! あらかじめ決められた手続きをショートコードとしてfunctions.phpに記述しておき、投稿画面や固定ページから呼び出しましょう。

ショートコードの3つの書き方

さて、それではショートコードの具体的な書き方を紹介します。
ショートコードって何って?って思っていらっしゃる方が多いかと思いますが、実は身近なところでショートコードって使われているんですよ。それが、超有名プラグインである「Contact form 7」でお問い合わせフォームを表示するときに使われているコードです。

[contact-form-7 id="1" title="コンタクトフォーム 1"]

Contact form 7を使うとこんなコードを書く場面がでてきますよね。これがショートコードなんです。functions.phpに自分で好きな処理を書くことで、ショートコードを自由自在に使いこなすことができますよ。

ショートコードの書き方は大きく3つに分けられます。

・1つ目 「 [test] 」と普通にショートコードのみを書く方法
・2つ目 「 [test num=’100′] 」 とパラメータを渡して書く方法
・3つ目 「 [test]ここに文字列[/test] 」 とショートコードで文字を囲んで書く方法

以上3つが代表的なショートコードの書き方です。

「 [test] 」と普通にショートコードのみを書く方法

まず最初に一番シンプルな1つ目の書き方を紹介します。

まず、functions.phpに↓のように関数を書きます。

function shortcode_test() {
    return "ショートコードです";
}
add_shortcode('test',shortcode_test);

shortcode_test()と関数を定義し、add_shortcode関数で自作したショートコードを登録します。これだけでショートコードが使えるようになります。今回の例では [test] というショートコードを定義しました。

[test] と投稿画面や固定ページに書くと「ショートコードです」と表示されます。

「 [test num=’100′] 」 とパラメータを渡して書く方法

それでは2つ目のショートコードにパラメータを渡して書く方法を紹介します。

functions.phpに以下のように書きます。

function shortcode_count($atts) {
    $atts = shortcode_atts(array(
        'num' => 5,
        ),$atts);    
    extract($atts);
    return "あなたは" . $num ."番目の訪問者です。";
}
add_shortcode('count','shortcode_count');

最初の例とは異なり、関数に引数として$attsを渡してあります。その関数に対して「shortcode_atts」と「extract」という2つの関数で何やら処理を行っています。これはショートコードの引数として設定した文字列をショートコード内の変数として扱えるようにしている箇所です。今回の例では1つの引数をショートコード内の変数 $num という変数で扱えるようにしています。

shortcode_atts関数の中にある
'num' => 5,
の箇所は引数のデフォルトの数値を設定しています。

[[count num="1000"]]と投稿画面や固定ページに書くと「あなたは1000番目の訪問者です。」と表示されます。

「 [test]ここに文字列[/test] 」 とショートコードで文字を囲んで書く方法

さて3つ目のショートコードを文字列で囲む書き方です。

function shortcode_quote( $atts, $content = null ) {
    return 'ここから【' . $content . '】ここまでが引用';
}
add_shortcode('quote', 'shortcode_quote');

ショートコードを定義する関数の第2引数「$content」を追加しました。この$contentにショートコードで囲まれた文字列が渡されます。

[quote]引用の中身です。[/quote]と投稿画面や固定ページに書くと「ここから【引用の中身です。】ここまでが引用」と表示されます。

以上がショートコードの書き方の紹介でした。

ちなみに自作したショートコードをテンプレートファイルから実行したい場合は、do_shortcode関数を使うとできます。

<?php echo do_shortcode('[test]'); $gt;

このように書くことで[test]のショートコードを実行できます。

ついでにこの記事を書くときにわかったのですが、ショートコードを実行するのではなく、ショートコードのコードそのものを記事の中に書きたい場合は「[」や「]」を続けて書くと書けるようになります。

[[test]]

こんな具合です。

===

コレカラウェブではWebライティングのお仕事を承っております。豊富な実務経験や国家資格を生かして、SEOに強い完全オリジナルな文章を作成いたします。公式noteにてポートフォリオを掲載していますので、こちらも併せてご覧ください。ご相談・ご依頼はお問い合わせページからお願いいたします!

「いいね!」と思ったら、クリックお願いいたします<m(__)m>
にほんブログ村 小遣いブログ Webライター・ブログライターへ にほんブログ村 IT技術ブログ SEO・SEMへ にほんブログ村 小遣いブログ ブログアフィリエイトへ
ABOUT ME
らぐち
コレカラブログ管理人のらぐちです。コレカラウェブという屋号でフリーランスとして、Webライティング・SEOコンサルティング・メディア運営・障害者支援のお仕事を一貫して承ってきました。このブログではコレカラウェブのお仕事で得たノウハウやテクニックを詳しく紹介しています。

COMMENT

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA