ElementorでWooCommerceのレビューを表示する方法 [完全ガイド]
ホーム ブログ ElementorでWooCommerceのレビューを表示する方法

ElementorでWooCommerceのレビューを表示する方法

ElementorでWooCommerceのレビューを表示する方法

WooCommerceのレビューは、あなたが持つ最も強力な販売ツールの一つです。

これまで、中小企業の経営者が店に全力を注ぎ込んでいるのを見てきましたが、そのレビューは、ほとんどの訪問者がスクロールすることのない個々の商品ページに埋もれてしまっています。

ビジネス用に美しいElementorサイトを作成したとしても、レビューは依然として商品ページに限定されたままです。

つまり、非常に多くの有用なソーシャルプルーフが、活用されるのをただ待っている状態にあるということです。

そこで、さまざまな方法を試した結果、このステップバイステップガイドを作成しました。ここでは、Elementorサイト上でWooCommerceのレビューを表示する最も簡単な方法をご紹介します。

簡単に言うと

ガイドを全部読む時間がない? 知っておくべきポイントは次の通りです。

  • 簡単な方法:Smash Balloonの「Reviews Feed Pro」インストールします。WooCommerceストアを連携させます。フィードをカスタマイズします。その後、ショートコードをElementorの任意のページに貼り付けます。これで完了です。ホームページ、ランディングページ、サイドバーなど、お好きな場所に表示できます。
  • 手動での方法:ElementorにはWooCommerceレビューウィジェットが組み込まれています。ただし、これはElementor ProのWooCommerce単一商品テンプレート内でのみ機能します。通常のページでは動作しません。

話を進める前に、2つだけ簡単に答えておきます:

  • 無料版のElementorでも動作しますか?はい。プラグイン方式であれば、無料版でも動作します。
  • プログラミングの知識は必要ですか?いいえ、一行も必要ありません。

WooCommerceのレビューがElementorに表示されない理由

WooCommerceのレビューは、サイト内を自由に移動するように設計されていません。

その代わり、レビューはサイト全体ではなく、個々の商品に紐付けられています。WooCommerceには、そのレビューが属する商品ページ以外で表示する標準的な機能はありません。

WooCommerce用のElementorレビューウィジェットを使用する場合、大きな制限があります。

WooCommerceのカスタマーレビューウィジェットの例

これを機能させるには、Elementor ProのWooCommerce単品商品テンプレートを使用する必要がありますが、多くのユーザーにとっては柔軟性に欠けるものです。

制限事項がわかったところで、Elementorサイト上でレビューを表示する方法をご紹介します。以下では、この方法に加え、もっと簡単な代替案もご紹介します。

方法 1:手動での方法(Elementor の組み込みウィジェット)

Elementorには、WooCommerceレビューウィジェットが標準で搭載されています。その具体的な仕組みと、どのような制限があるかについて、詳しくご説明しましょう。

まず用意するもの:

  • Elementor Pro(無料版ではありません)
  • 商品が登録済みの既存のWooCommerceストア
Elementor ページビルダープラグイン

使い方は以下の通りです:

  1. WordPressのダッシュボードにアクセスし、「Elementor」「テーマビルダー」を開きます。
  2. 新規追加」をクリックし、テンプレートタイプとして「単品」を選択します。
  3. Elementorエディタでテンプレートを開きます。
  4. 左側のウィジェットパネルで、「商品レビュー」を検索してください。
  5. ウィジェットをテンプレートのレイアウトにドラッグしてください。
  6. そのテンプレートを適用したい製品に割り当ててください。
  7. 保存して公開する

このウィジェットは、テンプレートを割り当てた商品ページにレビューを表示するようになります。

注: 多くのチュートリアルでは、テーマの content-single-product.php ファイルを直接編集する。技術的にはこれで機能しますが、テーマが更新されると、変更内容がすべて消去されてしまう可能性があります。

この方法には、次のような問題があります。

このウィジェットは、WooCommerceの単一商品テンプレート内でのみ使用できます。そのため、このウィジェットでは複数の商品のレビューを1つのフィードに集約することはできません。

この方法は、商品ページのレビュー欄の見た目を整えることが目的の場合に有効です。ただし、WooCommerceのレビューをサイトの訪問者により目立たせるという課題を解決するものではありません。

そのためには、別のアプローチが必要です。そこで「方法2」の出番となります。

方法 2:Reviews Feed Pro を使った簡単な方法

Smash Balloonのチームによって開発された「Reviews Feed Pro」は、Elementorサイトを含むウェブサイト上で顧客レビューを集約・表示するための最高のプラグインです。

レビュー・フィード・プロ ホームページ

このツールがこの作業に最適な理由は次のとおりです:

  • WooCommerceのすべての商品のレビューを1つのフィードに集約します。特定の商品に限定されることはありませんフィード内で、異なる商品、タグ、カテゴリのレビューを表示することができます。
  • Elementorで作成したどのページでも動作します。ホームページ、ランディングページ、サイドバー、プロフィールページなど、さまざまな場所でレビューを表示できます。
  • コーディングも、テーマの編集も、開発者も不要です。このツールを設定して美しいレビューフィードを作成するのにかかるのはほんの数分。コーディングは一切必要ありません。
  • 無料版のElementorに対応しています。この機能を利用するためにElementor Proは必要ありません。
  • レビューを完全に管理できます。フィルターを設定し、フィードを管理して、訪問者に質の高いレビューだけを表示するようにしましょう。

175万人以上のユーザーと 4.9/5という高評価を誇るSmash Balloonは、確かな実績を持ち、成果をもたらす効果的なプラグインを開発しています。

設定方法は以下の通りです。

ElementorでWooCommerceのレビューを表示する方法(ステップバイステップ)

ステップ1: Reviews Feed Proのインストールと有効化

まず、こちらからプラグインを入手してください。その後、WordPressサイトにインストールして有効化してください。

この手順についてサポートが必要な場合は、WordPressプラグインのインストールに関するこのチュートリアルをご覧ください。

有効化すると、WordPressのダッシュボードに「レビューフィード」という新しいメニュー項目が表示されます。

ステップ2:WooCommerceのレビューフィードを作成する

ダッシュボードの「レビューフィード」»「すべてのフィード」をクリックします。次に、「新規追加」をクリックします。

新しいレビューフィードを追加する

このプラグインを初めて使用する場合は、ソースを選択するよう求められます。

その場合は、「ソースを追加」をクリックしてください。

新しいソースレビューフィードプロを追加

ポップアップ画面では、Reviews Feed Proが対応しているすべてのレビュープラットフォームを確認できます。

とりあえず、ポップアップで「WooCommerce」を選択し、「次へ」をクリックしてください。

レビューフィードのソースとしてWooCommerceを選択する

このプラグインはデータベースから直接レビューを読み込むため、すべてのレビューをすぐに取得できます。

注:このプラグインは既存のレビューのみを表示するため、100%安全です。したがって、万が一「Reviews Feed Pro」をアンインストールしても、レビューには影響がありません。

ステップ3:表示するレビューを選択する

特定の商品からのレビューだけに限定されるわけではありません。どの商品ページ、カテゴリ、タグからでもレビューを取得することができます。

上部のタブを使って、「投稿」、「カテゴリー」、タグ」を切り替えてください。

商品カテゴリとタグでレビューを検索する

各オプションについて、チェックボックスを使用して、取得したいレビューを選択できます。

このWooCommerceレビューフィードに使用する項目を選択したら、「次へ」をクリックしてください。

WooCommerceのレビューフィード用に特定のソースを選択する

ステップ4:レイアウトをカスタマイズする

ソースを選択すると、プラグインがフィードを生成し、テンプレートの選択を求めます。

各テンプレートは、WooCommerceのレビューを独自の方法で表示します:

  • デフォルト
  • シンプルなカード
  • 石工
  • シングル・レビュー
  • ショーケースの証言カルーセル
  • カルーセル
  • グリッドカルーセル

テンプレートを選択したら、「次へ」をクリックしてください。

レビューフィードテンプレートを選択

次に、プラグインのビジュアルカスタマイザーが表示されます。

Elementorエディターとよく似ており、編集を容易にするライブプレビュー機能も備わっています。

左側の「レイアウト」オプションをクリックして、WooCommerceのレビューのレイアウトを設定してください。

WooCommerceのレビューフィードのレイアウトを編集する

4つのレイアウトオプションが表示されます:「グリッド」、「メイソンリー」、「 カルーセル 」です

ホームページのセクションには、洗練された印象でスペースを有効活用できる「Grid」または「Masonry」をおすすめします。

WooCommerceのレビューフィードで利用可能なレイアウトオプション

多くのレビューをインタラクティブな形で表示したい場合は、カルーセルが最適な選択肢です。

ここから、以下の操作も行うことができます:

  • レビューはいくつ表示されますか
  • フィードの列数
  • レビューの表示される長さ

保存」をクリックして、ここで行った変更を確定してください。

その他のデザインオプションを使用すれば、ヘッダーやボタン、レビュー要素なども変更できます。

ステップ5:WooCommerceのレビューにフィルターを追加する

Reviews Feed Pro を使えば、表示内容を自由に制御できるため、WooCommerce のレビューフィードに質の高いソーシャルプルーフが確実に表示されるようになります。

上部の「設定」タブをクリックし、「フィルター」オプションを選択してください。

WooCommerceのレビューフィード用のフィルターとモデレーション機能

ここで、最低星評価を設定することで、4つ星と5つ星のレビューのみを表示させることができます。

また、キーワードでレビューを絞り込むことで、表示されるレビューをより細かく制御することもできます。

WooCommerceのレビューフィード用フィルター

ステップ6:ElementorにWooCommerceのレビューを追加する

フィードが希望通りの見た目になったら、「保存」をクリックし、続いて「埋め込み」をクリックしてください。

ポップアップ画面に、新しいWooCommerceレビューフィードのショートコードが表示されます。

そのショートコードをコピーしてください

WooCommerceのレビューフィード用のショートコードをコピーする

レビューを表示したいElementorページを開いてください。

これは、ホームページでも、ランディングページでも、会社概要ページでも、あるいはどのようなページでも構いません。

左側のElementorパネルで「ショートコード」ウィジェットを探してください。

次に、レビューを表示したいページレイアウト上の任意の場所にドラッグしてください

ショートコードウィジェットをElementorエディタにドラッグする例

左側のショートコード入力欄にショートコードを貼り付けてください

そうすることで、このElementorページにWooCommerceのレビューフィードが自動的に埋め込まれます。

WooCommerceのレビューフィード用ショートコードを貼り付ける

最後に、「公開」または「更新」をクリックすると、レビューがウェブサイトに反映されます。

さらに、これは無料版のElementorでも動作します。この手順ではElementor Proは必要ありません。ショートコードウィジェットは無料版でも利用可能です。

WooCommerceのレビューを表示したレビューフィードの例

プロのヒント:Spiegel Research Centerの調査によると、レビューが掲載されている商品のコンバージョン率は最大270%高くなります。それらのレビューはもともと存在していました。これで、訪問者が実際にそれらを確認できるようになります。

プラグインをアンインストールすると、レビューはどうなるのでしょうか?

WooCommerceのレビューはWordPressのデータベースに保存されており、Reviews Feed Proはそれらを読み取るだけなので、安全です。

それらを保存したり、所有したり、あるいはいかなる形でも管理したりすることはありません。

プラグインをアンインストールすると、フィードの表示自体が消えてしまいます。ショートコードは機能しなくなり、ウィジェットは空白になります。

しかし、顧客が残したすべてのレビューは、依然としてデータベース内にそのまま残っています。

レビューフィードの読み取り専用アクセスに関する説明

後でプラグインを再インストールしたいですか?すべてが以前と全く同じ状態で再接続されます。レビューもそのまま残っています。

今すぐElementorでWooCommerceのレビューを表示しましょう

これで、Elementorサイト上で顧客レビューの表示を開始できます。

調査によると、消費者の93%が 「レビューが購入の意思決定に影響を与える」と回答しており 、もしそれらのレビューが表示されていなければ、潜在的な売上機会を逃していることになります。

Reviews Feed Proを使えば、この作業は驚くほど簡単です。プラグインを有効化し、表示したいレビューを選択して、デザインを設定し、ショートコードを貼り付けるだけです。

5分もかからずにレビューフィードを公開できます。

Reviewws Feed Pro を導入して、WooCommerce のレビューを手軽に表示しましょう

WooCommerceのマーケティングに関するその他のヒントとガイド

著者アバター
サジャン・シャルマ シニアライター
WordPress、ソーシャルメディアマーケティング、オンラインビジネスについて10年以上執筆。専門分野はインフルエンサーマーケティング、コンテンツキュレーション、デジタルマーケティング戦略など多岐にわたる。

コメントを追加する

コメントをお寄せいただきありがとうございます。すべてのコメントはプライバシーポリシーに従って管理され、すべてのリンクはnofollowであることにご留意ください。名前欄にはキーワードを使用しないでください。個人的で有意義な会話をしましょう。