The Cart drawer section in Concept lets customers view and update their cart inside a slide-out drawer without leaving the current page.
It can show cart items, quantity controls, discounts, cart notes, shipping rate calculator, free shipping bar, gift wrapping, cart recommendations, empty cart links, and recently viewed products.
How to Set Up the Cart Drawer in Concept
STEPS:
Enable the Cart drawer
From your Shopify admin, go to Online Store > Themes.
Click Customize on the Concept theme.
Open Theme settings.
Open Cart.
Set Cart type to Drawer.
Choose the cart icon style in Cart icon.
Click Save.
Open the Cart drawer section
In the theme editor, open the Overlay group.
Open the Cart drawer section.
This section is part of the overlay group because it works as a hidden drawer. It does not appear as a normal visible section on the page.
Configure cart item display
Open the Cart drawer section settings.
Use Show vendor to display or hide the product vendor above each cart item title.
Cart items automatically display the product image, product title, selected variant options, line item properties, selling plan name, price, discounts, quantity selector, and remove button when available.
Click Save after making changes.
Configure cart footer actions
The Cart drawer footer can include additional actions for customers before checkout.
| Setting | Description |
|---|---|
| Show cart note | Shows a cart note button so customers can add instructions to the order. |
| Show shipping rates calculator | Shows a shipping calculator inside the drawer. |
| Allow discounts in cart | Shows a discount code form in the drawer. |
| Show view cart button | Shows a button linking to the full cart page. |
| Show checkout button | Shows the checkout button in the drawer. |
The cart note, shipping calculator, and discount form open inside small drawer modals.
Click Save after configuring the footer actions.
Set up the free shipping bar
Open the Free shipping bar settings inside the Cart drawer section.
Enable Show free shipping bar.
Enter the target amount in Free shipping minimum amount.
Use a number only for one currency:
100
For multiple currencies, enter each currency code with its amount:
USD:100, EUR:95, JPY:13000
The cart drawer will compare the current cart total with the matching currency amount and display the free shipping progress bar.
Click Save.
Set up cart recommendations
Open the Cart recommendations settings inside the Cart drawer section.
Enable Enable cart recommendations.
Configure the available settings:
| Setting | Description |
|---|---|
| Heading | Changes the recommendation title. |
| Product limit | Controls how many recommendation products can appear. |
| Show vendor | Shows or hides product vendor names. |
| Show price | Shows or hides product prices. |
| Product recommendations | Lets you manually select products to recommend. |
By default, Concept can show dynamic recommendations based on the products in the cart. If you select products in Product recommendations, those products can be used as the recommendation list.
Click Save.
Configure the empty cart content
Open the Empty cart recommendations settings inside the Cart drawer section.
Use Text to add a message that appears when the cart is empty.
Use Collection list to select collections customers can visit when there are no items in the cart.
If no collections are selected, the cart drawer will show a default Continue shopping link.
Click Save.
Enable recently viewed products
Open the Recently viewed products settings inside the Cart drawer section.
Enable Enable recently viewed products.
Configure the available settings:
| Setting | Description |
|---|---|
| Heading | Changes the tab title. |
| Product limit | Controls how many recently viewed products can appear. |
| Show vendor | Shows or hides product vendor names. |
| Show price | Shows or hides product prices. |
When enabled, the Cart drawer shows a second tab for recently viewed products.
Click Save.
Set up gift wrapping in the Cart drawer
Gift wrapping is controlled from Theme settings > Cart, not directly inside the Cart drawer section.
Open Theme settings.
Open Cart.
Select a product in Gift wrap product.
Configure the gift wrap options, such as Show gift note, Allow gift wrap per product, Gift wrap selection type, and Gift wrap settings info.
When a valid gift wrap product is selected and available, the Cart drawer will display the gift wrapping option automatically.
Click Save.
Preview the Cart drawer
Open your storefront.
Click the cart icon in the header.
Check the drawer layout, cart item display, quantity controls, note, discount form, shipping calculator, free shipping bar, recommendations, recently viewed tab, and checkout button.
Add products to the cart and test again.
Notes
- The Cart drawer is used only when Cart type is set to Drawer.
- The Cart drawer is part of the Overlay group.
- The Cart drawer does not appear on the cart page.
- Cart recommendations only appear when the cart is not empty.
- Recently viewed products appear in a separate tab when enabled.
- Gift wrapping appears only when a valid gift wrap product is selected in Theme settings > Cart.
- The shipping calculator uses Shopify shipping settings.
- The discount form lets customers apply discount codes from the drawer.
Troubleshooting
If the Cart drawer does not open, check the following:
- Theme settings > Cart > Cart type is set to Drawer.
- The Cart drawer section exists in the Overlay group.
- You are testing on a storefront page other than the cart page.
- The cart icon or cart trigger is visible in the header.
- The theme has been saved after changing the cart settings.
If the free shipping bar does not appear, check the following:
- Show free shipping bar is enabled.
- Free shipping minimum amount has a valid value.
- For multiple currencies, the format matches the current cart currency.
- Shopify shipping rates are configured correctly.
If cart recommendations do not appear, check the following:
- Enable cart recommendations is enabled.
- The cart contains at least one normal product.
- The cart does not only contain the gift wrap product.
- Dynamic recommendations may need time to become available.
- You can select products manually in Product recommendations.
If gift wrapping does not appear, check the following:
- A gift wrap product is selected in Theme settings > Cart.
- The gift wrap product is available.
- The gift wrap product has a purchasable variant.
- If needed, disable inventory tracking for the gift wrap product.
Need Further Assistance
If you encounter any issues or need additional help with your Concept theme, please reach out to our support team via our Ticket System for assistance within 8 hours.
Share:
How to Set Up the Age Verification Popup in Concept
How to Set Up the Collage Blog Posts Section in Concept