WooCommerceショートコードとは何ですか
公開: 2021-10-04WooCommerceのショートコードは、特定のユーザーにはなじみがない場合があります。 WooCommerceストアをお持ちの場合でも、これはこれまでに見たことのない機能である可能性があり、サイトの周りに商品の参照を振りかけたり、召喚状のボタンを購入したりするのにどれほど有益であるかを知りません。
この記事は、 WooCommerceShortcodesの完全なガイドになります。
WooCommerceショートコード
WooCommerceのショートコードを使用すると、ショップのデータを斬新で魅力的な方法で表示できます。 WooCommerceにはショートコードがプリロードされており、プラグインをインストールすることでさらに追加できます。
WooCommerceショートコードは、サイトのどこでも使用できる小さなコードスニペットで、 WooCommerce製品や「今すぐ購入」ボタンなどの召喚状を表示できます。 これらには多数のアプリケーションがあり、 ShoptimizerWooCommerceテーマ内にいくつかの優れた例を含めることを意図していました。 もちろん、WooCommerceを提供するすべてのテーマと互換性がある必要があります。
WooCommerceショートコードを使用する必要がある理由
ショートコードは、WooCommerceストアをパーソナライズする簡単な方法です。 ショートコードを貼り付けることで、任意のeコマースサイトを構築できます。
どの商品を表示するか、どのように配置するか、各ページにいくつ表示するかを制御します。 投稿の結論など、戦略的な場所に[カートに追加]ボタンを含めることもできます。
WooCommerceショートコードの動作
シンプルに見えますが、ショートコードは非常に強力です。 ショートコードのさまざまなコンポーネントを見ていきましょう。

ショートコード
WooCommerce Shortcodeは、次のように、アンダースコアでリンクされた単一の単語または単語のグループです。
- [製品]
- [woocommerce_order_tracking]
一部のショートコードはパラメーターなしで使用できますが、一部はパラメーターなしで使用できます。 ショートコードのWooCommerceパラメーターを見てみましょう。
パラメーター
パラメータまたは引数は、ショートコードの操作をより正確にする余分な行です。 すべてではありませんが、ほとんどのWooCommerceショートコードはパラメーターを使用します。
WooCommerceショートコードのリスト
最も重要なWooCommerceショートコードのいくつかを見てみましょう。

[woocommerce_cart]
WooCommerceカート機能は、このショートコードを使用してページに追加されます。 つまり、顧客が買い物かごに入れたすべての商品が表示されます。 このショートコードにはパラメータがありません。
[woocommerce_checkout]
このショートコードは、チェックアウトページを表示します。 これは組織の重要な要素であるため、ページが正しく設定されていることを確認してください。 結局のところ、消費者がチェックアウトを見つけることができない場合、彼らは何も購入しません。
[woocommercecart]のようにチェックアウトページに追加の設定はありません。
[woocommerce_my_account]
これには、[マイアカウント]ページが表示されます。このページには、顧客のすべての情報とビジネスからの以前の注文が含まれています。 デフォルトで表示される注文数は15に設定されています。数を-1に変更すると、すべての注文を強制的に表示できます。
[woocommerce_order_tracking]
このショートコードは「注文追跡」ページを生成し、消費者が注文の現在のステータスを表示できるようにします。 これ以上の制約はありません。
[製品]
次のリストは、WooCommerceで最も強力で一般的に使用されているショートコードの1つである[製品]ショートコードです。 ご想像のとおり、アイテムが表示されます。 ただし、提供されるアイテムのタイプと量を変更するために使用できるいくつかの要因があります。
パラメータを追加するには、引用符で囲まれた名前を入力し、その後に等号と目的の値を入力します。 これが[products]ショートコード内にあることを確認してください。
WooCommerceショートコードを使用してレイアウトをカスタマイズする

いくつかの設定により、製品ページのレイアウトを変更できます。
1.列
このオプションは、列の数を指定します。 デフォルトでは4に設定されていますが、モバイルでは通常、より少ない数に折りたたまれます。
例: [products columns =” 3”]
2.注文
これは、 orderby設定に基づいて、順序を昇順(ASC)にするか降順(DESC)にするかを制御します。 デフォルトではASCに設定されています。
Fまたは例: [products order =” ASC”]
3.注文者
このパラメーターは、商品の配置方法をカスタマイズするための多くの選択肢を提供します。 デフォルトでは、製品のタイトルで並べ替えられます。
1つのスペースで区切ることにより、複数のオプションを含めることができます。
- 日付:これは、発行日に基づいて商品を配置します(新しいものが最初)
- id:このオプションは、投稿IDに基づいて商品を注文します
- メニュー順:メニュー順で商品を注文します(番号が小さい方が先)
- 人気:商品は購入数に基づいて注文されます(最初から)
- rand:商品をランダムな順序で表示します。 キャッシュプラグインを利用するサイトでは問題が発生する可能性があります。
- 評価:これは、最高から最低まで、平均評価に従って商品を並べ替えます。
例: [products orderby =” date”]
4.クラス
これにより、要素にHTMLラッパークラスが追加され、CSSでスタイルを設定できるようになります。
例:[products class =” custom-element”]
ショートコードのトラブルシューティングについて学ぶ
ショートコードが機能しないことを妨げる最も一般的な問題のいくつかを調べてみましょう。
ショートコードは<pre>タグの間にあります
Webサイトにショートコードを追加するときは、コードを(実行するのではなく)表示するための<pre>タグ内にないことを確認してください。
引用符はまっすぐではなく湾曲しています
もう1つの典型的なエラーは、引用符(パラメーターで使用)がまっすぐではなく、角度が付いている、つまり「カーリー」である場合です。 中引用符はパラメーターでは機能しません。
まとめる
以上です。WordPressマルウェア除去の簡単な手順についてすべてを学んだことを願っています。また、WordPressマルウェア除去の簡単な手順に関する記事を書くように依頼された訪問者のために。 これに関する専用の記事があります。
私たちの議論を繰り返してみると、ここにいくつかの重要なポイントがあります:
- WooCommerceショートコード
- WooCommerceショートコードを使用する必要がある理由
- WooCommerceショートコードの動作
- WooCommerceショートコードのリスト
- WooCommerceショートコードを使用してレイアウトをカスタマイズする
- ショートコードのトラブルシューティングについて学ぶ
この投稿を楽しんだら、 YouTubeチャンネルでWordPressビデオチュートリアルを購読してください。 Pinterestでフォローすることを忘れないでください。
あらゆる種類の訪問者の提案を受け入れます。それらは継続的に改善への動機付けとなります。 以下にコメントしてください。