Re: Remove Express Checkout from Dawn Theme

Solved

How to remove Express Checkout from Dawn theme's checkout page?

melimiya
Excursionist
29 4 6

I've been trying to remove the "Express Checkout" section from the Dawn theme's checkout page. I used this code:

 

{% if additional_checkout_buttons %}
<div class="additional_checkout_buttons">{{ content_for_additional_checkout_buttons }}</div>
{% endif %}

 

and

 

.additional_checkout_buttons{
display:none !important;
}

 

Which worked at removing the Express Checkout from the checkout page, but it brought back the Dynamic Checkout buttons below the "Proceed to Checkout" button in my cart.

 

I'd like to know how to remove both the "Express Checkout" section from the cart page while keeping the Dynamic Checkout buttons invisible as well.

 

Website: https://kittie-treats.com

Express Checkout.png

Accepted Solution (1)

melimiya
Excursionist
29 4 6

This is an accepted solution.

Oh, I figured out that I was supposed to put the

 

.additional_checkout_buttons{
display:none !important;
}

 

code in the component-cart-notification.css instead of the base.css.

 

And I put this code:

 

{% if additional_checkout_buttons %}
<div class="additional_checkout_buttons">{{ content_for_additional_checkout_buttons }}</div>
{% endif %}

 

in the main-cart-footer.liquid after this part:

 

<div><button type="submit" style="width: 100%" id="checkout" class="cart__checkout-button button" name="checkout"{% if cart == empty %} disabled{% endif %} form="cart">
{{ 'sections.cart.checkout' | t }}
</button>


Now it works! 

View solution in original post

Replies 8 (8)

melimiya
Excursionist
29 4 6

This is an accepted solution.

Oh, I figured out that I was supposed to put the

 

.additional_checkout_buttons{
display:none !important;
}

 

code in the component-cart-notification.css instead of the base.css.

 

And I put this code:

 

{% if additional_checkout_buttons %}
<div class="additional_checkout_buttons">{{ content_for_additional_checkout_buttons }}</div>
{% endif %}

 

in the main-cart-footer.liquid after this part:

 

<div><button type="submit" style="width: 100%" id="checkout" class="cart__checkout-button button" name="checkout"{% if cart == empty %} disabled{% endif %} form="cart">
{{ 'sections.cart.checkout' | t }}
</button>


Now it works! 

King-Kang
Trailblazer
148 8 77

Well done kudos to you 😄

IGOONactivewear
Visitor
1 0 0

Hi Melimiya,

 

Unfortunately for me this didn't work. Would you mind sharing a screenshot of your code or something? I followed exactly your steps, but no result 😞

porakiet
Visitor
1 0 0

could you please rephrase this one more time.this didnt work on my end.

fwegberts1
Tourist
8 0 11

@mel 

 

I was looking at your store but i still see the express checkout buttons in the first step of the checkout?

gredondo
Shopify Partner
3 0 0

This does not work. Shopify disabled this "solution" sometime since this was posted.

Alas the community forum is still full of false solutions.

AE9
Excursionist
13 0 2

hi

i am using focal theme , please help to remove these checkouts from checkout page , theme 2.0 focal

soulchild37
Shopify Partner
166 9 46

Hi Melimiya and all,

It seems like since mid of 2022,  the liquid / CSS code to hide the checkout button does not work anymore. To hide the express checkout payment method, you will need an app that utilize Shopify Functions. (a way for an app to communicate with Shopify to remove certain payment methods)

I have made an app to hide the Paypal Express (and other express checkout method like Apple Pay, Google Pay etc) on the top part of checkout page, and customer can still select Paypal method at the payment step.  

soulchild37_0-1692812725287.gif

 

soulchild37_1-1692812725287.png

 

 

The app is made using native Shopify Functions, thus it does not affect your store existing layout or functionality at all. You don't need to be on Shopify Plus plan to use the app, your store can be on any Shopify Plan.

The app name is Yagi Express Payment Hider (https://apps.shopify.com/yagi-express-payment-hider)

The app also have a workaround which you can hide the express checkout buttons for returning customers with saved address, but you will need to create a placeholder shipping rate for it to work, this will also work with one-page checkout.

Hope this can help!

Regards,

Axel Kee

Spent too much support time dealing with order cancellation request from customer? Wouldn't it be good if customer can cancel order on their own without bugging your support? Try out Cancellable app! https://apps.shopify.com/cancellable . I also write articles about store customization that can improve your customer shopping experience here : Yagi Software Blog