ストア体験の設定

概要

ストア体験の設定を使用すると、エコフレンドリーなロイヤルティプログラムがShopifyストアフロントで顧客にどのように表示されるかをカスタマイズできます。これには、フローティングローンチャーボタン、ロイヤルティウィジェットポップアップ、ウェルカムメッセージ、およびテーマカラーが含まれます。

体験エディターへのアクセス

ストア体験をカスタマイズするには：

1. LoyaltyTree管理ダッシュボードに移動します
2. ストア設定に移動します
3. 体験エディターをクリックします

フローティングローンチャー

フローティングローンチャーは、ストアフロントの隅に表示されるボタンで、顧客が自分のロイヤルティ報酬に迅速にアクセスできます。

ローンチャーテンプレート

3つのローンチャーテンプレートから選択できます：

• ミニマル - アイコンのみ、コンパクトなデザイン
• コンパクト - プログラム名付きのアイコン
• フル - アイコン、名前、およびシード数

Handlebarsのプレースホルダーを使用して、ブランドを高めるためにローンチャーHTMLをカスタマイズすることもできます。

ロイヤルティウィジェットポップアップ

顧客がローンチャーをクリックすると、報酬の進捗、エコティア、および環境への影響を示すロイヤルティウィジェットポップアップが表示されます。

ロイヤルティビューテンプレート

ロイヤルティビュータブでは、顧客の進捗がどのように表示されるかを選択できます：

• 報酬マイルストーンタイムライン - エコ報酬への進捗を視覚的タイムラインで表示
• 完了した、現在の、および今後のマイルストーンを進捗バーで表示

メッセージ設定

メッセージタブでは、ウィジェットに表示されるテキストやブランディングをカスタマイズできます：

プログラムのブランディング

• プログラム名 - フローティングローンチャーとウィジェットダイアログに表示される名前（例："My Eco Rewards"）
• プログラムアイコン - カスタムアイコンをアップロードします（推奨最小100x100px）

ウィジェットウェルカムメッセージ

これらのメッセージはロイヤルティウィジェットポップアップに表示されます：

• ウェルカムタイトル - メインヘッディング（例："私たちのエコフレンドリーなロイヤルティプログラムへようこそ"）
• ウェルカムサブタイトル - プログラムの仕組みを説明します
• プログラムリンクテキスト - プログラムページへのリンクテキスト
• ウィジェットツールチップ - ウィジェットボタンにマウスオーバーしたときに表示されます

ウィジェットテーマ

ロイヤルティウィジェットの色と視覚スタイルをカスタマイズします：

プリセットテーマ

プリセットテーマから選択してウィジェットをすぐにスタイリングできます：

• ダークモード - 目の疲れを軽減するためのモダンダークテーマ
• グリーンネイチャー - 自然の緑テーマ（デフォルト）
• ミニマルグレー - クリーンでプロフェッショナルなグレースケールテーマ
• オーシャンブルー - 海にインスパイアされた落ち着いた青のテーマ
• サンセットオレンジ - 夕焼けにインスパイアされた暖かいオレンジのテーマ

カスタムカラー

"色をカスタマイズ"を有効にして、ストアブランドに合わせて主要、二次、アクセントカラーを手動で設定します。

追加タブ

体験エディターには、次のタブも含まれています：

• プログラム概要 - プログラム情報ページに表示されるコンテンツ
• 利用規約 - ロイヤルティプログラムの法的条件
• インパクトヘッダー - ストア全体のインパクト表示をカスタマイズ
• マイインパクトヘッダー - 顧客の個人的なインパクト表示をカスタマイズ
• ダッシュボードヘッダー - ロイヤルティダッシュボードヘッダーをカスタマイズ

最良の結果を得るためのヒント

• ブランドアイデンティティに合ったプログラム名を使用してください
• Shopifyテーマを補完するテーマカラーを選択してください
• ウェルカムメッセージは簡潔で招待的に保ちます
• 異なるデバイスでウィジェットのテストを行い、モバイルとデスクトップでの見栄えを確認してください