SWELLで使える！専用ショートコード17選まとめ

2024.03.182026.10.11

SWELLでは実はさまざまなショートコードが用意されています。

例えばカテゴリーページを記事化したときに目次を表示したいときは

[swell_toc]とショートコードを入れるのは有名ですよね。

他にもいろいろあるので紹介いたします。

SWELLで使える専用ショートコード17選まとめ

SWELLで使えるショートコードをまとめてみました。

SWELL 2.19.0の登録名を確認した一覧です。PHPの関数名ではなく、add_shortcodeの第1引数を入力します。日本語の別名は同じ機能として数えています。

詳しい解説の前に、まずは一覧から

ad_tag
ad
swell_toc
spbr
pcbr
icon
review_stars
post_link
blog_parts
speech_balloon
full_wide_content
custom_banner
post_list
only_login
only_logout
html
pr_notation

ad_tag

カスタム広告タグを挿入するために使用されます。id 属性で広告タグのIDを指定します。

[ad_tag id="20268"]

サンプル

アドセンスなどの広告コードを挿入するために使用されます。

[ad]

サンプル

swell_toc

記事の目次を挿入するために使用されます。

[swell_toc]

サンプル

表示例はこのページ上部の目次です。同じページへ目次を重複して挿入する必要はありません。

spbr

スマートフォンでのみ改行

[spbr]

サンプル

あいうえお
かきくけこ

pcbr

PCでのみ改行

[pcbr]

サンプル

あいうえお
かきくけこ

スマホ幅390pxの公開サンプルではspbrだけが改行されます。PC幅1280pxでは逆にpcbrだけが改行されます。画面幅に応じて片方が表示されるため、両方を同じ場所へ重ねる必要はありません。

WAZAのスマホ幅390pxで、spbrは改行され、pcbrは改行されない公開サンプルの実画面 — 2026年10月2日撮影。スマホ幅390pxではspbrのみ改行されます。

icon

SWELLアイコンを挿入するために使用されます。

[icon class="icon-amazon"]
[アイコン class="icon-amazon"]

サンプル

review_stars

レビューの星評価を表示します。公式の例では数値を引用符で囲まず、[review_stars 4.5]と書きます。SWELL v.2.1.9以降は[review_stars 2.5/3]のように最大値も指定できます。

[review_stars 4.5]
[review_stars 2.5/3]

サンプル

post_link

ブログカード形式で投稿や外部リンクを挿入するために使用されます。

[post_link id="24918"]  <!-- 投稿IDが24918のブログカード -->
[post_link url="https://motoki-design.co.jp/"]  <!-- 外部リンクのブログカード -->

サンプル

blog_parts

SWELLの「ブログパーツ」に保存した内容を呼び出します。idにはブログパーツのIDを指定します。WordPressの同期パターンとは別の機能です。ブログパーツから自分自身を呼び出す設定は避けてください。

[blog_parts id="280"]

サンプル

お問い合わせ

Contact

ご質問やご相談など、お気軽にお問い合わせくださいませ。

お問い合わせする

企業サイトを見る

speech_balloon

本文を吹き出しとして表示します。nameは表示名、iconは画像URLです。日本語名を使う場合は、終了タグも「ふきだし」にそろえます。SWELLの「ふきだしセット」を呼び出す場合は、公式が案内している[ふきだし set="セット名"]または[ふきだし id="セットID"]を使います。

[speech_balloon name="motoki" icon="https://motoki-design.co.jp/wordpress/wp-content/uploads/icon_motoki.png"]こんにちは！[/speech_balloon]
[ふきだし name="motoki" icon="https://motoki-design.co.jp/wordpress/wp-content/uploads/icon_motoki.png"]こんにちは！[/ふきだし]

サンプル

motoki

こんにちは！

full_wide_content

フルワイドでコンテンツを表示するために使用します。

背景色はbg、背景画像はbgimgです。

両方を指定すると、SWELL 2.19.0では背景画像が優先され、bgの背景色は出力されません。

内側に書いた別のショートコードも実行されます。

例えば[html]で囲んだstrongタグは太字になり、タグを読者へ見せる表示にはなりません。

コードを説明したいときはコードブロックを使います。

ショートコードブロックに開始・終了タグを含む全体を貼り付け、元へ戻す場合は通常のブロック構成へ戻してください。

背景画像の読み込みや画面幅での見え方は、利用先のPC・スマホで確認します。

[full_wide_content bg="#f0f0f0"]フルワイドのコンテンツ[/full_wide_content]

サンプル

フルワイドのコンテンツ

custom_banner

カスタマイズ可能なバナーを表示するために使用されます。公式の書式はtitle・text・link・img_urlの4つです。画像URLは自分のサイトのメディアのURLへ置き換えてください。

[custom_banner title="MOTOKI合同会社" text="WordPressの制作・カスタマイズ" link="https://motoki-design.co.jp/" img_url="https://motoki-design.co.jp/wp-content/uploads/motoki_logo.png"]

サンプル

MOTOKI合同会社

WordPressの制作・カスタマイズ

post_list

投稿リストを表示します。件数はcount、カテゴリーの絞り込みはcat_idにカテゴリーIDを指定します。下の例はカテゴリーを限定しない最新3件です。categoryやposts_per_pageは、このショートコードの件数・カテゴリー指定には使いません。

[post_list count="3" type="simple"]

サンプル

only_login

ログイン状態にコンテンツの表示を制御するために使用されます。

[only_login]ログインユーザー専用のコンテンツ[/only_login]

サンプル

only_logout

ログインアウト状態にコンテンツの表示を制御するために使用されます。

[only_logout]ログアウトユーザー専用のコンテンツ[/only_logout]

サンプル

ログアウトユーザー専用のコンテンツ

html

囲んだHTMLを解釈して出力します。以下の例はstrongタグの文字列を見せるのではなく、文字を太字にします。コードを読者に見せる用途では、コードブロックを使ってください。

[html]<strong>太字のテキスト</strong>[/html]

サンプル

太字のテキスト

pr_notation

SWELLのPR表記を出力します。表記内容や表示条件はサイト側の設定に依存します。

[pr_notation]

サンプル

当ページのリンクには広告が含まれています。

ログイン状態による表示を実HTTPで確かめる

アクセス条件	確認した表示
ログイン済みのブラウザー	only_loginの案内だけを表示
ログイン情報を持たないHTTPアクセス	only_logoutの案内だけを表示

only_loginとonly_logoutを確認するときは、同じページをログイン済みのブラウザーとログインしていない別のブラウザーで開きます。

WordPressの管理者として操作中の画面だけで判断すると、訪問者向けの表示を確認できません。

隔離したWordPress 7.1.2 / SWELL 2.19.0で同じ固定ページをHTTP経由で開き、ログイン済みではログインした利用者への案内だけが表示されることを確認しました。

ログイン情報を送らないアクセスでは、未ログイン向けの案内だけが返りました。

画面はログイン済みのブラウザーで撮影しています。

自分のサイトでは切り替え対象の文章を短い確認用の文にして、2つの状態で互いの文章が混ざらないことを確認してから本来の文章に戻します。

このショートコードは本文の表示切り替えなので、添付ファイルのURLへのアクセス制御としては扱いません。

WP Rocketなどのページキャッシュを使う場合は、実際の設定でログイン状態ごとの応答を確認してください。

今回の隔離環境にはWP Rocketを入れていないため、その組み合わせは未検証です。

解除するときは対象ブロックのショートコードを外し、中の本文を通常のブロックへ戻します。

ログイン済みの利用者への案内だけが表示された実画面。2026年10月3日、隔離したWordPress 7.1.2 / SWELL 2.19.0で撮影。

Pjax移動後もログイン別の案内を確認する

状態と操作	確認する本文
ログイン中に別ページから移動	only_loginの案内だけが出る
未ログイン状態で別ページから移動	only_logoutの案内だけが出る
実際にログイン・ログアウトした直後	以前の本文が残らないか通常再読込とリンク移動を比較する

編集後はログイン状態ごとに、URLを直接開く操作とサイト内リンクで入る操作を分けて確認します。

2026年10月3日の隔離環境では、ログイン中の実Pjax遷移でonly_loginだけを表示することを確認しました。

未ログイン側は専用の検証URLでWordPressの現在ユーザーを0にして応答を生成し、実Pjaxでonly_logoutだけが表示されることを確認しました。

この未ログイン側の確認はブラウザーで実際にログアウトした試験ではありません。

実サイトではログインとログアウトを行った後にも同じページを開き、以前の表示が残る場合は再読込とキャッシュ設定を確認してください。

ページキャッシュの利用先では、認証状態別の応答を実際のキャッシュ構成で再確認します。

今回の隔離環境にはWP Rocketを入れていないため、その組み合わせは未検証です。

実Pjaxで表示したログイン中の案内 — ログイン中に実Pjaxで移動した案内。匿名状態とページキャッシュの検証写真ではありません。2026年10月3日、隔離したWordPress 7.1.2 / SWELL 2.19.0で撮影。

まとめ

ブロックで使うものが多いので、あまり使わないと思います。

ただ知っておくと便利でなので、覚えておきましょう。

使うときは記事編集画面の「ショートコード」ブロックへ、表示された例を貼り付けます。ID・画像URLは自分のサイトの値へ変更してください。元へ戻す場合は追加したブロックを削除します。ログイン状態による表示切り替えは会員課金やファイル保護の代わりにはなりません。キャッシュのある環境ではログイン・ログアウトの両方を確認してください。

関連記事：SWELLアイコンの使い方、投稿リストブロックの表示件数。この記事のpost_listショートコードと投稿リストブロックでは、設定の入力方法が異なります。