星-評価は、あなたの製品やサービスについてのユーザーの意見を視覚的に表現するための貴重なツールです。これにより信頼性が高まり、潜在的な顧客が十分な情報に基づいた決定を下すのを助けることができます。このガイドでは、Elementorで星評価を簡単に実装・デザインする方法を学びます。
主なポイント
- 星評価はアイコンボックスや画像ボックスと組み合わせることができます。
- 評価のスケールや星の外観を調整できます。
- 星は半分の値も表示可能で、より正確な評価を示すことができます。
- リンクと魅力的なデザインがユーザーエクスペリエンスにとって重要です。
ステップ 1: 星評価の選択
Elementorに星評価を追加するには、まず適切なウィジェットを選択します。Elementorエディタで「ウィジェット」に移動し、「星評価」を検索します。ウィジェットを見つけたら、簡単にドラッグアンドドロップでページの希望の位置に配置できます。

ステップ 2: 評価スケールの設定
星評価の設定エリアで、使用するスケールを決定できます。デフォルトでは、0から5のスケールと0から10のスケールの2つから選べます。ページに適したスケールを選択してください。今回は5つ星スケールを選び、評価として3を入力します。

ステップ 3: 星のデザインを調整
次のステップでは、星のデザインを調整できます。「Font Awesome」や「Unicode」など、さまざまなアイコンスタイルから選択します。ページのデザインに応じて、最も適したアイコンを選んでください。このガイドでは、より現代的な表現のために「Font Awesome」を使用します。

ステップ 4: 星の充填を設定
星の充填を調整するオプションがあります。星が完全に塗りつぶされるか、輪郭のみが表示されるかを決定できます。例えば、2つの星を完全に覆いたい場合は、設定を調整して半分未満またはカウントのみを充填することができます。このデモでは、完全に塗りつぶされた星を選択します。
ステップ 5: タイトルと配置を追加
次に、評価にタイトルと配置を付けることが重要です。「メガ良い」のように魅力的なタイトルを選び、ユーザーに評価の明確なイメージを提供します。テキストの配置を「中央」に設定し、バランスの取れた外観を実現します。
ステップ 6: スタイルとタイポグラフィの調整
次のステップでは、デザインに合わせてフォントを調整します。例えば、テキストカラー、フォントスタイル(通常、太字、イタリック)や、テキストと評価の間の行間を設定できます。このガイドでは、フォントスタイルを太字に設定し、間隔を6ピクセルに増やします。

ステップ 7: 星評価のリンク設定
星評価にコンテキストを与えるために、リンクや画像を追加することが非常に役立ちます。星評価の下に画像を表す画像ボックスを挿入できます。画像ボックスウィジェットをエディタにドラッグし、適切な画像をアップロードしてください。
ステップ 8: 画像とテキスト内容の調整
画像をアップロードしたら、そこにテキストを追加できます。例えば「トビアス 21」と入力し、「この本は私に目を開かせてくれました。」のような評価を詳しく説明する短いテキストを加えます。これにより、評価に個人的かつ感情的な関連性を持たせることができます。

ステップ 9: セパレーターの追加
セパレーターは、評価を残りのコンテンツから視覚的に区切るのに役立ちます。エディタにセパレーターを引き込み、テキストと評価の間ではなく、戦略的に配置してください。セパレーターのサイズを調整し、調和のとれたスペースを作成します。

まとめ – Elementorでの星評価のデザインに関するヒント
これで、Elementorに魅力的な星評価を追加するためのすべての必要なステップを完了しました。これは、あなたのページの信頼性を高めるだけでなく、ユーザーエンゲージメントの向上にも役立ちます。評価を定期的に更新し、関連性を維持することに注意してください。半分の星を利用して、より正確な評価を可能にし、魅力的なデザインを通じて美的な全体像を作り出します。
FAQ
評価に設定できる星の数はいくつですか?0から5または0から10の星のスケールを選択できます。
半分の星は表示できますか?はい、より正確な評価のために半分の星を利用できます。
星のデザインを調整するにはどうしたらよいですか?さまざまなアイコンスタイルや充填または輪郭の設定から選択してください。
評価に画像を追加できますか?はい、評価を文脈化するためにそれが可能であり、推奨されます。
星評価を定期的に更新する必要がありますか?はい、関連性のあるコンテンツを提供するために、評価を定期的に確認し、調整する必要があります。