Shopifyカート画面のカスタマイズ方法は?ロゴ挿入や背景変更など目的別に紹介

Shopifyのカートやチェックアウト(購入)画面の文字やカラーは変更できます。せっかく他のページをオリジナルのカラーイメージで統一しても、チェックアウト画面だけ既存設定のままではもったいないですよね。

カートやチェックアウト画面もカスタマイズして、統一感のあるサイトに仕上げましょう。カスタマイズはとても簡単で、専門的な知識がなくても行えます。

カートやチェックアウト画面をカスタマイズしたいなと思っている方は、この記事を読みながら自社サイトの変更を試してみてください。

Shopifyのカートとは

Shopifyのカートとは、自社ECサイトのカートシステムです。自社ECサイトのカートシステムは、Amazonや楽天市場のようなモール型のカートではないので、デザインやポイント制度の有無など自由に設定ができます。

そもそも、ECサイトのカートとは、気になる商品を購入前に一度保存しておく機能のことで、カートに入れてから購入するかどうかを検討する顧客も少なくありません。カートに入れたものの、購入手続き(チェックアウト)に進まなかった状態をカゴ落ちといい、EC事業者としてはこのカゴ落ちをできるだけ少なくしたいところです。

カゴ落ちの原因はさまざまありますが、まずはわかりやすいカートやチェックアウト画面を作成することが重要でしょう。

カートのカスタマイズとは

Shopifyのカートやチェックアウト画面はカスタマイズができます。カスタマイズとはカート・チェックアウト画面のデザインを変更したり、配送オプションの入力を追加したりして、見た目や機能を変更させることです。

カスタマイズ方法には専門知識が不要なものから、コードの書き換えが必要となる高度なカスタマイズまでさまざまあります。Shopifyにはアプリの追加でカスタマイズできるものも多くありますので、以下の章で説明していきます。

【簡単】Shopifyカートのカスタマイズ方法

Shopifyでカスタマイズできる主な項目は以下の4つです。

  • チェックアウト画面にロゴを入れたり背景を変更したりしたい
  • ボタンのデザインを変えたい
  • カートに注文メモ機能をつけたい
  • カート画面に「買い物をつづける」ボタンを設置したい

ここでは、Shopify無料テーマのDawnを使用した設定例を紹介します。

チェックアウト画面にロゴを入れたり背景を変更したい

Shopifyの管理画面から設定を開き、左側のメニューでチェックアウトを選択します。画像のようにチェックアウトの設定画面が開くので、「チェックアウトをカスタマイズ」をクリックしましょう。

表示されるのは、テーマの編集画面です。左のメニューからチェックアウトの項目を選択すると、バナーやロゴの画像選択が表示されます。バナーとは、チェックアウト画面上部に表示される部分です。それぞれに画像を設定しましょう。

上記の画像がバナーとロゴを配置したイメージです。

入力フォームの背景も変更できます。バナーやロゴの変更と同じように画像の設定を行ったり、お好みのカラーを設定したりしましょう。背景画像にはShopifyが用意した無料の画像も選択できます。

ボタンのデザインを変えたい

チェックアウト画面のボタンの色を変更したいときは、左側メニューの色セクションでカラーの設定を行います。リンクやエラーメッセージのカラー変更も可能です。

文字の色を変更する際には、背景色とのバランスを考え見えにくくなっていないか注意しましょう。

カートに注文メモ機能をつけたい

成長する
EC事業を目指して。

Shopifyの導入・乗り換え、その他
様々なお悩みについても
お気軽にお問い合わせください。

full balance
full balance