Payment Icons Under Add to Cart in Product Page

[StoreHelpNeeded]

Hello guys,

Can you help me add payment icons as they are in my footer under the add to cart button on my product page? I only want those to appear centered under the button: Visa, Mastercard, Amex, Apple Pay, Google Pay & Shopify Pay.

Website: shopcutify.com/blender

Thank you! Any help is appreciated!!

[BSSCommerce-HDL]

Hi @StoreHelpNeeded, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert the below code to file -> Save

{% if template.name == 'product' %}
<script>
   let orginal_payment = document.querySelector('.inline-list.payment-icons.site-footer__payment-icons');
   let atc = document.querySelector('.new-form-atc.addCart');
   if(orginal_payment && atc) {
      let clone_payment = orginal_payment.cloneNode(true);
      atc.insertAdjacentElement('afterend', clone_payment);
   }
</script>
{% endif %}

Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[StoreHelpNeeded]

Can you please tell me where exactly I need to paste it? I am not getting the same results as you. At the bottom of the theme.liquid page?

Thank you

[BSSCommerce-HDL]

Hi @StoreHelpNeeded, Can you kindly share the details theme.liquid of your problem (screenshot/ record) with us? We will check it and suggest you a solution if possible.

[Noavi24]

Please, can you inform where exactly this code script should be paste on the file theme.liquid? At the very end of the page? 

[BSSCommerce-HDL]

Hi @Noavi24, Paste it before the close body tag  </body>

[Noavi24]

It worked but it is not centralized below the add to cart bottom.

[BSSCommerce-HDL]

Hi @Noavi24, Can you kindly share the details of your problem and store link with us? We will check it and suggest you a solution if possible.

[BSSCommerce-HDL · Accepted solution]

Hi @StoreHelpNeeded, 
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code
Step 2: Search file theme.liquid

Step 3: Insert the below code to file -> Save

{% if template.name == 'product' %}
<script>
   let orginal_payment = document.querySelector('.inline-list.payment-icons.site-footer__payment-icons');
   let atc = document.querySelector('button[type="submit"][name="add"]');
   if(orginal_payment && atc) {
      let clone_payment = orginal_payment.cloneNode(true);
      atc.insertAdjacentElement('afterend', clone_payment);
   }
</script>
{% endif %}

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍