payment icons dont appear in the same line

payment icons dont appear in the same line

Jigz
Visitor
3 0 0

how do i get the payment icons in the same line and same spacing Screenshot 2024-05-28 155657.png

Replies 5 (5)
Jigz
Visitor
3 0 0

yes i think it was added to the coding.

niraj_patel
Shopify Partner
2391 516 515

Hello @Jigz 
Can you share store URL?

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com
Jigz
Visitor
3 0 0
niraj_patel
Shopify Partner
2391 516 515

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
 .ps-payment-icon {
     top: 10px;
     left: 10px;
 }
 .footer__column--info {
    display: flex;
    flex-direction: row !important;
    justify-content: center;
 }
</style>

techlyser_web_0-1716874570121.png

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

Dawood_Mirza_
Trailblazer
135 18 30

Hi @Jigz,

Log in to your Shopify Admin:

1. Navigate to Online Store:

2. In the left-hand sidebar, click on Online Store.
3. Access the Theme Editor:

4. Under the Themes section, locate your active theme.
5. Click on Actions and then select Edit code from the dropdown menu.
6. Locate the section-footer.css File:

7. In the Assets folder, find and click on section-footer.css. The file might also have a similar name depending on your theme (e.g., footer.css, theme-footer.css).
Edit the section-footer.css File:

Scroll to the bottom of the section-footer.css file.

Add the following CSS code at the very end of the file:

media screen and (min-width: 750px) {
    .footer__column--info {
        display: flex;
        padding-left: 0;
        padding-right: 0;
        align-items: baseline;
        flex-direction: row-reverse;
        justify-content: flex-start;
    }
}

Save Your changes

 

If it was helpful, Do give a like and mark it as a Solutions

BR

Dawood Mirza

Want to work with me - dawoodmirzabusiness@gmail.com
Don't forget to like and mark it as Solution if it was helpful to you.