Shopify bundles - render child variants

Hello,

I have the Shopify’s own bundle app which works well to our purpose. However I would like to list the products in the bundle under the description. I do not seem to figure out which variant I need to loop through etc to get the info of the products in the bundle.

Could someone help :slightly_smiling_face:

Hi @PK2023

To display the child variants of products within a Shopify bundle under the product description, you need to retrieve and loop through the bundle’s components. Here’s how you can approach this:

Step 1: Check Your Bundle App’s Documentation

Shopify’s native bundle app (or a third-party app you’re using) should provide details on how to fetch the products and variants included in a bundle. Most apps store this information as metafields or line item properties. You’ll need to access this data through Liquid.

Step 2: Access the Bundle Data in Liquid

Here’s an example Liquid code snippet to help you loop through the child products (and their variants) in the bundle:

{% if product.metafields.bundle_components %}

Products Included in This Bundle:

    {% for component in product.metafields.bundle_components.value %}

  • {{ component.product.title }}

    {% if component.variant %}

    Variant: {{ component.variant.title }}

    {% endif %}

    Quantity: {{ component.quantity }}

  • {% endfor %}

{% else %}

No products found in this bundle.

{% endif %}

**Explanation:**1. product.metafields.bundle_components: This checks for the bundle’s child product details stored in the metafields.

  1. component.product.title and component.variant.title: These lines display the product and variant names.
  2. component.quantity: Shows the quantity of the child product in the bundle.

Step 3: Add This Code to Your Theme- Go to your Shopify admin: Online Store > Themes > Customize.

  • Find the product page template and insert this code in the section where you want the child products to appear.

Step 4: Test the Output

Preview a product bundle to ensure the child products display correctly. If nothing shows up, double-check:

  • The metafields’ namespace and key (consult the bundle app’s documentation for the exact format).
  • Whether the product includes the metafield data.

Note:

If you’re using a third-party bundle app instead of Shopify’s native solution, the metafield key or access method might differ. For apps like Bundler, PickyStory, or Bundle Builder, consult their integration guides for specifics.

If you’re still stuck, feel free to share more details about the app or your current setup. I’m happy to help further!

Best regards,
Daisy