カートメッセージのデザインをカスタマイズする

カートページに表示されるメッセージの色やタイトルをカスタマイズする方法を説明します。

カートページに表示されるカートメッセージのデザインは、Shopifyテーマエディタのアプリブロック「予約販売カートメッセージ」の設定で変更できます。タイトルの文言と、背景・枠線・タイトル・メッセージの色を指定できます。

  • Online Store 2.0対応のShopifyテーマだけで利用できます

  • テンプレート「カート」にだけ追加できます。カートドロワーやポップアップ形式のカートには追加できません

  • 有料プランで利用できます。旧ライトプランでも利用できます。無料プランではブロックを追加してもストアにメッセージは表示されません

  • デザインの設定はブロック単位です。予約販売ルールごとにデザインを変えることはできません

  • 表示する文言は予約販売ルールの「カートメッセージ」で設定します。このブロックで設定できるのはタイトルとデザインだけです

  • 枠線の太さは1pxで固定です。変更できるのは色だけです

  • カートに複数の予約商品が入っている場合、メッセージは段落として縦に並びます。同じ内容のメッセージは重複を除いて1つにまとめられます

(1) Shopify管理画面の「オンラインストア」→「テーマ」を開く

(2) 使用中のテーマの「カスタマイズ」を選択する

(3) テーマエディタ上部のテンプレート選択から「カート」を選択する

(4) 左側の一覧で「アプリ」の下にある「予約販売カートメッセージ」を選択する

ブロックがまだ無い場合は、「ブロックを追加」から「アプリ」タブを開いて追加してください。

(5) 右側に表示された設定項目を入力する

項目

説明

既定値

タイトル

カートメッセージの上部に表示する見出し。不要な場合は空欄にします

空欄

背景の色

メッセージ枠の内側の背景色

#FFFFFF

枠線の色

メッセージ枠の枠線の色

#7D7D7D

タイトルの色

タイトルの文字色

#6F7372

メッセージの色

メッセージ本文の文字色

#6F7372

(6) 「保存」を選択する

テーマエディタでは、カートが空でもデザインを確認できるように、赤い文字のデモ表示が出ます。表示される文言は次のとおりです。

状態

テーマエディタに表示される文言

有料プラン

ここにカートメッセージが表示されます。

無料プラン

現在のプランではこの機能をご利用いただけません。Light Plan以上にアップグレードしてください。

このデモ表示はテーマエディタでのみ表示され、ストアには表示されません。色や枠線の仕上がりを実際のメッセージで確認する場合は、カートメッセージを設定した予約商品をカートに入れて、カートページを開いてください。