Hello, I’m making a bundle which should add items to the cart drawer without reloading after adding to cart. People told me the only way to update the drawer is to set the innerhtml of each object. I’m trying that, I got this code for handling add to cart: URL: This Home Metal Letter Wall Hanging Iron Home Decoration – InteriorGlows
// After adding items to cart, fetch the updated cart
const updatedCart = await fetch(window.Shopify.routes.root + 'cart.js');
const cartData = await updatedCart.json();
// Check the fetched cart data
console.log('Fetched Cart Data:', cartData);
// Update the cart drawer (example assuming you have a cart drawer element)
const cartDrawer = document.querySelector('.cart-drawer'); // Adjust selector if needed
const cartContent = document.querySelector('.drawer__contents'); // Adjust selector if needed
if (cartDrawer && cartContent) {
cartContent.innerHTML = ''; // Clear previous cart content
// Loop through the cart data and update the cart drawer (you may need to adjust this)
cartData.items.forEach(item => {
const cartItem = document.createElement('div');
cartItem.classList.add('cart-item');
console.log(item);
console.log(item.title);
cartItem.innerHTML = `
`;
cartContent.appendChild(cartItem);
And I got the code for my product image in the cart drawer from my cart-drawer.liquid (I ONLY REMOVED LIQUID CODE):
But it does not output the product image, but this:
Can anyone please tell me what I have done wrong? Thanks!