Remove "Update Cart" button on mobile

Highlighted
New Member
4 0 0

Hi guys,

 

After a long search I couldn't find any information about my issue.

I'm trying to remove the "Update cart" button that is appearing only for mobile users on the checkout page.

 

I'm using Venture theme.

 

Screenshot : https://imgur.com/HP1dJ5m

It's the black button saying "METTRE A JOUR" sorry about that it's a french shop. It matches to "Update cart" tho !

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1200 118 304

Hey there, @JulesChvt 

 

Bo here from Shopify Support! 

 

That is a really interesting question. I was able to find a way to disable this button with some simple HTML. This tutorial is specific to an unedited version of the Venture, Version 9.0.0. We cannot guarantee results for themes that have been modified with custom coding and/or apps. We suggest hiring a Shopify Expert if you are not comfortable proceeding with the following tutorial, or wish to make any variations to this tutorial

  • Go to Online Store > Actions > Edit Code.
  • Open the Sections folder > cart-template.liquid.
  • Find the following code, it should be on line 98: 
            <button type="submit" name="update" class="btn--secondary update-cart">{{ 'cart.general.update' | t }}</button>

Replace it with:

   {% comment %}         <button type="submit" name="update" class="btn--secondary update-cart">{{ 'cart.general.update' | t }}</button> {% endcomment %}
  • Click Save. 

Let me know how this goes and if there is anything else I can assist you with, I'm happy to help!

 

All the Best,

Bo

Bo - Social Care @ 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 the Shopify Help Center or the Shopify Blog

1 Like
Highlighted
New Member
4 0 0

Thank you Bo, it works just fine !

Can I be extra picky and ask if there is a way to also remove the order amount that is showing on the screen shot ? 

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1200 118 304

Hey again, 

 

Just to clarify, why are you looking to get rid of this? This amount is the sum of the amount in the cart. Once this is removed your customer will not be able to check the total cost of their cart until the checkout. 

 

To do this you will need to look for this like, it should be line 78:

           <p class="h3 cart__subtotal" id="CartSubtotal"><span class="wh-original-cart-total"><span class='wh-original-price'>{{ cart.total_price | money }}</span></span><span class="wh-cart-total"></span><div class="additional-notes"><span class="wh-minimums-note"></span><span class="wh-extra-note"></span></div></p> 

You will replace this line with:

{% comment %}            <p class="h3 cart__subtotal" id="CartSubtotal"><span class="wh-original-cart-total"><span class='wh-original-price'>{{ cart.total_price | money }}</span></span><span class="wh-cart-total"></span><div class="additional-notes"><span class="wh-minimums-note"></span><span class="wh-extra-note"></span></div></p>  {% endcomment %}

Let me know how this goes and if there is anything else I can assist you with, I'm happy to help!

 

All the Best,

Bo

 

Bo - Social Care @ 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 the Shopify Help Center or the Shopify Blog

0 Likes
Highlighted
Shopify Partner
4 0 1

Hello Bo,

 

This line doesn`t seem to exist in that form in the Debut theme. Can you please tell me how to find it there? That would be amazing!

 

Cheers,

Fabian

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1200 118 304

Hey there, @Chrisfab 

 

That sounds about right, the Venture theme would be built somewhat differently! I would recommend creating a new post regarding this in the Design Forum to get more eyes on this. You can tag me in your post and I will get our themes team to look into it. We try to keep these threads as clean as possible so we would not want to add a tutorial for another theme under the same thread. 

 

All the Best,

Bo

Bo - Social Care @ 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 the Shopify Help Center or the Shopify Blog

0 Likes
Highlighted
New Member
1 0 1

thank you 

1 Like
Highlighted
New Member
1 0 0

Hi, I also had this issue.  I think it's due to some styling which is designed to hide the 'Update cart' button when JavaScript is enabled, being overridden by the styling for the mobile site.  I have limited experience with Shopify, but would be slightly wary of commenting out the button completely, because it could mean users who don't have JavaScript enabled wouldn't see the 'Update cart' button so would have no way of updating the total amount if they e.g. increased the quantity of an item.

I managed to hide the button on the mobile layout with JavaScript enabled by changing the `theme.scss.liquid` file around the `.update-cart` definition from

.update-cart {
  display: none;

  .no-js & {
    display: inline-block;
  }
}

to

.cart__buttons .update-cart,
.update-cart {
  display: none;

  .no-js & {
    display: inline-block;
  }
}

i.e. adding `.cart__buttons .update-cart,` above the definition.  If you test this, you can see the button re-appearing if you disable JavaScript.  I'm sure there's a nicer way of doing it, but hopefully this might help someone!

0 Likes