Payment Icons - Zip Payment Icon - adding space

Solved
Dremy
Tourist
3 0 0

Hi All!

 

I added zip payment icon to our page and realized that it was a bit inconsistent with the other icons.

 

We managed to fix the size but the space between the Zip and Visa is a bit too close compared to the others.

Need a bit of code to fix the spacing, anyone keen and able to help?

 

Template: Brooklyn

Website: https://dremyandco.com/

Payment Icons in the footer

 

 

Accepted Solution (1)

Accepted Solutions
KetanKumar
Shopify Partner
24919 2497 9030

This is an accepted solution.

@Dremy 

yes, please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.site-footer__payment-icons li + a {
    margin-left: 7.5px;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Replies 3 (3)
KetanKumar
Shopify Partner
24919 2497 9030

This is an accepted solution.

@Dremy 

yes, please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.site-footer__payment-icons li + a {
    margin-left: 7.5px;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Dremy
Tourist
3 0 0
Dremy
Tourist
3 0 0

@KetanKumar  - While I have you, just 2 more questions:

 

AfterPay Payment Icon - adding space

 

Added AfterPay Payment Icon and it looks like my code does not respect the margin. The code is the same as ZIP but with a different SRC.

 

ZIP Logo on Payment Page

 

Also, do you know if there is an easy way to add the ZIP Logo to the Payment Page.

 

  1. Specifically, if you navigate to the Payment Page >
  2. Under Payment you will find options >
  3. If you compare Paypal and AfterPay with ZIP >
  4. You will find that Paypal and AfterPay are represented by logos >
  5. As opposed to ZIP which is text 

Screenshot attached:

Dremy_0-1637915524977.png