Footer Payment Icons

New Member
2 0 0

@PeanutButter This one is best for you I think - others are welcome to help me out!

I've got my store here but the payment icons aren't working correctly. Please see my code below in the footer-1.liquid file:


  <div class="t-center p-l-15 p-r-15">
    {% unless shop.enabled_payment_types == empty %}
	{% assign enabled_payment_types = 'visa,amex,paypal,apple_pay,google_pay' | remove: ' ' | split: 'apple_pay' %}
	{% for type in enabled_payment_types %}
    <a class="f-payment h-size2 icon fa fa-cc-{{ type }} fa-2x" aria-hidden="true"></a>
    {% endfor %}
    {% endunless %}
    <div class="t-center s-text7 p-t-20">


The problem is, it is only displaying the Visa, American  Express and PayPal icons at the footer of my website. I'm wanting to display 3 more but they aren't showing up. What could be causing this issue?

Screenshot 2021-07-12 at 16.16.25.png


Best Regards,





Add this code to make changes in your site.

.icon {
  width: 3.125em;
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;

{%- unless shop.enabled_payment_types == empty -%}
  <span class="visuallyhidden">Supported payment methods</span>

    {%- for type in shop.enabled_payment_types -%}
        {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
{% assign enabled_payment_types = 'visa,amex,paypal,apple_pay,google_pay' | remove: ' ' | split: 'apple_pay' %}
    {%- endfor -%}
{%- endunless -%}
If helpful, please Like and Accept Solution. if you Want to modify or Customize your theme, Hire us. or Want to know more. Read our Shopify Blogs.
Email us: Contact us: