WordPress WooCommerceショートコード：知っておくと便利なショートコード一覧

WooCommerceのショートコードは、プラットフォームの最も多機能な機能の一つです。エンドユーザーによりダイナミックな体験を提供することができます。あなたのショップにショートカットを追加することで、訪問者は可能な限りシームレスな体験をすることができます。そして、それは常に最終的な目標です：あなたの訪問者のために物事を容易にする。

ウェブサイトを運営する人なら誰もが抱く不安のひとつが、レイアウトの観点から見て、自社のオファーが陳腐に見えてしまうことだろう。オンラインストアを運営している場合、売上悪化に直結しかねないので、なおさら心配です。しかし、素晴らしいデザインの他に、ショートカットを追加することもWooCommerceストアのスパイスとなる方法です。

WooCommerceショートコードとは？

これは、ページ上の任意の場所に配置できる小さなコードのスニペットで、視覚的に魅力的なショートカットを提供します。ユーザーがより簡単にアクセスできるようになります：

• 行動への呼びかけ
• ストア内のページ（ショッピングカートや注文追跡セクションなど）
• 販売したい具体的な商品

WooCommerceショートコードを追加する

この言葉は専門的に聞こえますが、WooCommerceのショートコードの良いところは、簡単に追加できることです。コーディングの知識も必要ありません。Gutenbergのおかげで、ショートコードを "ショートコード "ブロックやページビルダーに挿入（つまり、コピー＋ペースト）するだけです。

1つのページに異なるショートコードを挿入したり、複数のショートコードを近接させることができる。

必須プラグイン

WooCommerceには独自のショートコードが付属していますが、さらに多くのショートコードにアクセスするのに役立つプラグインがいくつかあります。WooCommerceの管理ダッシュボードに行き、右側にPlugin > Add Newがあります。そこで以下のプラグインを追加できます。

• WooCommerce Quick View Pro。これをWordPressサイトにインストールすると、フロントエンドのレイアウトに新しいクイックビューボタンが自動的に表示されます。これにより、訪問者は現在のページを離れることなく、属性やバリエーションなどの詳細にアクセスしたり、商品をカートに追加したりすることができます。
• WooCommerce Product Table。このプラグインは[product_table]ショートコードを使用することができ、WooCommerceのデフォルトのグリッド以外のレイアウトを使用するのに役立ちます。ページごとに多くの商品を表示したい場合に最適です。
• WooThemesのWooCommerce Shortcodes。このプラグインをインストールして有効化すると、テキストエディタにTinyMCEのドロップダウンボタンが追加され、すべての組み込みショートコードに簡単にアクセスできるようになります。ショートコードを使うたびにコピー＆ペーストする必要がなくなるので、時間の節約になります。

以下では、最も便利なショートコードをページ、商品表示、アクションの3つのカテゴリーに分けてご紹介します。

1.ページへのショートコード

現在ナビゲートしているページを離れることなく、必要なページにアクセスできるようにして、顧客の利便性を高めましょう。

• マイアカウント。WooCommerceマイアカウントをショートコードを通してサイト上の任意の場所に追加します。
• カートショートコードを使って、WordPressのページ、投稿、ウィジェット、サイドバーに顧客のパーソナライズされたショッピングカートを表示しましょう。
• チェックアウト。チェックアウトページは、ショートコードを使って好きな場所（商品テーブルの下など）に挿入してください。
• 注文追跡。注文追跡機能はWooCommerceに付属していませんが、新しいページを作成し、テキストエディタ上でショートカットを追加することで、自分で追加することができます。また、他の場所に追加することもできます。

以下はショートコードの例です：

2.製品展示

以下のWooCommerceショートコードを使って、様々な基準で商品をショーケースしましょう：

カテゴリー。商品カテゴリ（アイテムではありません）をサイト上の任意の場所に表示します。

3.行動

顧客が現在のページを離れることなく、簡単にアクションに参加できるようにする：

• カートに入れる。好きな場所に特定の商品のボタンを挿入します。商品の正しいコードを追加することを忘れないでください。
• 商品検索。ページや投稿など、サイト上の好きな場所に、ショートコードを使ってライブフィルタ機能を備えたライブ検索を追加しましょう。

トラブルシューティング

On occasion, you'll find that you've pasted WooCommerce shortcodes correctly into the text editor, but it doesn't look right on the front-end. When this happens, head to the HTML text editor and make sure you didn't accidentally embed with <pre> tags.

結論として

ブライトベッセルでは、20年近くにわたりWooCommerceを中心としたWordPressデザインを専門としてきました。お客様のブランドにとって最適なeコマースソリューションの構築は、私たちにお任せください。お客様のビジネスのニーズに合わせた完璧なWooCommerceストアを作るお手伝いをさせていただきますので、お気軽にお問い合わせください。