Pebble Theme
Pebble Theme
Theme Sections

Products bundle: Choose

3 min read
image

Create a customizable product bundle that lets customers mix and match items while enjoying a built-in discount.

This section only displays the bundle UI. To activate the actual discount at checkout, you must set it up in Shopify admin > Discounts.

How to add a Products bundle: Choose section to your Shopify store

  1. In the theme editor (Customize), click Add section.
  2. Select Products bundle: Choose section.
  3. Make necessary changes.
  4. Save.

How to customize a Products bundle: Choose section

Section settings

The section shows an Add bundle to cart button on the left of the bundled products list.

✅ Customers can pick the variant (e.g., size, color) before adding everything to their cart.

  • To change this button label, go to Actions > Edit default theme content.

General

SettingDescription
ProductsSelect products to include in the bundle section.
Minimum items to reach discountSet the minimum number of products required to unlock the discount.
Prevent duplicate products in the bundlePrevent customers from adding the same product multiple times in a bundle.

Layout

SettingDescription
ColumnsAdjust the number of product columns displayed.
Horizontal gapControl the horizontal spacing between product cards.
Vertical gapControl the vertical spacing between product cards.

Product cards

SettingDescription
Image ratioSet the aspect ratio of product images.
Text line limitLimit the number of lines shown for product titles.
image

Use global theme settings, follow the image ratio defined in Theme settings → Product cards.

Learn more: Product cards
image

Adapt to image size, keeping the original aspect ratio of the product image

image
image
image

Mobile layout

SettingDescription
Enable swipe on mobileAllow horizontal swipe interaction on mobile devices.
Mobile columnsSet the number of columns displayed on mobile.
Mobile horizontal gapAdjust horizontal spacing between items on mobile.
Mobile vertical gapAdjust vertical spacing between items on mobile.
image
image
image
Check out other section settings: Common settings available in most sections

Block settings

image

Use the Header block to create and customize the section’s heading and introductory content.

SettingDescription
AlignmentSet the header alignment: left, center, or right.
DevicesSwitch between desktop and mobile padding settings.
BottomAdjust the spacing below the header.

📦 Nested dynamic blocks

  • Heading – Add a main title
  • Subheading – Provide supporting text above or below the heading
  • Text – Include additional descriptions or details
  • Image – Display an image or icon
  • Button – Add a call-to-action
Learn more: Basic

📌 How to set up the discount

The theme only displays the bundle visually. To make the discount functional at checkout, follow these steps:

Create the discount in Shopify admin:

  1. Go to Shopify Admin > Discounts
  2. Click Create Discount
  3. Choose:
  • Type: Amount off products
  • Method: Automatic discount
  1. Set Discount value: e.g., 15%
  2. Under Applies to, select Specific products → Choose the products used in the section.
  3. Set Minimum quantity of items: Match the tier settings (e.g., 3 items minimum).
image
Last updated

Products bundle

Previous Page

Products highlight

Next Page

ON THIS PAGE

How to add a Products bundle: Choose section to your Shopify storeHow to customize a Products bundle: Choose sectionSection settingsGeneralLayoutProduct cardsMobile layoutBlock settings📌 How to set up the discount

Was this helpful?