How to show Klarna second in the payments accepted in footer

Store Design
, , ,

Topic summary

A user wants to reposition the Klarna payment badge in their Shopify store footer to appear between the Afterpay and American Express symbols.

Current situation:

  • The footer displays payment method icons
  • Klarna badge needs to be moved to a specific position (shown via screenshot)
  • User provided their existing footer.liquid code

Solution provided:

  • Another community member offered a code modification
  • The solution involves changing the footer.liquid file to reorder payment type icons
  • Specific code snippet was shared to adjust the payment methods array and icon rendering order

Status: A potential solution has been offered but no confirmation yet on whether it resolved the issue. This is a theme customization requiring Liquid template editing.

Summarized with AI on November 23. AI used: claude-sonnet-4-5-20250929.
1

Hey everyone,

How do I move the “Klarna” badge in my footer in-between the Afterpay symbol and the Amex symbol in the footer?

I’ve attached a screenshot with a red arrow where I want the symbol moved to.

Footer.png
Footer.png840×351 9.21 KB

Please see my current footer.liquid code:

{%- if section.settings.payment_enable -%}
{{ 'sections.footer.payment' | t }}

    {% assign enabled_payment_types = “afterpay” | concat: shop.enabled_payment_types %}
    {% for type in enabled_payment_types %}

  • {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
    • {%- endfor -%}
  • {{ "klarna" | payment_type_svg_tag: class: 'icon icon--full-color' }}
{%- endif -%}
2

Hi @meeko ,

Please change all code:


{%- if section.settings.payment_enable -%}

{{ 'sections.footer.payment' | t }}

{% assign enabled_payment_types = "afterpay" | concat: shop.enabled_payment_types %}
{% for type in enabled_payment_types %}

{% if type == 'american_express' %}
- {{ "klarna" | payment_type_svg_tag: class: 'icon icon--full-color' }}

{% endif %}
- {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}

{%- endfor -%}

{%- endif -%}

Hope it helps!