WordPress

ワードプレスのショートコードとは?使い方とおすすめのプラグインを紹介!

ワードプレスのショートコードとは?使い方とおすすめのプラグインを紹介!

ワードプレスでは、ショートコードを使うことで、ブログを装飾したり、youtubeやtwitterなどの投稿を埋め込みすることができるようになります。

ショートコードのプラグインを使えば、予め用意されているショートコードを使って、ボタンやアイコンなどを追加することや、独自のショートコードを安全に作成して登録することができます。

こちらでは、ショートコードの使い方や作成方法、おすすめプラグインについて解説したいと思います!

ワードプレスのショートコードとは?

ワードプレスのショートコードとは?

ワードプレスのショートコードとは、あらかじめ定義された関数を呼び出すことで、複雑なプログラミングスキルがなくても、高度な動的コンテンツを簡単に追加できるようにしてくれる機能です。

ショートコードを端的に言い表すとすれば「ショートカット」が当てはまります。

ショートコードは、プログラミングの知識があれば、自分で自由に作成することもできます。

プログラミングにおける関数とは、「あるデータを受け取り、定められた独自の処理を実行して、その結果を返す命令」です。

関数を予め定義しておくことで、同じ処理に対して、同じ命令文を繰り返し記述する必要がなくなります。

ショートコードを使うメリット

ワードプレスでショートコードを使うメリットには、次のようなものがあります。

  • 繰り返し使う定型文やレイアウトなどを簡単に呼び出しできる
  • 複雑で高度な処理を短い記述で呼び出せる
  • 初心者でもショートコードを知っていれば使える

ショートコードの一番の利点は、記述の簡略化です

ショートコードの中では、複雑な処理が行われていても、それらは実際には「function.php」に記述されています。

記事中では、短いショートコードの呼び出し文だけを記述すればいいようになっています。

また、ショートコードは、自分でも作成できますが、予め作成されたものを使えば、プログラミングを知らない初心者でも、高度な処理を実行することができます!

ショートコードを使うデメリット

ショートコードを使うデメリットには、次のようなものがあります。

function.phpを編集する必要があるため、エラーを起こすとサイトが表示されなくなったり、レイアウトが崩れる可能性がある

ワードプレスとphpの知識がある程度必要なので、初心者にとってはハードルが高い

ショートコードを使う上で、一番のデメリットは、function.phpを編集する際の記述ミスなどによるエラーです。

function.phpは、ワードプレスのテーマの根幹とも言えるもので、ここで記述ミスがあると、サイト全体がうまく表示されなくなる可能性があります。

そのため、変更を加える場合は、必ずバックアップを取っておく必要があります。

また、function.phpに関数を追記したり、作成した関数を呼び出すためには、ある程度の知識が必要です。

この点において、ワードプレス初心者にとって、ショートコードの利用は少し難易度が高いと言えるのです。

ワードプレスでショートコードを作成するには

ワードプレスでショートコードを作成するには

ワードプレスでショートコードを作成するには、function.phpに関数を定義して追加する必要があります。

  • function.phpを開く
  • 任意の場所に関数を作成する
  • 作成した関数を定義する

手順①function.phpを開く

ワードプレスのfunction.phpの編集

function.phpは、ワードプレスの左メニュにある外観→テーマファイルエディターの順で開くことができます。

function.phpに変更を加える際は、必ずバックアップを取っておきましょう!

手順②任意の場所に関数を作成する

関数の記述場所には、特に決まりはありません

あとで、自分がわかりやすいように、一番下に追加するのが一般的です。

定義する関数の例として、定型文を出力する関数を作成してみます。

function regTxt() {
return “ショートコードを使って表示しています!”;
}

こちらの関数を呼び出すことで、「ショートコードを使って表示しています!」という定型文を出力することができます。

手順③作成した関数を定義する

作成した関数をショートコードを使って呼び出せるようにするためには、さらにもうワンアクション必要です

それが「定義」です。

まずは、具体例を見ていきます。

add_shortcode(‘txt’, ‘regTxt’)

上記のように記述することで、ワードプレスに新しい関数「regTxt」を定義することができました。

つまりadd_shortcodeとは、ワードプレスに新しい関数を定義(保存)する役割を持った関数(命令)なのです。

また、関数の作成では、別の関数やワードプレスのテンプレートタグを呼び出すこともできます。

ですが、自己参照は無限ループに陥ってしまう(処理が永遠に終わらないこと)ため、注意が必要です。

function regTxt() {
return “ショートコードを使って表示しています!”;
regTxt();
}

上記のように記述すると、ひたすら同じ定型文を表示させるような無限ループに入ってしまいます。

ワードプレスでショートコードを簡単に作成できるプラグインのおすすめ!

ワードプレスでは、プラグインを使うことで、ショートコードの作成を簡略化したり、あらかじめ用意されている便利なショートコードを使用することができます。

おすすめのプラグインは次の3つです。

  • Shortcodes Ultimate
  • Arconix Shortcodes
  • Snippy

Shortcodes Ultimate

Shortcodes Ultimate

Shortcodes Ultimateは、記事の装飾に特化したショートコードが用意されているプラグインです。

豊富なデザインパーツを駆使して、記事を装飾することができるようになります。

①「ショートコード」ブロックを選択して追加する

②一覧から使用したいショートコードを選ぶ

たとえば、「スポイラー」のショートコードを選ぶと下記のように、クリックすることで展開するボックスが作成できます。

[su_accordion][su_spoiler title=”ショートコードとは” open=”no” style=”default” icon=”plus” anchor=”” anchor_in_url=”no” class=””]ボックスやボタン、アイコンなどのデザイン要素を短いコード(ショートコード)で簡単に使えるようになるショートカットのようなもの[/su_spoiler]

他にも、ワードプレスの装飾に関するショートコードが豊富にあるので、気になったものを試してみるといいですよ!

Arconix Shortcodes

Arconix Shortcodes

Arconix Shortcodesは、ボタンなどを簡単に作成できるようになるプラグインです。

インストールして有効化するだけで、すぐに使えるようになります。

インストールして有効かすると、下記のようなショートコードの一覧が、投稿画面の右サイドメニューに追加されます。

こちらから、使いたいコードをコピーして、編集画面に貼り付けることで、ショートコードが使えるようになります。

試しに、トグルというショートコードを使用すると以下のようになります。

トグルのサンプル

Snippy

Snippy

Snippyは、function.phpを直接編集することなく、独自のショートコードを作成することができます。

function.phpは、前述したとおり、非常に重要なファイルです。

Snippyを使うことで、ショートコードの記述ミスなどによる、ブログ全体のレイアウト崩れや、表示に関する不具合を未然に防ぐことができます。

使い方は、プラグインをインストールして有効化するだけです。

あとは、プラグインのショートコード設定画面で、独自のショートコードを作成して保存するだけです!

よく使うyoutube動画や、Googleマップなどの埋め込みコードを作成する際にも便利です!

ワードプレスのショートコードとは?使い方とおすすめのプラグインを紹介!のまとめ

ワードプレスのショートコードは、簡単に言うと、ボタンやアイコン、GoogleMapなどを簡単に表示させるための「ショートカット」のようなものです。

ワードプレスでショートコードを使うメリットには次のようなものがあります。

  • 繰り返し使う定型文やレイアウトなどを簡単に呼び出しできる
  • 複雑で高度な処理を短い記述で呼び出せる
  • 初心者でもショートコードを知っていれば使える

ショートコードは、自分でオリジナルを作成することもできます!

その際、直接function.phpを編集するのではなく、プラグインを使うと安心です。

おすすめのプラグインは、次の3つです。

  • Shortcodes Ultimate
  • Arconix Shortcodes
  • Snippy

有料テーマには、ショートコードと同じように便利な機能が予め搭載されていることがありますが、それ以外の無料テーマを使っている場合は、とても役に立ちます!

「ショートコード」で検索すると、便利なテンプレートがたくさんあるので、ぜひ色々調べてみてください^^b

最後までご覧いただき、ありがとうございました!

ワードプレスの初期設定や使い方について詳しくはこちらをご覧ください!

▶︎▶︎ワードプレスの初期設定と使い方を初心者向けに解説!