Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

Payment icons customization

Payment icons customization

Skrill
Shopify Partner
17 1 6
Hi everyone, I'm developing a payment app for Shopify and I'm just wondering if we can display the payment method icons dynamically on the checkout page depending on the customer's country, e.g. only show VISA and Sofort for German customers. Is it possible to do this using the payment customization described here https://shopify.dev/docs/apps/checkout/payment-customizations ?
image.png
Replies 2 (2)

Liam
Community Manager
3108 344 910

Hi Skrill,

 

Yes, it's possible to customize the payment options available to customers during checkout based on certain conditions, working with the tutorial you've linked. You can create conditions based on various factors, one of which could be the customer's location or country. 

 

The Shopify Payment Customization API allows you to create custom functions that can manipulate the checkout process, including hiding, reordering, or renaming available payment methods.

However, do note that being able to show/hide specific payment methods depending on the customer's country might be dependent on the payment gateway's capabilities and what they support.

 

You'll also need to ensure that the logic in your payment customization function accounts for the country-specific conditions you want to implement.

 

Hope this helps!

Liam | Developer Advocate @ 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 Shopify.dev or the Shopify Web Design and Development Blog

Skrill
Shopify Partner
17 1 6

hi @Liam, thank you for your answer. The idea is not to dynamically add or remove payment methods but to display the icons dynamically (based on country) in the same payment method. The purpose of this is to sync the icons with the payment methods available on the offsite payment page.