How to enable Apple Pay on Checkout Page with Stripe 4
-
Goog day all! I’ve just enabled Apple Pay on Stripe and successfully activated it(yay!). However, the “Buy with Apple Pay” button appears on the single products only. Is there a way to make this button appear on the checkout page?
-
Hi @oxygenc
The Payment Request button (Apple Pay on Safari) will only show on Product Pages and the Cart page, with the 4.0.0 update we removed it from the Checkout page.
The Payment Request button OR
Continue to checkout
button shows on the cart page as a choice for buyers. If they already choose to continue to checkout we don’t want to intrude them again with the same Payment Request button again when they have already decided not to use it.I hope that makes sense.
Hi @dougaitken,
I just read this post and I’m surprised that the button was removed from the checkout page. I’ve been working for days with my theme developer trying to work out why the button no longer shows up on the checkout page, I even started a topic about my issues with the button not showing up on my checkout page (https://www.ads-software.com/support/topic/update-broke-apple-pay/#post-9849174).
Anyway, I do understand the logic behind the decision to remove the Apple Pay button from the checkout page but, In WordPress customers are given the option to go directly to checkout, by-passing the cart page all together which would then limit their options on using Apple Pay because they wouldn’t even know it was an option.
Thanks!
@tjfisher The default behavior of WooCommerce is the following:
add a product to the cart -> Go to Cart(either from a link or from an automatic redirect)->Click Proceed to Checkout.
There is a setting to automatically redirect to the Cart page after a product has been added to the cart, but to change this to a different page(the Checkout page, perhaps), a filter would need to be used.
Is that the case here?
I have my online shop setup to have a combined cart/checkout page. This is a cleaner/faster checkout flow in my opinion, and requires one less page load. I was stumped for a while why I couldn’t get the payment request button showing up on this combined page until I read this thread.
Turns out the button will not show up with the [woocommerce_cart] section if [woocommerce_checkout] is on the same page. That is unfortunate.
I think it would be great to have an option in the Stripe plugin to choose where the payment request buttons show up. Ideally I would have the button show up at the top of the [woocommerce_checkout] section or the bottom of the [woocommerce_cart] section. I would not display them on my individual product pages, and not have the restriction of not showing it on the checkout page.
Maybe this request should be submitted to the plugin page on woocommerce.com? Or GitHub?
@roryaronson – you can use this
add_filter( 'wc_stripe_show_payment_request_on_checkout', '__return_true' );
Holy crap, thanks for the extremely fast help. That did the trick!
Now, can I do something like
add_filter( 'wc_stripe_show_payment_request_on_product_page', '__return_false' );
to hide the payment request buttons on the product pages?@roryaronson right idea but that is the wrong hook filter name. You need
wc_stripe_hide_payment_request_on_product_page
and return true.Got it, thanks! For anyone else looking at this thread, this the exact code I used to hide the payment request buttons on the product pages:
add_filter( 'wc_stripe_hide_payment_request_on_product_page', '__return_true' );
Both of these have been included in the Stripe extension documentation.
You can find them under these two FAQs
Can I hide the Payment Request button on the single product/cart pages?
Can I show the Payment Request button on the Checkout Page?Currently https://docs.woocommerce.com/document/stripe/#section-21 & https://docs.woocommerce.com/document/stripe/#section-22
I’m going to mark this as resolved.
Thanks
add_filter( ‘wc_stripe_hide_payment_request_on_product_page’, ‘__return_true’ );
this filter does not disable the payment button on cart page, despite the docs saying it does (https://docs.woocommerce.com/document/stripe/#section-21). I used CSS to just hide it on my cart page but it’s pretty annoying there is no hook to disable on cart page. it does work to remove on product pages.
Hi @eolis
That is correct and I should have caught that.
I’ve updated the docs to now list how to remove the Payment Request button from product page, cart page, and show on checkout page.
section-22 now links to the cart page code.
the new section-22 code causes a blank white screen when enabled. perhaps it needs a check that woo is initiated before running?
remove_action( ‘woocommerce_proceed_to_checkout’, array( WC_Stripe_Payment_Request::instance(), ‘display_payment_request_button_html’ ), 1 );
remove_action( ‘woocommerce_proceed_to_checkout’, array( WC_Stripe_Payment_Request::instance(), ‘display_payment_request_button_separator_html’ ), 2 );either way I cannot test these actions as they crash the page. (code from: https://docs.woocommerce.com/document/stripe/#section-22)
I guess before getting into this I should just ask: is there a way to add apple pay as a normal payment method? Optimally I would just have another payment method for apple pay appear beside paypal and credit cards in the regular Stripe checkout methods. I am sure others would appreciate the option as well; though it is understandable with apple integration and fingerprint ID jazz that it is separated from regular methods.
Continuing on: I need to remove the action on the checkout page and add it back at a different location (users need to fill out checkout details, as it affects the final order price: VAT exemption, tax rate edits, etc.). Having it at the top away from other payment methods means users will frequently skip filling out regular checkout information which adjusts the final price.
https://www.remicorson.com/woocommerce-apple-pay-move-buttons-below-customer-details/
This article looks promising and like the code should actually do something; but it sadly is not. I cannot seem to move the button to the action I desire which would be:
woocommerce_review_order_before_paymentis there something I am missing? I used:
add_filter( ‘wc_stripe_show_payment_request_on_checkout’, ‘__return_true’, 97 );
to add the form to checkout, then I used:// remove current instance of apple pay button
remove_action( ‘woocommerce_checkout_before_customer_details’, array( WC_Stripe_Apple_Pay::instance(), ‘display_apple_pay_button’ ), 95 );
remove_action( ‘woocommerce_checkout_before_customer_details’, array( WC_Stripe_Apple_Pay::instance(), ‘display_apple_pay_separator_html’ ), 96 );// Add Actions Back at desired location
add_action( ‘woocommerce_review_order_before_payment’, array( WC_Stripe_Apple_Pay::instance(), ‘display_apple_pay_button’ ), 98 );
add_action( ‘woocommerce_review_order_before_payment’, array( WC_Stripe_Apple_Pay::instance(), ‘display_apple_pay_separator_html’ ), 99 );which should de-register the rendered form, and inject it at the desired location. I just get it appearing at the same place; so it is as if nothing happened.
On my produt site :
https://photo-to-text.com/product/105048/?attribute_pa_custom=File+JPG
the button is not showing on checkout sectio, even the snippet
add_filter( ‘wc_stripe_hide_payment_request_on_product_page’, ‘__return_true’ );
is activated.
Any solution? Please, need help.
- The topic ‘How to enable Apple Pay on Checkout Page with Stripe 4’ is closed to new replies.