How to Hide Some of the Variants from the Bundle Page

When setting up bundles in Bundly, you might find that certain product variants should only be visible on the Product Detail Page (PDP) and not on the bundle page. This can be easily achieved using custom CSS. This article will guide you through the steps to hide specific variants on the bundle page.

You can hide specific variants by adding custom CSS to your Shopify store. Below is an example of how to hide the “Small” variant.

.bundly__product_option_value:has(> [data-option-value="Small"]) {
   display: none;
}

To apply this CSS to your Shopify store, follow these steps:

• Go to your bundle configuration page.
• Navigate to Theme Editor.
• Disable the automatic redirect to the cart by unchecking the relevant setting.
• Add the above code to the Custom CSS section.
• Save the changes.

For a visual guide, you can watch a quick demo of the setup process here:

By following these steps, you can control the visibility of product variants on your bundle page, ensuring that only the relevant options are presented to your customers. This helps streamline the customer experience and keeps your bundle offerings clean and organized.