Help adding payment icons to footer - Brooklyn

barcongetta
New Member
1 0 0

I'm having trouble adding payment icons to the footer of my website. Any help would be appreciated.

Below is the URL for my website and my footer code.

URL: www.barcongetta.com

Template: Brooklyn

Code:

</div>
 {% if section.settings.footer_show_methods_of_payment %}
    
  <div class="footer-icons">        
    <ul class="inline-list payment-icons">
      {% if section.settings.payment_icon_1 != blank %}<li><a href="/cart"><img src="{{ section.settings.payment_icon_1 | img_url }}" alt="Visa" /></a></li>{% endif %}
      {% if section.settings.payment_icon_2 != blank %}<li><a href="/cart"><img src="{{ section.settings.payment_icon_2 | img_url }}" alt="MasterCard" /></a></li>{% endif %}
      {% if section.settings.payment_icon_3 != blank %}<li><a href="/cart"><img src="{{ section.settings.payment_icon_3 | img_url }}" alt="Amex" /></a></li>{% endif %}
      {% if section.settings.payment_icon_4 != blank %}<li><a href="/cart"><img src="{{ section.settings.payment_icon_4 | img_url }}" alt="Discover" /></a></li>{% endif %}
      {% if section.settings.payment_icon_5 != blank %}<li><a href="/cart"><img src="{{ section.settings.payment_icon_5 | img_url }}" alt="PayPal" /></a></li>{% endif %}
      {% if section.settings.payment_icon_6 != blank %}<li><a href="/cart"><img src="{{ section.settings.payment_icon_6 | img_url}}" alt="Google Wallet" /></a></li>{% endif %}            
    </ul> 
  </div> 
  {% endif %}
  </div>
</div>

 

Thanks!

Reply 1 (1)
LitExtension
Shopify Partner
4859 999 1073

Hi @barcongetta,

I checked and the code will ask you to add JSON for schema and upload icon in Customize. 

It will be very difficult so I suggest you change the code, it will work fine with Brooklyn theme.

Go to sections/footer.liquid and add code: https://i.imgur.com/gf4GqG4.png 

{%- unless shop.enabled_payment_types == empty -%}
<span class="visually-hidden">{{ 'general.payment.method' | t }}</span>
<ul class="inline-list payment-icons site-footer__payment-icons">
  {%- for type in shop.enabled_payment_types -%}
  <li>
	{{ type | payment_type_svg_tag: class: 'icon' }}
  </li>
  {%- endfor -%}
</ul>
{%- endunless -%}

Hope it helps!

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify