こんにちは。fsです。
WordPressのブロックエディターの扱いに慣れてくると、作成ブロックの中にあるショートコードの存在に気づきます。
「これって何だろう？」
「何のために使うの？」
僕も初心者のときはこんな疑問を持っていました。
ショートコードとは記事の本文内でPHPのプログラムを動かすことができる機能の一つです。
中級者くらいになってくると、
「記事内でコードを書いて簡単なプログラムを入れたいな」
たまにこのようなニーズが出てきます。
WordPressはPHPでつくられていますが、セキュリティの観点から記事の中ではコードを書くことができない仕様になっています。
そのようなときに使えるのがショートコードという機能です。
というわけで今回は「ショートコードを使い記事内に簡単なプログラムを実装する」作業をシェアしていきたいと思います。
それではご覧ください。
ショートコードを実装
それでは早速、ショートコードを実装していきましょう。
ショートコードの登録
エディター画面でショートコードを使うためには、処置を登録する必要があります。
早速、functions.phpで処理を追加していきます。
今回は、日付を表示させる簡単なプログラムにしました。
<?php
/**
* fs functions and definitions
*
* @link https://developer.wordpress.org/themes/basics/theme-functions/
*
* @package fs
*/
add_shortcode('date', function(){
return date('Y年 n月 j日');
});
一つ目のパラメーターにショートコードの名前、二つ目に実際のショートコードの処理を書いていきます。
※表示させる処理はechoではなく、returnを使いましょう
これで日付を表示させるショートコードが完成です。
表示させる
実際にエディター画面で書いていきましょう。
ショートコードのブロックを挿入し、登録したdateという処理を[]の中に記述します。
※[]はブラケットと言います
投稿を表示させてみると、ちゃんと日付を表示させるプログラムが読み込まれていますね。
このように、ショートコードを使うことで好きなプログラムを本文中に載せることができます。
まとめ ショートコードでより洗練された記事を
いかがだったでしょうか。
ショートコードを上手く活用できれば、他にも
- ページタイトルなどを自動的に表示させる
- 所々に同じデザインのボタンを入れる
- 文字の色を変化させる
などなど、より記事のカスタマイズ性が上がります。
とても便利な機能なので、洗練させた記事を載せたい方はぜひ試してみてください。
今回は以上です。
最後までお読みいただきありがとうございました。
簡単操作！MacBookでWordpressテーマをつくってみる！
コメント