When running an online store on Shopify, the cart page is a critical touchpoint that greatly influences customers' purchasing decisions. A well-customized cart page improves the customer experience and contributes to increased sales. This article explains in detail how to customize your cart page using Shopify apps, along with the benefits of doing so.
The blog article below introduces how to customize the "cart button" rather than the "cart page." Please take a look for reference.
Customizing the Cart Page with a Shopify Theme
This time, we'll introduce examples based on the Dawn theme (Dawn 15.0.0), which is used by many stores. If you're using a theme created by Shopify, such as Rise, Refresh, or Sense, the implementation is similar, so the settings in this chapter may work as-is. Please use them as a reference.
Changing the Cart Type
In the Dawn theme, you can choose the cart type (the behavior when the cart button is clicked) from the following three options.
- Page: Navigates to the cart page.
- Drawer: Displays a drawer cart from the right side of the screen.
- Notification popup: Displays a popup from the top right of the screen.
How to Change the Cart Type
- Go to Online Store > Themes
- Click "Customize" on the Shopify theme for which you want to change the cart type
- Click "Theme settings" on the left of the screen
- Change the cart type
- Click "Save"
Adding a Cart Note to the Cart
A cart note is a feature that lets customers enter special requests or instructions when adding products to their cart on an e-commerce site. The Dawn theme lets you display a cart note on both the cart page and the drawer cart.
How to Add a Cart Note to the Cart
- Go to Online Store > Themes
- Click "Customize" on the Shopify theme to which you want to add a cart note
- Click "Theme settings" on the left of the screen
- Check "Enable cart notes"
- Click "Save"
Displaying the Vendor in the Cart
The Dawn theme lets you display vendor information. This can be shown on both the cart page and the drawer cart.
How to Display the Vendor in the Cart
- Go to Online Store > Themes
- Click "Customize" on the Shopify theme for which you want to display the vendor
- Click "Theme settings" on the left of the screen
- Check "Show vendor"
- Click "Save"
Changing the Drawer Cart Color Scheme
The Dawn theme lets you change the color scheme of the drawer cart. Changing the color scheme of the cart page is covered later in "Changing the Cart Page Color Scheme."
How to Change the Drawer Cart Color Scheme
- Go to Online Store > Themes
- Click "Customize" on the Shopify theme for which you want to change the color scheme
- Click "Theme settings" on the left of the screen
- Change "Cart > Color scheme"
- Click "Save"
Adding a Section to the Cart Page
The Dawn theme lets you add section blocks to the cart page to display things such as a product list, blog list, or featured products.
How to Add a Section to the Cart Page
- Go to Online Store > Themes
- Click "Customize" on the Shopify theme to which you want to add a section block
- Select the "Cart" template from the select box at the top center of the screen
- Select "Sections" on the left of the screen
- Click "Add section"
- Select the section block you want to add
- Click "Save"
Changing the Cart Page Color Scheme
Just like the drawer cart, the Dawn theme lets you change the color scheme of the cart page as well. Changing the drawer cart color scheme was covered earlier in "Changing the Drawer Cart Color Scheme."
How to Change the Cart Page Color Scheme
- Go to Online Store > Themes
- Click "Customize" on the Shopify theme for which you want to change the color scheme
- Select the "Cart" template from the select box at the top center of the screen
- Select "Sections" on the left of the screen
- Select the block for which you want to change the color scheme
- Change the color scheme settings within the block
- Click "Save"
Customizing the Cart Page with Shopify Apps
Adding a Delivery Date/Time Selection Module to the Cart Page
A delivery date/time selection module is a module that lets users choose the date and time they want their package delivered. Adding a delivery date/time selection module to your Shopify cart page offers benefits such as the following.
- Improved purchasing experience (higher customer satisfaction)
- Reduced cart abandonment rate
- Reduced return risk
- Better control over shipment volume
A delivery date/time selection module can be easily added using a Shopify app. The blog article below introduces recommended delivery date/time selection apps. Please use it as a reference.
Adding a "Buy Later" Button to the Cart Page
A "Buy Later" button is a button (and feature) that lets users add products they don't plan to purchase right away to a "buy later" list. Displaying a Buy Later button on your Shopify cart page offers benefits such as the following.
- Helps prevent cart abandonment
- Can encourage add-on purchases
- Enables effective email marketing
- Makes it easy for users to access the products they want later
- Lets users add items to reach free shipping thresholds
A "Buy Later" button can be easily added using a Shopify app. The blog article below introduces recommended Save for Later apps. Please use it as a reference.
Displaying Recommended Products on the Cart Page
Displaying recommended products on the cart page can encourage add-on purchases and is expected to help increase sales. While it's possible to display recommended products using the method described earlier in "Adding a Section to the Cart Page," using a Shopify app makes it possible to deliver more accurate recommendations.
The blog article below introduces recommended product recommendation apps. Please use it as a reference.
Adding a Loyalty Points Feature to the Cart Page
Adding a loyalty points feature to the cart page helps make users aware that a loyalty program exists. Adopting a loyalty points feature can be expected to improve repeat purchase rates and lifetime value (LTV). The blog article below introduces recommended loyalty points apps. Please use it as a reference.
Displaying a Message Only When a Pre-Order Product Is in the Cart
There are cases where you may want to display a note explaining that regular products and pre-order products ship on different timelines when a pre-order product has been added to the cart. Using the Shopify app "RuffRuff 予約販売," you can display any message you like on the cart page whenever a pre-order product is in the cart.
A demo product is also available, so please try it out for yourself.
In Closing
Customizing your cart page significantly contributes to increasing your online store's sales and improving customer satisfaction. Use the customizations introduced in this article to help reduce cart abandonment, boost repeat purchase rates, and improve the customer's purchasing experience. It's important to choose the customizations best suited to each store's characteristics and customer needs, and to continuously measure and improve their effectiveness. Take advantage of Shopify's rich app ecosystem to keep evolving your cart page.
Finally, the blog article below introduces recommended Shopify apps in a variety of categories beyond cart page customization apps, including "customer acquisition," "sales growth," and "blog article enhancement." Find the Shopify apps best suited to your Shopify store!
