【SWELL】ブログ記事でショートコードをそのまま表示する方法

ショートコードを書くと、アップした記事ではプログラムが実行されるのでショートコードは表示されません。

たとえば、アイコンのショートコードを書くと（当たり前ですが）アイコンが表示されます。

[アイコン icon-phone]と書くと　→　が表示される

ショートコードを文字として載せたい。

ネットで調べたやり方を試しても、上手くいかなかった。

そんな方に向けて、今回はWordPressテーマ【SWELL】でショートコードをそのまま表示する方法を紹介します。

方法①コードブロックを使う

ショートコードを文字として記事に載せるには、WordPressブロックエディタの「コード」ブロックを使います。

コードブロックを選ぶと出てくる「枠」の中に、ショートコードを書きましょう。

コードブロックを使うと

[アイコン icon-swell]　←ショートコードのまま表示

　普通に「段落」ブロックに書くと

　←アイコンで表示される

方法②大かっこ[ ]で囲む

段落ブロック内でも、ショートコードを半角の大かっこ[ ]で囲むだけで、そのまま文字として表示できます。

前後を[ ]で囲む

[[アイコン icon-swell]] とすると　→ [アイコン icon-swell]と表示できる

上手くいかないときは「キャッシュ」を削除

プレビュー画面や記事アップ後にショートコードが表示できていない場合、「キャッシュ」が邪魔をしている可能性があります。

上手くいかないときはブラウザの「キャッシュ」削除を試してみましょう。

「キャッシュ」とは、Webページの表示速度を上げるために自分のPCやスマホに自動で保存されるデータのこと。

一度開いたページのデータは、一時的にPCに保存されます。そして同じページを開いたときはデータを再読み込みをせずPCに保存されたデータを使うことで、表示速度が早くなるようになっています。

キャッシュのおかげで快適にWebサイトを閲覧できる反面、前に保存したデータを使うため更新がすぐに反映されないことがあります。

キャッシュの削除方法は「Chrome」「Microsoft Edge」「safari」など使っているブラウザ（Webサイトを閲覧するソフト）によって異なります。

まとめ：ショートコードを載せるのは簡単！

今回は、WordPressテーマ【SWELL】で、記事にショートコードを文字として載せる方法を紹介しました。

知ってしまえば、めっちゃくちゃ簡単ですね。

この記事がお役に立ったら嬉しいです。