What is the cart?
The cart is where your customers collect and review their selected products before proceeding to the checkout. The Beautify theme cart also provides upselling and conversion focused features such as a free shipping notice, a promotional image, a gift wrapping option and the ability to show other recommended and suggested products which the customer might wish to add to the cart.
Beautify offers both a cart drawer and cart page
How to set up the core cart features
The main cart settings are configured under Theme settings > Cart. These aspects of the cart behavior apply to both the Cart drawer and Cart page.
Steps
- Open the Theme editor and go to Theme settings > Cart.
- Use the Cart type setting to select Drawer or Page as the default cart experience for customers.
- The After adding to cart setting controls what action is taken after a customer adds something to their cart.
- Show the cart drawer: When a customer adds something to their cart, a drawer will slide in from the right hand side of the screen. The customer will remain on their current page, and will be able to review their cart within the drawer.
- Go to the cart page (with quantity check): When a customer adds something to their cart, the theme code will firstly verify if the selection is valid (e.g. they haven't added too many of that product to their cart). Following a successful check, the customer will be redirected to the cart page.
- Go to the cart page (JS disabled): When a customer adds something to their cart, they will immediately be directed to the cart page without any checks being performed. Shopify will however still perform these checks during the checkout process. This option may be best for app integration.
- Do nothing: When a customer adds something to their cart, the items will be added to the cart and the button will animate into a tick. Nothing further happens.
- Set the Continue shopping link. This link will be used on an empty and full cart.
- Add a Cart message if desired. This message is displayed under the items on the cart drawer and cart page.
- Select Show discounts in cart to allow customers to enter a discount code on the cart page or cart drawer.
Gift wrapping
The Beautify theme includes the option to offer gift wrapping. After the customer has selected to add gift wrap, the option to add a gift message is shown in the cart drawer and cart page. There is one gift message per order. It is separate from the order note. The gift wrap product will be excluded from Featured collection sections or Recommendations.
Steps
- Open the Theme editor and go to Theme settings > Cart.
- In the Gift wrapping settings, select Show gift wrapping to show a checkbox on the cart drawer and cart page, such that customers can choose to have their products gift wrapped.
- Select your preferred Gift wrap product.
- In the Shopify admin, assign this product to the gift-wrap product template provided with the theme.
- In the Shopify admin, assign the product to use the unlisted product status.
Note
The unlisted product status is ideal for gift wrap. An unlisted product has a page on the storefront, but it can be accessed only with the product's direct URL.
Recommended products
Recommended products can be shown in the cart drawer when it has items, the products shown vary based on the cart contents. Manage whether these are shown in Theme settings > Cart. A cart promotion can be shown with the recommended products.
Cart promotion
Shows an additional Image and Content on a promotion card with the Recommended products and Suggested products. In both cases, the Cart promotion will be displayed as the first card.
Note
Free shipping notice
Refer to the Free shipping guide for more information on setting up the Beautify free shipping notice.
Cart item cards
The theme includes optional color controls for cart item cards. These are the cards for each line item in the cart. To access these controls, navigate to Theme settings > Colors and select Use cart item color scheme. A distinct Cart item color scheme can then be selected for items in the cart. This can be used to highlight items in the cart and differentiate them from suggested or recommended products.
What is the cart drawer?
The Cart drawer is a convenient cart experience that allows customers to view and manage their shopping cart or checkout without leaving the current page. When activated, it slides out and displays key cart information such as the selected products, quantities, discounts and total price. This allows customers to quickly review and make changes to their cart, enhancing the overall shopping experience.
The cart drawer in Beautify also provides upselling and conversion focused features like a free shipping notice, a promotional image, a gift wrapping option and the ability to show other products which the customer might wish to add to the cart.
How to set up the cart drawer
The Cart drawer section can be found in the Overlay group area of the Theme editor.
Steps
- Open the Theme editor, go to the Overlay group and click on Cart drawer to edit the cart drawer settings.
- Show backorder text is used to indicate to customers that an item is currently out of stock but is will be shipped when it is back in stock. This setting only displays the text for products which have Shopify inventory tracking enabled, and have been set so they can be purchased when out of stock.
- Add Suggested products to show when the cart is empty. On desktop, these will be displayed in a panel next to the cart drawer and on mobile, they will be displayed at the bottom of the cart drawer.
- Select Stick cart summary on scroll to keep the cart summary visible at the bottom of the cart at all times. To show more cart items, consider turning this off.
- Select Show order note to allow customers to attach a note to the order.
- Show tax status and shipping policy link displays any tax status and shipping policy links in the cart drawer.
- Choose whether to Show checkout button. Switch this off if it is necessary for all customers to checkout via the cart page due to apps or other requirements.
- The option to include a Terms and conditions link. When added, additional checkout options will be hidden and customers will be required to check the box before proceeding to the checkout. They can go to the cart page, so if using the terms and conditions link in the cart drawer, be sure to ensure it is also set up on the cart page.
Tip
Suggested products
Suggested products are shown in the empty cart drawer. They are useful for cross-store promotions and where there is a desire to highlight a specific product or push a specific range of products. A Cart promotion can be shown with the suggested products.
Tip
What is the cart page?
The cart page is a dedicated page for customers to review and manage the items they have added to the shopping cart before proceeding to checkout. This page can be configured and customized like other pages of the store using the wide range of sections supplied in Beautify.
How to set up the cart page
Steps
- Open the Theme editor, and select Cart from the dropdown at the top.
- Click the Cart section on the left hand side to configure the settings for the cart page.
- Show backorder text is used to indicate to customers that an item is currently out of stock but is will be shipped when it is back in stock. This setting only displays the text for products which have Shopify inventory tracking enabled, and have been set so they can be purchased when out of stock.
- Select show order note to allow customers to attach a note to the order.
- Select a Panel color scheme which is used for the order summary panel.
- Show tax status and shipping policy link displays any tax status and shipping policy links in the cart drawer.
- Show additional checkout options is the setting used to enable Shopify's dynamic checkout buttons.
- The option to include a Terms and conditions link. When added, additional checkout options will be hidden and customers will be required to check the box before proceeding to the checkout.
Note
FAQs
How do I change my cart icon?
To change the cart icon, go to Header > Cart > Cart icon. There are four icon designs available - Makeup Bag, Bag, Basket and Cart.
Why is the cart drawer not opening when I add something to cart?
Check the settings in Theme settings > Cart. The Cart type should be set to Drawer and After adding to cart should be set to Show cart drawer.
How do I turn off recommended products in the cart drawer?
Go to Theme settings > Cart > Recommended products. There is one setting to manage the behavior and layout of these product recommendations in both the cart page and cart drawer. The selection of products is managed in the Shopify Search & Discovery App.
Can't find what you're looking for?
Our support staff are here to answer your queries, so don't hesitate to write to us!
Contact us