What is the Product Grid layout?
The various product grids that display around your store, such as the Featured Collection section, or your Collection page can be styled using controls found here.
Choose from options such as image shapes, spacing, gaps, borders, title and price layout and more!
- Open the Theme Editor, and click on Theme Settings.
- Scroll down to the Products tab to see the Product grid layout settings.
Canopy supports product labels on product grids, which you can see an example of below:
There is only space for one label to show at a time, so an order of priority is applied shown below:
- Sold out – shows when Shopify manages the inventory and customers cannot purchase out of stock items.
- Sale – shows if a product’s compare at price is set higher than its actual price.
- ‘X’ left in stock – only for items with a single variant.
- New In – shown for new products.
The theme can determine if a product is New In in one of three ways:
- Collection – will show when a product is in a collection with ‘new’ in the handle.
- Tag – add the tag ‘New’ to the product.
- Date – choose the number of days ago that the product was created.
This setting can manage the quantity controls on your product page, featured product section, and quick buy popup. If you choose Standard, the controls will always display a default quantity of one (1), and adding an item to your cart will increase the quantity by one (or whatever number is entered in the quantity box).
On the other hand, if you select Show quantity currently in cart the quantity controls will reflect the number of items currently in your cart. You can adjust the quantity in real-time by using the + and - buttons, and the Add to cart button will change to Remove from cart once the item is in your cart.
You can select from two convenient quick buy styles.
A magnifying glass circle icon appears over your product images when you hover over them:
An Add to cart button beneath the product lets you quickly add single-variant products to your cart. See the fennel bulb or nectarines product below:
If your product has variants, the button changes to Show options. A quick buy popup will appear on click, allowing the user to choose size, weight or color and add to cart.
Both options are designed to make your shopping experience more efficient and enjoyable. Choose the one that best fits your preferences and start enjoying the benefits of a streamlined checkout process.
How do I hide the Buy it now/dynamic checkout buttons?
Dynamic checkout buttons or "Buy it Now" show under the main add to cart button on the product page, quick buy or featured product and allow a customer to proceed directly to the checkout with just one item. Switch this feature off using the Buy buttons block settings. Refer to the Shopify article Adding and removing dynamic checkout buttons for more details.