I just started using the ecommerce feature and love it. However, I’d really like to make the cart button conditionally visible. I see that I can hide the quantity if the cart is empty but I want to hide the button altogether. No point in showing it if they haven’t added anything to a cart to begin with.
I assume this can be done with a little JS, right? Outside of reading the quantity value, are there any other options? What about showing cart if add to cart is executed somewhere on the page?
Good news I’ve discovered it. Select the cart ‘button’, go into the Element Settings panel. Under Conditional Visibility, add a condition where ‘quantity is greater than zero’.
Note: When in design mode or preview mode, the condition appears to pull the ‘quantity #’ from the number of products you have in your ecommerce products list, regardless of whether your cart is empty or not. It’s only in the published website the cart visibility condition correctly pulls the quantity from the number of items in the cart. I’m not sure why this is the case, but at the end of the day it has worked.
So test it in your published website, not within Webflow’s design interface.
After adding conditional visibility, the empty cart will still show up on the screen for half a second creating an awkward page load. Any way to fix this?