HTMLを登録してショートコードで呼び出せるWordPressプラグイン「Shortcoder」

WordPressでブログを書いていると、何度も使い回す定型文やHTMLが出てきます。CTAや特定のページへのリンクなどです。そこで今回は、そういったパーツを保存して簡単に再利用可能にするプラグイン「Shortcoder」をご紹介いたします。

Shortcoderの機能概要

Shortcoderとは、HTMLやコードの雛形をパーツとして登録しておくことで、エディタ内にショートコードで呼び出せるようになるプラグインです。主な機能は次の通りです。

• HTML、CSS、JavaScriptを登録可能。
• 登録したパーツに管理用の名前を設定可能（例：「商品リンク集」）。
• クラシックエディタ・ブロックエディタの両方に対応。
• ショートコード内にパラメータを付与して、部分編集を可能にできる。

プラグインのインストール

管理画面から「Shortcorder」を検索してインストールするか、下のボタンからもダウンロード可能です。プラグインファイルを wp-content/pluginsディレクトリにアップした後、管理画面から有効化してください。

Shortcoder

プラグインのインストールにつきましてはこちらで詳しく解説しています。

Shortcoderの使い方

プラグインを有効化したら、ダッシュボードの「Shortcorder」より次の画面を開きます。

Pro版（有料版）についての説明が入りますが、無料版でも十分使えるので、今回は下部の「Continue using Shortcoder」を押してください。

ショートコードを作成（登録）する。

では早速、オリジナルのショートコードを作成してみましょう。

上記箇所から「ショートコードを作成」を押してください。

今回は、一例として、次のようなシンプルなCTAを登録してみます。当記事冒頭にもこのCTAをショートコードで設置しています。

編集画面は、次のようになります。

• 英字のみのショートコード名
• 管理用の名前
• テキストやHTML、CSSなど

を登録して、通常の記事と同様に右上の青いボタンから「公開」もしくは「更新」します。他の設定はデフォルトのままで構いません。

ここまででショートコードの作成・登録が完了です。登録できる個数に制限はありません。

ショートコードをエディタに呼び出す。

エディタを開くと「Shortcorder」という項目が追加されていますので、そこから呼び出せます。エディタ別にご紹介いたします。

ブロックエディタ

ブロックエディタの場合は、「Shortcorder」ブロックを追加します。

ブロックを追加すると、登録したショートコードを一覧で確認できます。

「管理用の名前」が一覧表示されるので、任意のものを「挿入」すればOKです。

クラシックエディタ

クラシックエディタの場合は、エディタ内に「Shortcorder」ボタンが追加されているので、そこから追加します。

同じく、登録したショートコードの「管理用の名前」が一覧で表示されます。

いずれのエディタでもキーワード検索できるので、ショートコードを多数登録しても使いやすいです。

ショートコードにパラメータを付与する。

同じ雛形を使っても、テキストやリンク先を変更したいケースがあると思います。そんな時に役立つのがパラメータです。

今回登録したCTAの商品名（テーマ名）を変更できるようにパラメータを付与してみましょう。

テーマ名である「SEEED」の箇所をパラメータに差し替えます。

左上の「ショートコードのパラメータを挿入」>「カスタムパラメータ」から、次の項目を入力します。

最後に「Insert parameter」を押します。

このように表示されればOKです。

「更新」を押して、再度エディタに呼び出してみましょう。

このように「利用可能なパラメータ」として入力欄が表示されます。

ここに別の商品名（テーマ名）を入力してショートコードを挿入すれば、表示されるCTAにも反映されるという仕組みです。

同様に、テキストやURL、ボタンのラベルにもパラメータを付与すれば、同じ雛形を使って別のCTAを作ることができます。

最初にHTMLとCSSで雛形をつくっておけば、文言やURLを変えるだけで、複数のパターンで使いまわせるというわけです。

まとめ

HTMLを登録してショートコードで呼び出せるプラグイン「Shortcorder」をご紹介いたしました。

頻繁に使う記述は、パーツ化してShortcorderに登録しておくと何度も使い回しがききます。パラメータ機能を利用すれば、部分的に編集して再利用する際にも便利です。コンテンツ制作の効率化にぜひ取り入れてみてください。

当プラグインはクラシックエディタ・ブロックエディタの両方で利用できますが、ブロックエディタ専用の「パターン」機能も近い用途で使えます。WordPressの機能なのでプラグインは不要です。ご興味のある方は下記記事をご覧ください。