Discussing Shopify Functions development, deployment, and usage in Shopify apps.
Hi everyone,
I am using a Cart Transform Shopify Function to create customized bundles. In the index.js file I return a merge operation (docs) with the image tag:
merge : { cartLines : [...], ... title : "Super Bundle", image : { url : "https://via.placeholder.com/600/616e4b" }, }
The merge works and the provided image url is displayed in the Checkout page. But neither the title nor the image is visible in the cart on the shop page. Is it supposed to only work like this, or do I need to add something else to make it work?
Changing the image in the parentVariant is not an option since I need it to be automated depending on an input of a customized product.
According to this table the customized bundles are "displayed as grouped in cart and checkout". For me they are displayed as grouped but without the provided image or title. Unfortunately, I can't find a tutorial that includes a screenshot of a cart with a customized bundle (while using the image property).
Any help will be helpful!
Martin
Hi Ioio,
It sounds like you might need to be making changes to the actual theme code of the cart (likely a section file with Liquid code for rendering line item data). When you add non-bundled products to the cart are their images/ titles appearing?
Liam | Developer Advocate @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit Shopify.dev or the Shopify Web Design and Development Blog
Thank you for the reply. Yes, so far I am using the dawn theme (updated to version 11) and it shows non-bundled products in the cart just fine. Just to be clear: It also shows the default image (and title) of the bundles 'parentVariant' if a bundle is merged. I just can't change this image (and title) to my customized values in any carts view.
I added a custom liquid section just to see the stored properties
{{ cart.items.first | json }}
but it does seem like neither my custom image url nor my custom title do appear there. Also I can't find the item_components property in the displayed json either (but I know it exists) - but that's less important for my problem.
Was this ever solved? I'm also having the same issue. The custom bundle title and image as specified in the Shopify Function appears in checkout but not in cart. The cart only shows the parent bundle product's default title and image.
Based on @ioio 's example, the title "Super Bundle" should be overriding the default title of the parent product. In my liquid code I tried line_item.title, line_item.product.title, and line_item.variant.title. None of them are displaying "Super Bundle". They all just work as if the product were a regular non-bundle product.
What is the correct liquid code to display the custom bundle title and image?? @Liam
Unfortunately, I didn't find a way to achieve this either.
The only thing I have been able to access were the originial item's properties inside a bundle via
{%- for item in cart.items -%}
{%- assign first_item_in_bundle = item.item_components.first | default: item -%}
In my specific case, it was enough to use the title of the first product inside the bundle, but I wish Shopify would provide a way to see the same bundle in the cart as in the checkout.
Was this ever solved? I'm also having the same issue
Having this issue as well. For context, I'm testing this on a development preview store.