Hello,
I would like to use Shopify script API in order to hide a certain payment method based on the user’s selection of the shipping method.
I would apperciaite any help.
From the API doc it doesn’t appear possible as there is no indication in the Cart object of the selected shipping method and the Payment scripts only doesn’t add any reference to shipping.
@BradKrane I was able to do it through liquid and some javascript, it’s pretty stable and working fine.
@fullyfilmy a customers chosen shipping_rates ,or cart attributes are accessible in payment scripts so you would need to use javascript in checkout.liquid to hide/show payment methods
https://shopify.dev/docs/themes/liquid/reference/objects/checkout#checkout-shipping_method
https://shopify.dev/tutorials/develop-theme-layouts-best-practices
@PA I am trying to input the below in my checkout.liquid template - would you be able to help point out where I am getting this wrong ?
Input.shipping_method.each do |shipping_method|
next unless shipping_method.title == “Prepaid Payment”
Output.payment_gateways = Input.payment_gateways.delete_if do |payment_gateway|
payment_gateway.name == “COD - Cash on Delivery”
end
end
could you please share the steps as how did you do it? We are trying to the same for our store but no luck. Thanks in advance.
Hello can you pls help me on how you did it? @josephraphael
hi @PaulNewton can you help me pls?
You require to have ShopifyPlus so that you can access the “checkout.liquid” file.
My previous response had a typo and I cannot edit it now:
a customers chosen shipping_rates ,or cart attributes are accessible in payment
that should be “are NOT accessible” for that information
@greysiweb There’s no direct method for message passing between the different types of checkout-scripts(line items, shipping, payments).
So payments doesn’t know what shipping method is selected in an obvious way.
The primary route is by modifying checkout.liquid using javascript to hide payment methods.
Always make sure to roll out such a change in increments and with monitoring.
If this is a business complication you should let the MSM for that Plus store know some sort of state-mgmt or message passing between script types is needed so merchants can avoid having to modify checkout.liquid
Otherwise alternatives gets into advanced work arounds using OTHER information as a message passing system such as customer tags , discount amounts(not sure if shipping discounts can be used for this), trying to use things like utility products but that would often mean modifying checkout.liquid anyway so it’s moot for something like this I think.
Hello! I am in Shopify plus and have Script editor app. Please help!
you can do it in javascript by targeting the index of class
(function() {
var sourceEl = document.getElementsByClassName('review-block__content')[1];;
if (sourceEl.textContent.includes('Pick up'))
{
document.getElementsByClassName('radio-wrapper content-box__row')[2].style.display = "none";
}
})();
Can you say how?
You really shouldn’t use Script API to hide payment methods. There are more modern Function API is offered by Shopify now. If custom coding is expensive for you, you can utilize PayRules: Hide Payment Methods app to hide payment methods at Shopify checkout page.
Here is a screenshot where Cash on Delivery payment method will be hidden at checkout if Standard shipping method is selected.
