Help adding payment icons in footer

Hello,

I am needing to add the payment icons in the footer of my website. I’ve tried following the tutorials and watched a view videos but I have been unsuccessful. I’m not using a them from the Shopify them store as that may be one issue. Is anyone able to assist me with this, I attached a screenshot and I can send my store URL and give you access if needed.

My site is currently password protected but I can send the link in a message

Thanks a lot!

Kindly provide your store’s URL.

Sure, it is www.forgiveoursins.co but it is password protected. Tried to message you.

Provide the password as well. I forgot to include that.

Yes, I received your e-mail. Messaging you now

Tried to email you but its back undeliverable when sending to your email address

You can add Payment Icons manually by editing your footer’s Liquid code.

  1. Go to Online Store > Themes
  2. Click … (three dots) next to your theme and select Edit Code
  3. Locate the file footer.liquid
  4. Insert the following code where you want the payment icons to appear:
  5. Save the changes and check if the icons appear on your store.

  {%- for type in shop.enabled_payment_types -%}
    - {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
    
  {%- endfor -%}

I hope this answer will be helpful

Thank you for that. So they do show up, but they show vertical.

Hi @corp41
Go to the Online Store > Theme > Customize > Footer Section > Payment Method

If my reply is helpful, kindly click like and mark it as an accepted solution.
Thanks!

@corp41 When you make your store live, the payment links will automatically show, but first, check this mark.

  1. Log in to your Shopify Admin Panel
  2. Go to: Online Store > Themes
  3. Find your current theme (e.g., Dawn theme).
  4. Click “Actions” and select “Edit Code
  5. In the left-hand sidebar, locate the “Assets” folder.
  6. CSS files (e.g., base.css, theme.css)
  7. Add the provided code at the end of the file.
.list-payment .icon-list {
    display: flex;
    align-items: center;
}

I added this code and it did not change the alignment

The theme I’m using is a paid theme called Luxury. Even though I’ve enabled the payment icon, the payment infrastructure icon isn’t showing up. Can you help me? I tried to fix it with the second code, but when I pasted it at the bottom, I got an error.