Ecommerce Shopping Cart - "Empty Cart" or "Clear Cart" button

Design help Ecommerce
#1

Hello,

Does anyone have any idea of how clear all items in the shopping cart? I’m thinking of either a way to clear the users cache or a buttons that reloads the page and empties the shopping cart.

Any help would be great, thanks

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

#2

hey did you find out how to do this… I’ve been struggling with this

#3

Can any one help with doing this please?? I don’t mind custom code or anthing. I just want a feature where I can clear basket as I get more and more clients who keep asking why the clear basket option is not integrated in the shopping cart. Any help please? @QA_Brandon @rileyrichter

Remove all items from Shopping Cart
#4

:wave: I wrote a free plugin that clears the cart!

Just create a free account on the Flow Phantom Dashboard, authorize your site, and then follow the instructions to install the “Clear Cart” tool.

I added the plugin to my demo website Flow Phantom if you want to see what it looks like.

Let me know if there any issues with it, I’m happy to help!

2 Likes
#5

Amazing.

I kinda gave up on the feature. But that works perfectly when I tried the implementation. Thank you soo much, youre a lifesaver

1 Like
#6

Yes Thank you HEAPS! Lifesaver :wink:

1 Like
#7

Can i Implement this bootstrap shopping cart in my Shopify eCommerce website?

#8

Hi Andrew,

Is it possible to clear just one product?

Thanks

#9

Hi Andrew,

Is it possible to clear just one product?

Thanks

#10

Hey Sebastiao!

Just to make sure I understand you correctly, I wanted to clarify. When you say “one product” do you mean one item in the cart? If that’s the case Webflow has a built in “Remove” button in the cart component. As seen here: Cart Component .

Or do you mean all the items in the cart that fall under one product? For example clear all sizes under the product “t-shirt”?

1 Like
#11

Hey Andrew,

Thank you for your answer!

I needed to create a button that would remove products from the cart. Not a normal button, a button outside the cart that removes the selected product.

I leave here a video:
https://share.vidyard.com/watch/LE7kJmfhHD2VpN9JtrWJfj?

Share link:
https://preview.webflow.com/preview/consexto-proposal?utm_medium=preview_link&utm_source=designer&utm_content=consexto-proposal&preview=eece16756834c532762f1718ba94a0e1&pageId=5fb548ab1e2135271ac227fa&mode=preview

Thank you very much

#12

Can anyone help? It’s really important

#13

This doesn’t seem to work any longer. Not even on the demo site.

#14

Hey @tag915 !

I updated my original post (see solution above) to show you how to access the tool. I ended up just making it a free tool in the Flow Phantom Dashboard. If you have issues setting up let me know!

#15

If you are displaying the ‘delete’ link on each individual item in the cart, you could just click on all of them from Javascript. For example, this function does it using jQuery:

    function deleteCartProducts() {
        $("[data-wf-cart-action=remove-item]").each(function () {
            // click the underlaying html element, not the jquery object
            $(this)[0].click();
        });
    }
#16

Hey is there any updates as to how to implement the clear cart button on Webflow? went to the “Flow Phantom” link above and I couldn’t find the plugin after signing up.

#17

Where do I put this code exactly? Am I also supposed to create a button with a class that the JQuery targets as well? do I put this in the head, before body, or on the cart wrapper itself as an embedded code?

#18

Update: I ended up finding a solution at F*nsweet.

Mirror Click Events

This link pretty much gives you the rest of the details on how to do it. Just add the Trigger attribute to the “Clear” button that you will create and then add the target attribute to the “remove” button.

1 Like