Bundles allow for various layouts and configurations. This guide walks through how to customize the layout for the bundle page and product details.

Bundles layout options

One-page

Customers create their bundles on a single page. Ideal for simple bundles. You can configure the title, description, and subscription toggle.

Select Edit one-step layout to configure additional options for the one-step layout. You can add a dropdown forwhere customers can select their frequency, or a toggle that lets customers switch between subscription and one-time products. 

Multi-step

Customers go through multiple quick steps to build their bundles. This option is best for larger or more complex bundles. You can configure the step title, main title, and add descriptions for each step of the flow (box type, choose products, extra subscriptions, and review step). 

Select Edit multi-step layout to configure additional options for the multi-step layout. Add descriptions for each variant option and configure a title and description for each step of bundle creation for the customer.

Theme customization

The widget and page layout for customizable bundles can be updated in the Shopify theme editor. This can be accessed through the Shopify theme settings or by clicking Customize bundle layout on the Bundles page.

The color, text size, spacing, buttons, and product appearance of the Bundles Widget can be edited and additional theme sections can be added to the page. These edits will impact all bundles using the default recharge-bundle Shopify product template.

Further customizations can be made using CSS outlined in the Customizing the bundle widget.

Bundles translations

Use translations to update the bundles widget. 

Customize the Bundles page language

Update the verbiage on your Bundles page to match your brand's tone and wording. Update: 

• The name and description of the Bundle if you use the one-page layout
• The bundle description, step titles, and step descriptions if you use the multi-page layout 

Navigate to the merchant portal to update the Bundles page language:

1. Select Bundles from the Product dropdown navigation menu in the Recharge merchant portal.
2. Click on One-page layout or Multi-step layout depending on you Bundles' page layout under your Bundles product, and then Got it to open the editor. 
3. Click Edit one-step layout or Edit multi-step layout. 
4. Update the title and description.
   
5. Click Save and continue.
6. Review your layout setting, then click Save and continue to finalize your changes.

Store layout options

Default bundles options

• Choose a default variant to determine which variant is selected automatically on the page.
• Choose the default frequency option to display.

Add to cart behavior

Each bundle can be configured to:

• Send them to the cart page - Redirect the customer to the cart page which aligns with the standard add to cart functionality.
• Send them straight to the checkout - Bypass the cart page and redirect directly to the checkout.

Product layout options

Control how customers interact with your bundle. To access product layout options: 

1. Click Products, then select Bundles in your merchant portal. 

2. Go to your bundles settings by clicking the pencil icon.
   

3. Click Edit next to Layout: One-page under Additional settings.
   

4. Click the Edit settings dropdown to expand the Products in your bundle section. Note that these settings apply only to bundle contents and not add-ons. 
   

Product details popup

• The product details popup toggles the option for product detail information to be shown when a product is clicked in the bundle menu.
• This product details function provides more information about the bundle product. When enabled, a modal pops up once the product is clicked and displays the product description.
• Product details can be configured through the Shopify product editor by editing the product description.

Products with multiple variants

The Bundles widget offers configuration options for products with multiple variants to fit your needs. You can:

• Decide to always add the first variant to the bundle
• Provide customers the option to choose the variant they want
• Display variants as separate products and let customers choose multiple variants of all products

Tailor the variant experience by choosing to show both the product and variant name or just the variant name.

Displaying collections in your bundle

If your bundle uses multiple collections, you can control whether collections expand or collapse for customers.

• When disabled: All collections stay fully expanded, and customers cannot collapse them.
• When enabled: All collections start expanded. Behavior depends on whether you require customers to select a specific number of products from each collection (e.g. choose two products from collection X, three from collection Y):  
  • Collections with exact selection requirements: After a customer selects the required number of products from a collection, that collection collapses automatically. The next collection appears expanded.
  • Collections with no selection requirements: Collections stay expanded after a customer adds products. Customers must manually collapse collections. 

Filter groups

Create filter groups

Filter groups allow customers to find products based on product tags on the Bundles widget and filter the selection by that tag. You must have at least two tags configured to use filter groups.

1. Click Add a filter group.
2. Confirm that products have been tagged on Shopify.
3. Set a group name. This is what customers will see on the product page. 
4. Click add to select the tags to be used from the list.
5. Select if the results should match any tag or all tags:
   • Any tag - Will show all products matching one of the tags selected. For example, if the customer selects vegetarian and keto, they will see all products with either a vegetarian tag or a keto tag
   • All tags - Will only show products with all of the tags selected. For example, if the customer selects vegetarian and keto, they will only see products with a vegetarian and a keto tag.
6. Select Add filter name to add the group to the bundle product page.
7. Click Publish changes.

Assign a filter group to a bundle

Once you have created filter groups, you can assign them to a bundle. 

1. Select the bundle product you want to add a filter group to and click the pencil icon.
2. Click Layout: One-page.
3. Scroll down and locate the Products in your bundle section.
4. Click Edit settings to expand the section. 
5. In the Set up filters field, click Add a filter group.  
6. Locate your filter, click Add this group, and select Save.
7. Click Publish changes to publish the bundle.