I am trying to add payment icons to the footer. I understand have to edit payment_icons.tpl and the styles.less. What I don't understand how do you know position of an image. How do you make another payments.png? Thanks
Why you cannot just create HTML block with your own images?
He wants to learn to do sprites ;)
Why you cannot just create HTML block with your own images?
For newcomers I understand this can be confusing. But yeah, just create an html block and put a nice image in it.
Or make a banner with payment icons and add a banner block filled with that banner.
Ur use payment font
https://paymentfont.com/#icons
or SVG vertors
gt metrics, google page speed are giving F now for poor image optimization
You can create an HTML block with content like the following:
And then add to your custom css style the following:
.my-payment-icons img {
width: 36px;
height: 36px;
display: inline-block;
}
You can replace the width and height values to whatever size you wish.
A good source for svg images is flaticon. Just google it and it will come up.