商品カートに追加
Last updated
Was this helpful?
Last updated
Was this helpful?
概要: 要素は、ページまたは商品ページに掲載されているすべての商品に必須の要素です。これにより、訪問者はワンクリックで商品を素早く簡単にショッピングカートに追加できる「カートに追加」ボタンが表示されます。
こちらのビデオチュートリアルもご覧いただけます:
ステップ1: 「Elements」アイコンをクリックします。次に、「Shopify」タブで「Product add to cart」を選択します。
ステップ2: 要素をドラッグ&ドロップしてページエディターに配置します。
検索機能を使用して、この要素を素早く見つけることもできます。
商品のカートに追加要素は、可能な限り最高のコンバージョン率のために外観を最適化するためのさまざまなパラメーターを提供します。
ページキャンバスで要素をクリックすると、この要素に固有のGeneralタブとStylingタブのパラメーターにアクセスできます。
商品のソース 上記で説明したように、AutoとCustom Productの2つのオプションがあります。 - Auto: 商品ページにいる場合、このページに割り当てられた商品がエディターに表示されます。 - Custom Product: 表示する特定の商品を選択できます。 注意: 商品ソースオプションは、通常ページでは利用できません。
カートに追加後のアクション: ATCボタンをクリックした後の4つのオプションがあります。 - 同じページに留まる - カートページへ移動 - チェックアウトページへ移動 - カスタムリンクへ移動
ボタンの種類 ボタンには、テキストのみ、アイコン付きテキスト、アイコンのみの3種類があります。
ボタンテキスト ボタンに表示するテキストを入力します(例: 「カートに追加」)。
追加中テキスト 商品がカートに追加されている間に表示されるカスタムテキストを入力します。
追加済みテキスト 商品が正常に追加されたときに表示されるカスタムテキストを入力します。
売り切れテキスト 商品が売り切れの場合に表示されるカスタムテキストを入力します。
フル幅を有効にする 「カートに追加」ボタンをコンテナの全幅に広げます。
Stylingタブでは、カートに追加ボタンのグローバルスタイルを設定し、適用することができます。これにより、サイト上の複数の要素に適用できる一貫したスタイルを定義できます。
また、ボタンがノーマル状態、マウスオーバー状態、アクティブ/選択状態、無効状態の異なる状態でどのように表示されるかをカスタマイズすることもできます。
カートに追加ボタンの色を変更するには、Button > Styling tabをクリックします。ボタンの色を設定するための2つのパラメーターがあります。
コンテンツの色: ボタンテキストの色を選択します。
背景色: ボタンの背景色を選択します。
カートに追加ボタンにホバー状態を追加すると、ライブビューでよりアクティブになり、アクションへの誘導効果が高まります。これを行うには、ボタンをクリックし、Stylingタブに移動して「Mouse over state」に切り替え、コンテンツの色と背景色の変更を開始します。
商品のスティッキーな「カートに追加」ボタンを作成するには、「カートに追加」ボタン要素を含むセクションを作成し、そのセクションの「Sticky Top」機能を有効にする必要があります。以下のビデオで詳細を確認できます。
ノーマル状態とホバー状態では、コンテンツと背景に対照的な色を使用して、ボタンを際立たせます。
視認性とユーザーの注意を引くために、カートに追加ボタンを1行に収めます。
1. 商品のカートに追加とは何ですか?
カートに追加機能により、買い物客は購入したい商品をカートに保存し、買い物を続け、すべての希望アイテムを選択した後でチェックアウトプロセスを完了することができます。
2. カートに追加と注文の違いは何ですか?
カートは、買い物客が購入する予定の商品を一時的に保管、変更、または削除できる場所です。注文は、買い物客が選択を最終決定し、配送、配達、および支払い情報を提供した後の次のステップです。
3. マーケティングにおけるカートに追加率とは何ですか?
カートに追加率とは、セッションごとに少なくとも1つのアイテムをカートに追加した買い物客の割合です。
に関する詳細情報は、こちらをご覧ください。
については、こちらで詳しく説明しています。
に関する詳細は、こちらで確認できます。
については、こちらをご覧ください。