Add Payment Options Under "Add to Cart" buttons

[MedsyCare]

Hi there,

I'd like to add the payment options which is located in the footer to also be visible just under the "Add to Cart" buttons on both the Homepage and Product Page, as per screenshot below.

Please help?

Thank you.

[PremierStores]

Hi, @MedsyCare: 

It needs to edit HTML code on your theme, we can help you with this task, feel free to send us an email and we will respond ASAP.

[MedsyCare]

Hi there,

Can you advise how I can add location of payment options please?

Thank you.

[PremierStores · Accepted solution]

Go to Themes, Actions->Edit code: At the sidebar scroll down and search the product-template file and paste the code below where you need (It changes depending on which theme are you using or if your theme was edited before)

<ul>
            {%- for type in shop.enabled_payment_types -%}
              <li>
                {{ type | payment_type_svg_tag: class: 'payment-icons__icon' }}
              </li>
            {%- endfor -%}
</ul>

[MedsyCare]

Sorted!

[ecopointzero]

Hello,

Just following your instructions, and they are appearing however the icons aren't formatting quite right. Would you be able to assist in having them sitting horizontally without bullet points?

Thank you!!

[Natalie_Latched]

I am having the same issue with them displaying vertically with bullet points using this code:

<ul>
            {%- for type in shop.enabled_payment_types -%}
              <li>
                {{ type | payment_type_svg_tag: class: 'payment-icons__icon' }}
              </li>
            {%- endfor -%}
</ul>

Was there any fix for this? 

[PremierStores]

Hi, @Natalie_Latched @ecopointzero 

The code may change according to the theme store.

[Otayfer]

This works for me 👍🏻.

One Question though:

On Mobile the Icons are aligned Left, on Desktop they are aligned centred.

How can I make the List also aligned to the left on desktop?

Thank you 😃

[martijn18]

When I use this code it makes the list vertically aligned, how can I adjust it such that the payment icons are horizontally aligned?