クリック後の動作を設定する

Click actionは、見積もりボタンの動作を決める設定です。お客様がすぐに依頼を完了するのか、先に商品を集め続けるのかが決まるため、Button & widgetタブで最も重要な設定です。

クリックアクションを選択する

1. ボタンの設定を開く

   アプリでQuote settingsに移動してCustomizeをクリックし、Button & widgetタブを開きます。

2. Click actionを見つける

   Click actionは、Quote Button Settingsセクションの上部付近、Button textのすぐ下にあります。

3. 3つのアクションから1つを選ぶ

   Open quote form popup、Add product to quote cart、Redirect to quote pageのいずれかを選択します。それぞれの内容は下の表と解説で説明しています。1回の依頼で複数の商品を扱うことが多いストアには、Add product to quote cartがおすすめです。切り替えながらPreviewパネルを確認してください。

   注意

   Add product to quote cartを選択すると、そのラジオボタンの_中_にShow popup message after adding productパネルが開きます。他の2つのアクションでは、これらのフィールドはページ上に表示されません。詳しくは下の確認メッセージをご覧ください。

4. 保存して試す

   ラジオボタンを変更すると、Customizeエディタの右上にDiscardとSaveが表示されます。Saveをクリックし、ご自身のストアフロントで見積もりボタンをクリックして動作を確認します。

   注意

   保存する前にエディタを閉じようとすると、「Discard all unsaved changes」「If you discard changes, you’ll delete any edits you made since you last saved.」と確認が表示されます。変更を破棄するつもりでない限り、Continue editingを選択して保存してください。

各アクションの動作

オプション	お客様に表示される内容	おすすめの用途
Open quote form popup	閲覧中のページの上に見積もりフォームが開きます。	その場で完了させたい、1商品のみの依頼。
Add product to quote cart	商品が見積もりカートに追加され、お客様はそのまま閲覧を続けます。	複数の商品をまとめて依頼するお客様。
Redirect to quote page	見積もりカートページに直接移動します。	依頼がほぼ常に1商品のみで、他に追加するものがないストア。

ノート

お客様が複数の商品を見積もりすることが多い場合は、Add product to quote cartを選択してください。Redirect to quote pageは、クリックのたびに閲覧が中断されます。

ノート

Toastという4つ目のオプションが表示されていませんか？一部のストアでは、アプリの以前のストアフロントコードがまだ使用されており、その場合はToastも表示されます。Add product to quote cartと同じ動作ですが、ポップアップではなく小さなトーストメッセージで確認を表示します。Click actionに3つのオプションしか表示されない場合、ストアは新しいストアフロントを使用しており、上記の3つがすべてです。

お客様の体験

3つのアクションは、ストアフロントでの体験がまったく異なります。それぞれがお客様にどのように表示されるかを説明します。

Open quote form popup

お客様が閲覧中のページの上に見積もりフォームが開くため、商品ページから移動することはありません。フォームのフィールドはQuote formタブで作成したもので、「Already have an account? Log in to auto-fill your contact and company information.」というメッセージが表示されます。

ポップアップにより、お客様は閲覧中のページにとどまれます。

Add product to quote cart

商品がお客様の見積もりカートに追加され、お客様は元のページにとどまります。この時点ではまだ依頼は届きません。依頼が送信されるのは、見積もりカートページを開いてフォームを送信したときです。

追加できたことは2つの方法で伝わります。下で説明する確認ポップアップと、画面の端に表示される**Quote (n)**というフローティングウィジェットです。ウィジェットの数字は、商品を追加するたびに増えます。

注意

このアクションでは、お客様が見積もりを送信しないまま離れてしまう可能性があります。見積もりに戻る方法を2つ用意してください。ポップアップのPrimary button（デフォルトはView Quote）をそのまま残し、フローティングウィジェットを有効にして、**Quote (n)**の数がストア内でお客様に付いて回るようにします。詳しくはFloating quote widgetをご覧ください。

Redirect to quote page

お客様は/pages/request-for-quoteにある見積もりカートページに直接移動します。ページにはRequest a Quoteという見出しと「Tell us what you need and we will contact you soon.」という一文が表示され、Quote Cartには商品がすでに追加されています。

Quote form appearanceをMultiple stepに設定している場合は、ステップ1 Products selectionから始まり、Next stepで先に進みます。買い物を続けたい場合はContinue Shoppingも使えます。Single pageの場合は、フォーム全体が1画面に表示されます。どちらの場合も、依頼はそのページから送信されます。詳しくはRequest a Quote pageをご覧ください。

このアクションでは確認ポップアップは表示されません。見積もりページ自体が確認の役割を果たします。

確認メッセージ

商品が追加されたときに、短い確認メッセージを表示して、追加できたことをお客様に伝えられます。

注意

これらのフィールドは、Add product to quote cartアクションの中にあります。****Show popup message after adding productと、そのMessage、Primary button、Secondary button、URL linkフィールドは、Click actionをAdd product to quote cartに設定した場合にのみ表示されます。Open quote form popupまたはRedirect to quote pageを選択していて見つからない場合は、これが理由です。先にクリックアクションを変更してください。

パネルの見出しはShow popup message after adding productで、右側のPreviewリンクからエディタを離れずにポップアップを確認できます。次のフィールドに入力します。

フィールド	内容
Message	確認メッセージの文言。デフォルトはThe product {{ product_title }} is added to your quote.です。
Primary button	ポップアップのメインボタン。デフォルトはView Quoteです。
Secondary button	お客様を買い物に戻すボタン。デフォルトはContinue Shoppingです。
URL link	「Where the secondary button sends customers. Defaults to your all-products collection.」

Messageの下に、アプリがAvailable variablesとして{{ product_title }}を表示します。クリックしてコピーし、商品名を表示したい場所の文言に貼り付けます。例：We have added {{ product_title }} to your quote request.メッセージで使用できる変数はこれだけです。

ポップアップの表示

ストアフロントでは、お客様が閲覧中のページの上に小さなポップアップとして表示されます。商品名が入ったMessageと、見積もりにすぐ移動するView Quote、閲覧を続けるContinue Shoppingの2つのボタンが表示されます。

商品を見積もりに追加した後の、公開中のストアフロントのポップアップ。

ノート

URL linkは、ポップアップのContinue Shoppingボタンの移動先です。デフォルトのすべての商品コレクションのままにせず、お客様に続けて見てほしいコレクションを指定してください。小さな変更ですが、お客様がカタログの適切な部分にとどまりやすくなります。

見積もりの次のステップ

お客様は必要なものをすべて選んだら、見積もりカートページを開き、フォームに入力して依頼を送信します。依頼はアプリのQuote listに届きます。お客様が入力するフィールドはQuote formタブで設定したものです。

送信した直後にお客様に表示される内容は、同じエディタのSuccess messageタブで設定します。Success messageには確認メッセージとしてThank you、「Thank you for submitting a request a quote!」、Continue Shoppingが含まれ、After submitで別の場所に移動させることもできます。

送信後に独自のページへ移動させる

独自のサンクスページを用意している場合は、Redirect to custom URLを使うと、確認画面の代わりにそのページへお客様を移動させられます。

1. Success messageタブを開く

   アプリでQuote settingsに移動してCustomizeをクリックし、Success messageタブを開きます。

2. After submitを見つける

   After submitセクションまでスクロールし、Redirect to custom URLをオンにします。

3. ページのURLを入力する

   お客様に移動してほしいページのアドレスを貼り付けます。たとえば、独自のサンクスページのhttps://your-store.com/pages/thank-youなどです。正しく表示されることを確認できるよう、ページのアドレスバーからコピーしてください。

4. 保存する

   エディタの右上にあるSaveをクリックし、ご自身のストアフロントからテスト用の見積もりを送信して、正しいページに移動することを確認します。

   

ノート

Redirect to custom URLをオフのままにすると、お客様は組み込みの確認画面にとどまります。ほとんどのストアではこれで問題ありません。注文追跡の案内、割引コード、アップセルなど、サンクスページでより多くのことを行いたい場合にリダイレクトを使用してください。

メール通知はここでは設定しません。Success messageタブは設定場所を案内するだけで、お客様への確認メールと管理者への通知メールはOther settingsで管理します。詳しくはEmails sent to customersをご覧ください。

お困りの場合

クリックアクションの動作がこのページの説明と異なる場合は、選択したアクションと発生した内容をお知らせください。詳しくはContact supportをご覧ください。

次のステップ

• Floating quote widget — 見積もりカートにいつでも戻れるフローティングウィジェット
• Change button text and colors — ボタン自体の文言と見た目
• Request a Quote page — お客様が移動する見積もりカートページ