ElementorでEasy Digital Downloadsのレビューを表示する方法(ノーコードガイド)
ホーム ブログ ElementorでEasy Digital Downloadsのレビューを表示する方法(ノーコードガイド)

ElementorでEasy Digital Downloadsのレビューを表示する方法(ノーコードガイド)

ElementorでEasy Digital Downloadsのレビューを表示する方法(ノーコードガイド)

EDDのレビューは、ダウンロードページではすでにその役割を果たしています。問題は、それらが表示されるのがその場所だけだということです。ホームページでも、ランディングページでも、カテゴリページでも表示されていません。

EDDにはまさにこのためのショートコードが用意されているので、レビューを別の場所に配置することができます。問題は、Elementorで作成したページにそれをどのように組み込むか、そしてある商品のレビュー一覧がページの要件に完全に合致しない場合はどうすべきか、ということです。

コードを書かずにこれを行う方法は2つあります。EDDのショートコードをElementorの「ショートコード」ウィジェットに貼り付ける方法があり、これは問題なく動作し、追加費用もかかりません。

あるいは、レイアウトに直接ドラッグして配置できるレビューウィジェットを使えば、ページを作成している最中でも実際のレビューを表示することができます。

このガイドでは、ダウンロードIDの確認、ショートコードの配置、任意のページへのレビュー掲載という手順を、順を追って解説します。さらに、EDD、Google、Trustpilotのレビューを、1つのスタイリング済みのブロックにまとめて表示する方法についても説明します。

コードも、Elementor Proも不要です。そして、次にダウンロードを実行すると、ページが自動的に更新されます。

この記事の中で

【クイック回答】ElementorでEasy Digital Downloadsのレビューを表示する方法

EDDのレビューをElementorのページに表示するにはどうすればよいですか?

2つの方法があり、どちらもコードは不要です。EDDのレビュー用ショートコードをElementorの「ショートコード」ウィジェットに貼り付けるか、エディタ上で直接最新のレビューを表示する「レビュー」ウィジェットをドラッグして配置します。

ショートコードを使用する場合は、Elementorの「ショートコード」ウィジェットをページ上にドラッグ&ドロップし、以下を貼り付けてください。 [review download="123" multiple="true" number="10"], ダウンロードしたファイルのIDを「123」に置き換えてください。

ウィジェットルートについては:

  1. 「Reviews Feed Pro」をインストールして有効化してください。
  2. 「レビューフィード」»「すべてのフィード」に移動し、「新規追加」をクリックしてください。
  3. ソースとして「Easy Digital Downloads」を選択し、ダウンロード対象、カテゴリ、またはタグを選んでください。
  4. フィードのスタイルを設定して保存します。
  5. Elementorのページを開き、ウィジェットパネルで「Reviews Feed」を検索してドラッグし、フィードを選択してください。
ElementorにEDDのレビューを埋め込む手順

レビューは、作成中にElementorのキャンバス上に表示されるため、それに合わせてページのデザインを調整することができます。

ショートコードは、1つのページ上の1つの商品に対応しています。このウィジェットは、複数の場所でレビューを表示したい方に最適です。

EDDのレビューが掲載されている場所(および移動方法)

デフォルトでは、EDDのレビューは、ダウンロードページというたった1か所にのみ表示されます。

それは意図的な仕様です。レビューはEDDの「Reviews」アドオンから表示されますが、このアドオンを利用するには「Extended Pass」以上のプランが必要です。

「ダウンロード」>「拡張機能」でこの機能を有効にすると、各ダウンロードページに個別のレビュー一覧が表示されます。

デジタルダウンロードを簡単に行えるように、レビュー拡張機能を有効にしてください

他の場所にも表示したい場合は、EDDが2つのショートコードを提供しています:

  • [review id="REVIEW_ID"] 特定のレビューを1件表示します。
  • [review download="DOWNLOAD_ID" multiple="true" number="10"] 1つのダウンロードに対するレビューの一覧を表示します。

Elementorでは、これらをショートコードウィジェットを通じて処理します。その方法については、以下のセクションでご説明します。

始める前に、一点注意があります。これらのショートコードはレビューを表示するだけで、それ以上の機能はありません。EDDはこの点について明確にしています:ショートコードはレビューを表示するだけで、収集は行いません。投稿はダウンロードページで行われます。

方法 1:EDD ショートコードを Elementor に貼り付ける

始める前に必要なものは以下の通りです:

  • Elementor、無料版で十分です
  • 「Easy Digital Downloads」で「Reviews」アドオンを有効にした状態

まず、「Reviews」が実際に有効になっていることを確認してください。「ダウンロード」→「拡張機能」に移動し、リストから「Reviews」を見つけて有効にしてください。これが有効になっていないと、ショートコードは何も表示できません。

ダウンロードIDを確認する

ショートコードは、どの商品を指しているのかを判別する必要があるため、番号の入力を求めます。

ダッシュボードから「ダウンロード」に移動し、製品名にカーソルを合わせます(クリックはしないでください)。

コンテキストメニューのすぐ横を見ると、「#60」のような番号が表示されています。その番号がダウンロードIDです。

EDD製品のダウンロードID

また、ダウンロードリンクをクリックして、ブラウザのアドレスバーから同じ番号を確認することもできます。

もし……したい場合は、この方法は単一のレビューに対しても有効です。 [review id=""] バージョン。

ショートコードウィジェットを配置する

さあ、その数字を活用しましょう。

  1. Elementorで表示したいページを開きます。
  2. 左側のパネルのウィジェット検索ボックスに「ショートコード」と入力してください。
Elementorでショートコードウィジェットを選択する
  1. ショートコードウィジェットを、レビューを表示したいページの場所までドラッグして配置してください。
  2. 貼り付け [review download="60" multiple="true" number="10"] ボックスに、60を自分のダウンロードIDに置き換えて入力してください。
  3. 「更新」をクリックし、その後、公開ページを開いて確認してください。
Elementorでeddのレビューをショートコードとして追加する

この最後のステップが重要です。エディタの表示はプラグインによって異なる場合があるため、実際にページが表示された状態で、正常に動作しているかを確認する必要があります。

について multiple="true" この部分では、EDDに対して、1件のレビューではなく、全リストを表示してほしいことを伝えます。この number="10" この部分で表示される件数を制限します。10を任意の数値に変更してください。

有料ウィジェットのショートカット

ショートコードを貼り付けるよりも、実際のウィジェットをドラッグして配置したい場合は、Element Pack Pro に「EDD Product Reviews」ウィジェットが用意されています。

レイアウトの切り替え機能に加え、件数制限、並べ替え、ステータスに関するクエリ制御機能も備えています。

問題は購入費用です。たった1つのウィジェットのためだけに、ElementorやEDD Reviewsに加えて、Element Pack Proのフルバンドルを購入することになるのです。

ショートコードの用途

このショートコードは、ある1つの機能をしっかりと果たします。それは、ページ上に商品のレビューを表示することです。

これがデザイン全体の概要です。ですから、その境界がどこにあるかを知っておくと役立ちます:

  • 1つのショートコードで、1つのダウンロードのレビューが表示されます。商品が3つあれば、ウィジェットも3つになります。
  • その商品について承認されたすべてのレビューを、承認された順に印刷します。
  • デフォルト設定を超えたスタイリングを行うには、CSSが必要です。
  • 新しいダウンロードがある場合は、自分でそのページに追加する必要があります。
  • EDDのレビューのみが表示されます。GoogleやTrustpilotのレビューは別の場所に掲載されています。

この最後の点が、多くの店舗経営者が直面する課題です。最も満足度の高い顧客は一か所に集まっているわけではなく、口コミも同様です。

方法 2:Elementor で「Reviews Feed Pro」ウィジェットを使用する

ショートコードボックスではなく、本格的なウィジェットを使いたいですか?「Reviews Feed Pro」をインストールして、フィードを一度作成すれば、そのウィジェットをElementorのどのページにもドラッグ&ドロップで配置できます。

Reviews Feed Pro」は、さまざまなプラットフォームからのレビューを収集し、サイト内の任意の場所に表示できるWordPressプラグインです。ビジュアルカスタマイザーでフィードを作成し、ウィジェット、ブロック、またはショートコードを使って配置します。

以下に、その一連のプロセスを紹介します。

1. 「Reviews Feed Pro」をインストールして有効化します。Easy Digital Downloads ソースが含まれているのは「Plus」プランのみですので、このプランが必要です。有効化後にライセンスキーを追加してください。

2. 「レビューフィード」»「新規追加」に進み、「ソースを追加」をクリックします。

ウェブサイトに新しいレビューフィードを追加する

リストから「Easy Digital Downloads」のタイルを選んでください。

お使いのサイトでEDDまたはEDD Reviewsが有効になっていない場合、そのタイルは灰色表示になります。そのため、まずEDDの設定を確認するようにしてください。

新しいフィードのソースとして「edd」を選択してください

3. 表示対象を選択します。特定のダウンロード、カテゴリ全体、またはタグからレビューを取得することができます。

ソースを選択したら、「次へ」をクリックしてください。

EDDレビューフィードに使用するレビューを選択してください

ソースとして「EDDレビュー」を選択し、「次へ」をクリックします。

4. ライブカスタマイザーでデザインを設定します。「グリッド」、「リスト」、「メゾニー」、「カルーセル」の4つのレイアウトから選択できます。

ページに合った形状を選び、残りのカスタマイズオプションを使って、ボタンやヘッダー、レビュー要素などを変更してください。

フィード内にEDDのレビューを表示するライブフィードエディタ

5. Elementorのページを開き、ウィジェットパネルで「Reviews Feed」を検索します。

ウィジェットを右側のライブプレビューにドラッグしてください。

Elementorの投稿またはページにレビューフィードウィジェットを追加する

さて、ドロップダウンメニューから、先ほど作成したEDDレビューフィードを選択することができます。

お好みであれば、ここから新しいタブを開いて新しいフィードの作成を始めることもできます。

ドロップダウンメニューからレビューフィードを選択してください

ここが気に入っているところです。レビューがElementorのライブプレビューに表示されるため、実際の顧客の声に基づいてページのデザインを調整できるのです。

しかも、CSSには一切手を加える必要がありません。カスタマイザーから設定できる項目は以下の通りです:

  • レイアウトの種類:グリッド、リスト、メゾニー、またはカルーセル
  • 一度に表示されるレビューの数
  • 星評価によるフィルタ機能。これにより、4つ星と5つ星のレビューのみが表示されるようになります。
  • キーワードフィルター:レビューに含まれる単語に基づいて、レビューを含めるか除外するかを選択する機能
  • 表示の調整:レビューをクリックすると非表示になります
  • 「ピン留め」して、お気に入りのレビューを一番上に表示させる

出力に関して知っておくべき2つのポイントがあります。レビューのタイトルは本文の上部に表示されるため、各レビューに、訪問者が一目で把握できる見出しが付きます。

EDD Reviewsを使用したサイドバーレビューウィジェットの例

また、複数のダウンロード元からデータを取得しているフィードでは、ヘッダーに総合の星評価が表示されます。すべての評価をまとめた、たった1つの数値です。

APIキーも不要です。EDDのレビューデータはすでに自社のデータベースに保存されているため、フィードはローカルでそれらを読み込みます。

GoogleとTrustpilotを同じフィードに追加する

レビューがすべてEDDにあるわけではないのと同様に、フィードもEDDである必要はありません。

プラットフォームごとに1回ずつ「ソースを追加」をクリックすると、Reviews Feed Proがそれらを1つのフィードに統合します。

このモーダルウィンドウには、Easy Digital Downloadsのほか、Google、Facebook、Yelp、TripAdvisor、Trustpilot、WordPress.org、WooCommerceといった他の人気のあるソースも掲載されています。

eddを含むさまざまなプラットフォームのレビューを統合したレビューフィード

ホームページに「お客様の声」というブロックがある様子を想像してみてください。自社製品に関するEDDのレビュー3件、カスタマーサポートを称賛するGoogleレビュー2件、Trustpilotのレビュー1件。すべての情報源で星の評価フィルターが統一されています。ウィジェットは1つだけです。

Smash Balloonのプラグインは175万以上のウェブサイトで稼働しており、まさにこの機能――レビューが掲載されている場所からそれを取得し、ユーザーの目に留まる場所に表示する――を実現しています。

これにはElementor Proが必要ですか?

いいえ。どちらの方法も、無料版のElementorで動作します。

その理由は次のとおりです。「Reviews Feed」ウィジェットは、ElementorではなくSmash Balloonプラグインによって登録されています。そのため、無料版のElementorでもPro版でも、ウィジェットパネルに同じように表示されるのです。

Pro版でも無料版でも、フィードの動作は同じです。ソース、フィルター、レイアウトはすべて、Elementorではなく「Reviews Feed Pro」独自のカスタマイズ機能で設定されます。

Elementor Proには、テーマ作成機能と独自のウィジェットセットが追加されます。どちらもレビューの表示とは一切関係ありません。すでにPro版を購読している場合は、何も変わりません。購読していない場合でも、何かが欠けているというわけではありません。

フィードの設定を一度行ったら、それ以降はページの編集をやめる

たとえば、来月新しいダウンロードコンテンツをリリースするとします。その場合、すべてのページを開いて追加する必要があるのでしょうか?

ショートコードを使えば、可能です。各ショートコードは1つのダウンロードIDに対応しているため、新しい商品が追加された場合は、表示させたい場所に新しいショートコードを貼り付ける必要があります。ホームページ、ランディングページ、販売ページなど、1つずつ作業することになります。

フィードがある場合は、その必要はありません。カテゴリやタグでソースを指定していれば、そのカテゴリの新しいダウンロードは自動的にフィードに反映されます。

カルーセルレイアウトを採用したEDDレビューフィードの例

そのフィードを表示するすべてのページで、変更が即座に反映されます。一度設定すれば、あとは放っておいても大丈夫です。

セットアップにかかる時間はほぼ同じですが、維持にかかる手間は異なります。

以下に、2つの手法を時間軸で比較した結果を示します。

変更点ショートコードレビュー フィード・プロ
新しいダウンロードが追加されました各ページを編集して、ショートコードを追加してくださいカテゴリまたはタグのソースから自動的に取り込まれます
レイアウトを変更するCSSを書くグリッド、リスト、メゾニー、カルーセルの表示形式を切り替える
レビューを非表示にする承認済みのレビューをすべて表示しますカスタマイザー内のレビューをクリックすると、そのレビューが非表示になります
Googleのレビューを追加するEDDのレビューのみ「ソースを追加」をクリックし、Googleを選択してください

お店に商品が1つ、ページが1つしかない場合は、ショートコードで問題ありません。ダウンロードコンテンツを追加したり、定期的にページを作成したりする場合は、フィードを使えばその都度戻って操作する手間が省けます。

よくある質問

Easy Digital DownloadsはElementorと連携しますか?

はい、Easy Digital DownloadsはElementorと連携します。Elementorで通常通り、ストアページ、ランディングページ、セールスページを作成することができます。レビュー機能は別の要素ですが、このガイドで紹介する2つの方法でその問題を解決できます。

訪問者はElementorのページにレビューを投稿できますか?

いいえ、訪問者はElementorのページにレビューを投稿することはできません。ショートコードもフィードウィジェットも、既存のレビューを表示するだけです。顧客は引き続き、個別のダウンロードページからレビューを投稿します。

どのEDDパスに「レビュー」が含まれていますか?

「レビュー」アドオンは、「Extended」パス以上で利用可能です。それより下のパスをご利用の場合は、拡張機能一覧に「レビュー」が表示されず、どちらの方法でも何も表示されません。

EDDのレビューを表示するには、APIキーが必要ですか?

いいえ、EDDのレビューにはAPIキーは必要ありません。それらはすでにWordPressのデータベース内に保存されているため、フィードがローカルで読み取ります。GoogleやTrustpilotとの連携は別の手順となり、「ソースを追加」モーダル内で処理されます。

複数の商品のレビューを表示することはできますか?

はい、複数の商品のレビューを表示することは可能です。フィードを単一のダウンロードではなく、カテゴリやタグごとに取得すれば、その中のすべての商品が同じブロックに反映されます。そうすることで、フィードのヘッダーには、それらすべての商品の総合的な星評価が表示されます。

レビューを自分のページに合わせて調整することはできますか?

はい、ページに合わせてフィードのデザインを調整することができます。レイアウト、色、タイポグラフィはすべて「Reviews Feed Pro」のカスタマイザーで設定できるため、CSSを記述する必要はありません。Elementorのプレビュー画面で表示を確認し、ページに合わせてフィードのデザインを微調整することができます。

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

レビューはすでに存在しています。それらはダウンロードページに掲載されており、ダウンロードページ上でその役割を果たしていますが、表示されているのはそこだけです。

EDDのショートコードは、1つの商品のレビュー一覧をElementorのページに表示します。これはEDD Reviewsにすでに含まれており、正常に動作します。商品が1つでページも1つだけの場合、これで問題ありません。

フィードが大きな役割を果たします。あらゆるソースから、最高評価のものだけに絞り込み、CSSを使わずにスタイル設定され、制作中にElementorのキャンバスにリアルタイムで表示されます。

また、ダウンロードを追加すると、自動的に更新されます。

Reviews Feed Pro」を入手して、フィードを一度作成しましょう。そのウィジェットをホームページに配置すれば、新規訪問者の目に留まる場所に、ついにレビューが表示されるようになります。

次はGoogleのレビューを追加してみませんか?WordPressでGoogleのレビューを表示する方法については、こちらのガイドをご覧ください。

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

コメントを追加する

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