長い間、関連商品はWooCommerceに任せていました。いくつかのアップセルやクロスセルを設定して、次に進みました。しかし、顧客が本当に探しているものと一致しない提案の場合、特に顧客が他の商品を探さずに去ってしまうことが多いことに気づき始めました。
関連商品を表示するさまざまな方法をテストし始めました。ページの上の方に移動させたり、カートに入れたり、SeedProdを使って実際に意味のあるレイアウトをデザインしたりしました。このような小さな変化が、より多くのクリックと多くの注文につながったのです。
このガイドでは、内蔵ツールとドラッグ＆ドロップのビジュアルビルダーを使用して、WooCommerceの関連商品を表示する方法を紹介します。
クイックまとめ：WooCommerceで関連商品を表示する方法
- WooCommerceでリンクされた商品を設定する
デフォルトの商品エディタを使用して、個々のアイテムにアップセルとクロスセルを追加します。 - プラグインを使わずに関連商品を表示する
WooCommerceに商品のカテゴリーとタグに基づいて自動的に提案を表示させましょう。 - SeedProdで関連商品レイアウトをカスタマイズ
ドラッグアンドドロップビルダーを使用して、ストア全体の関連商品を表示する場所や方法をコントロールできます。 - カートやチェックアウトページにおすすめ商品を追加
SeedProdブロックを使って、チェックアウト直前の購入を促します。 - 単品ページにアップセルオファーを表示
WooCommerceのデフォルトを、よりすっきりとした、コンバージョン率の高いレイアウトに変更。
| 特徴 | デフォルトのWooCommerce | シードプロッドビルダー |
|---|---|---|
| セットアップの難易度 | 中程度（製品ごと） | 簡単（ドラッグ＆ドロップ） |
| デザイン・コントロール | 限定 | 完全なビジュアル・コントロール |
| プレースメント・オプション | 製品ページのみ | 商品、カート、どこでも |
| カスタムレイアウト | 非対応 | フルカスタマイズ可能 |
| アップセルとクロスセル | はい | はい |
| モバイルプレビュー | いいえ | はい |
| プラグインは必要か？ | いいえ | はい（SeedProd） |
それでは、WooCommerceで関連商品を表示する方法を見てみましょう。
WooCommerceで関連商品を設定する方法（プラグイン不要）
WooCommerceのテーマを変更したり、関連商品プラグインをサイトに追加したくない場合、ストアオーナーはデフォルトのWooCommerce設定を使用して関連商品を表示することができます。
この方法では、カスタマイズのオプションは多くないが、アップセルやクロスセルを簡単に行うことができ、店舗販売の平均注文金額を増やすことができる。
ステップ1.WooCommerceエディタでリンク商品を追加する
まず、WordPressの管理画面からProducts " All Productsに移動し、WooCommerceの商品を編集します。商品オプションの中で、商品データセクションまでスクロールダウンし、リンクされた商品タブを見つけます。
ステップ2.商品ごとにアップセルとクロスセルを選ぶ
リンク商品セクションには2つの異なるオプションがあります：アップセルとクロスセルです。
覚えておいてほしいのは、アップセルとは、元の商品と似ているが、価格が高い商品のことである。クロスセルとは、買い物客がメイン商品に加えて買いたいと思うような類似商品のことである。
使用したいフィールドに商品名を入力し、正しい項目が表示されたらクリックします。
ステップ3.商品ページで関連商品をプレビューする
WooCommerce商品にクロスセルまたはアップセルを追加した後、ページを上にスクロールし、「変更をプレビュー」ボタンをクリックします。
現在の商品説明の下に関連商品が表示されます。
SeedProdでWooCommerceの関連商品をカスタマイズする方法
それでは、SeedProdでカスタム関連商品レコメンドを表示する方法を見てみましょう。
SeedProdは、WordPressのための最高のドラッグアンドドロップウェブサイトとページビルダーの一つです。それはあなたのWordPressサイトの任意の部分を視覚的に、コードなしで作成し、カスタマイズすることができます。
SeedProdを使ってWooCommerceストアをカスタマイズすることもできます。完全なWooCommerceウェブサイトテンプレートと強力なWordPressブロックにより、開発者を雇うことなく、オンラインストアを特定のデザインニーズに合わせることができます。
例えば、カスタム商品カテゴリーページの作成、商品特徴説明の設定、さらにはストアのナビゲーションにメニューカートを追加することもできます。
この方法は、現在のWooCommerceテーマをカスタムデザインに置き換えます。
コード、ショートコード、子テーマ、アドオン、推奨製品プラグインは必要ありません。functions.phpファイルを編集する必要もありません。その代わり、面倒な作業は一切なく、視覚的にすべてをカスタマイズすることができます。
そこで、SeedProdのテーマビルダーを使ってWooCommerceに新しいおすすめ商品を簡単に追加するには、以下の手順に従ってください。
ステップ1.WooCommerceサポートでSeedProdをインストールして有効化する
この方法を始めるには、SeedProdのエリートバージョンを入手する必要があります。
WooCommerceをフルサポートし、カスタマイズ、クロスセル、アップセルのために必要なすべてのブロックとセクションが付属しています。
プランを選択し、アカウントを作成した後、SeedProdアカウントのダウンロードタブに移動し、プラグインをダウンロードしてください。
その間に、製品のライセンスキーをコピーしてください。
あなたのWordPressウェブサイトに行き、SeedProd .zipファイルをあなたのストアにアップロードしてください。この作業で助けが必要な場合は、WordPressプラグインのインストールと有効化に関する指示に従ってください。
プラグインがアクティブになったら、SeedProd " Settingsに移動し、先ほどコピーしたライセンスキーを使用可能なフィールドに貼り付けます。
Verify Keyボタンをクリックすると、WooCommerceサイトのカスタマイズを開始できます。
ステップ2.SeedProdでWooCommerceテンプレートキットを選ぶ
次に、WordPressのダッシュボードからSeedProd " Theme Builderに アクセスしてください。ここでWooCommerceテーマのあらゆる部分をカスタマイズすることができますが、まずはテンプレートを選択する必要があります。
テンプレートを選択するには、「テーマ」ボタンをクリックします。
また、WooCommerceフィルターを選択して、WooCommerceテンプレートキットだけを表示することもできます。
気に入ったキットが見つかったら、そのキットにカーソルを合わせてチェックマークアイコンをクリックします。
SeedProdは、商品ページ、ショッピングカート、チェックアウト、商品アーカイブ、ショップページを含むキット全体をWordPressサイトにインポートします。Theme Builderのダッシュボードでこれらのテンプレートパーツをすべて見ることができます。
また、SeedProdは自動的にテンプレートのデモからabout、contact、serviceページのようなコンテンツページを作成します。これらのページはWordPressのデフォルトのページメニューで見つけることができ、SeedProdのドラッグアンドドロップビルダーで編集することができます。
テンプレートをインストールしたら、関連商品の追加を始めましょう。まずはカートページに関連商品を表示させてみましょう。
カートページを編集するには、テーマビルダーのダッシュボードにいることを確認し、カートテンプレートを見つけてカーソルを合わせ、デザインの編集リンクをクリックします。
ショッピングカートのページがSeedProdのビジュアルエディタで開きます。
ステップ3.カートページのレイアウトに関連商品を追加する
カートページを開くと、左側にWordPressのブロックとセクション、右側にライブプレビューが配置された2カラムレイアウトになっていることがわかります。
プレビューのどこかをクリックすると、数回クリックするだけでそのブロックの設定やスタイリングオプションをカスタマイズできます。例えば、カートブロックの設定では、タイポグラフィ、ボタンスタイル、フィールドカラーなどを変更できます。
SeedProdを使えば、カートページに関連商品を追加するのはとても簡単です。
左サイドバーのWooCommerce Template Tags見出しまでスクロールし、Products Relatedブロックを見つけます。そのブロックをクリックして、ページプレビューの所定の位置にドラッグします。
ブロックの設定では、列を調整したり、関連商品の数を変更したりすることができます。また、ドロップダウンメニューでオプションを選択することで、特定の商品を注文することもできます：
- 日付
- プロダクトID
- メニューオーダー
- 人気
- ランダム
- 評価
- タイトル
詳細設定タブでは、関連商品ブロックのスタイリングを調整することができます。例えば、タイポグラフィ、色、ボタン、画像の影などを変更することができます。
すべての見た目に満足したら、画面右上の「保存」ボタンをクリックします。
それでは、SeedProdを使ってWooCommerceで商品をアップセルする方法を見てみましょう。
ステップ4.単品ページにアップセルキャンペーンを表示する
WooCommerce商品をアップセルしたい場合、SeedProdのアップセルブロックを使用することができます。しかし、その前に、方法1の手順に従って、WooCommerceの商品設定で商品をリンクする必要があります。
SeedProdのアップセルブロックは、単一の商品ページテンプレートでのみ機能しますので、テーマビルダーのダッシュボードに戻り、商品ページテンプレートを編集する必要があります。
私たちが使っているテンプレートには、すでにおすすめ商品が掲載されています。そこで、ゴミ箱アイコンをクリックして関連商品を削除してみましょう。
次に、WooCommerce Template TagsセクションでUpsellブロックを見つけ、ページにドラッグします。
このブロックのライブプレビューは表示されませんが、関連商品ブロックのようにカスタマイズすることができます。
WooCommerceサイトのカスタマイズは、お好みの外観になるまで続けてください。保存ボタンをクリックして定期的に変更を保存することを忘れないでください。
ステップ5.テーマを公開し、ライブにする
あなたのウェブサイトに変更を反映させる準備ができたら、テーマ・ビルダー・ページに行き、SeedProdテーマを有効にするトグルを見つけてください。これを「Yes」にすると、変更が公開されます。
個々の商品ページやカートページをプレビューして、類似のおすすめ商品を確認できるようになりました。
以下はカートページの例である：
そして、これが商品ページにあるアップセルの例である：
関連商品を非表示にしたい場合は、新しいセクションをページから削除するだけです。
そうだ！
WooCommerceの関連商品についてよくある質問
WooCommerceで関連商品を表示することは、単にページのスペースを埋めることではありません。買い物客が欲しいものをより多く見つけられるようにするシンプルな方法であり、その過程で静かに収益を上げることができます。
デフォルトの設定に満足しているのであれば、WooCommerceが必要なものを提供してくれます。しかし、どのように見えるか、どこに表示されるかをもっとコントロールしたいのであれば、SeedProdを使えば、コードを一行も書かずにすべてを簡単にカスタマイズすることができます。
他のWooCommerceチュートリアルやヒントもお勧めです：
- あなたのストアに最適なWooCommerceプラグイン
- WooCommerceでカスタムカートに追加ボタンを追加する方法
- WooCommerceサンキューページの作り方（簡単）
- WooCommerceの追加情報タブをカスタマイズする方法
- WooCommerceにカートを見るボタンを追加する方法
- WooCommerceでショップページのタイトルを変更する方法
- WooCommerceで美しい商品画像ギャラリーを作成する方法
- WooCommerceの商品ページに星評価を追加する方法
- WooCommerceで商品説明を取得して表示する方法
- WooCommerceで注目の商品を表示する方法
- WooCommerceで在庫切れの商品を非表示にする方法
お読みいただきありがとうございました！あなたのご意見をぜひお聞かせください。YouTube、X、Facebookで、あなたのビジネスを成長させるために役立つアドバイスやコンテンツを提供していますので、お気軽に会話にご参加ください。
