Customize Mix and Match

This guide will help you learn how to customize mix and match bundles in your store when using BOGOS.

1. Content

These three checkboxes allow you to control which elements appear in your mix and match bundle offers, including:

• Show description: The bundle description text helps customers understand the offer details.

• Show discount price on each item: The reduced price for individual items within the bundle.

• Show discount amount on “Add to Cart” button: Displays the total savings amount on the button.

There are two main offer tier styles:

• Label: Show tiered offer details as simple text labels

• Progress: Display a progress bar that updates every time customers add more item

2. Widget Body

Before activating a bundle to attract customers and drive sales, customize the bundle with your own content and branding.

• Mix item: Text shown above each product in the bundle widget helps customers identify each offer

• Select variant text: Text shown to allow customers to choose their preference if a product has multiple variants.

• Select product text: Text shows how many products customers can select from the bundle.

• Select collection text: Text shows how many collections customers can select from.

• Out of stock text: Text is shown to alert customers if the product is unavailable.

3. Widget Footer

Design your bundle footer carefully to create an exceptional offer that motivates customers to take action.

• Total bundle price: Displayed below the selected items to show the total cost after applying discounts.

• Add bundle to cart: Button text appears when customers complete the selection process and are ready to add the bundle to their carts.

4. Color

BOGOS allows you to customize the colors of all elements with any of the 4 methods below:

• Choose a ready-made color set from the dropdown.

• Manually adjust each color field for all the available colors.

• Use AI Theme Detector to auto-generate a full widget color palette based on your store's branding.

• Contact the BOGOS support team to get help with color customization.

Click Save when done.

AI Theme Detector

BOGOS AI scans your online store and detects your brand's primary, secondary, and text colors, then generates a full widget color palette automatically.

Your store must NOT be password-protected for AI to access and detect your brand colors.

To edit the colors with BOGOS AI:

1. Click the pen icon.

1. Click Scan again to let BOGOS AI re-detect, or manually adjust the Primary color, Secondary color, or Text fields.

1. Click Apply for preview to apply the colors to the widget preview.

5. Add the Mix and Match to Other Pages Besides the Product Page

You can place the Mix and Match block on any page of your store, except the Checkout page.

Step 1: Navigate to your Online Stores in the Shopify navigation menu => choose Themes => Customize

Step 2: In the Shopify Theme Editor, go to the page where you want to add the Mix and Match block.

Then, on the left panel, scroll down, click Add section, choose Apps, find and select BOGOS: Mix and Match block.

Step 3: In the top-right panel, complete the setup fields

• Offer ID: Enter the ID of the Mix and match offer you want to display.

• Product show: Select a product from your store. All Mix and match offers linked to this product will be displayed on the current page.