Changing credit card logos under the payment method on checkout

Last updated

First off, here are the images of credit card logos:  

Discover: https://sassme.ecwid.com/static/v1/icons/discover.svg

Mastercard: https://sassme.ecwid.com/static/v1/icons/mastercard.svg

Amex: https://sassme.ecwid.com/static/v1/icons/amex.svg

Visa: https://sassme.ecwid.com/static/v1/icons/visa.svg

Next step is to add it to Ecwid. Upload the image to your site. Then add the following custom CSS rules


div.ecwid-PaymentMethodsBlock-PaymentOption div.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock img {
display:none;
}

div.ecwid-PaymentMethodsBlock-PaymentOption div.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock { 
background-image: url(https://example.com/your_image.jpg);
background-repeat: no-repeat;
margin: 0px 18px; 
height: 250px;
width: 230px;
}

where https://example.com/your_image.jpg should be replaced with actual URL to your image.

Back to top
Has the article answered your question?

Awesome! Thanks for your feedback!

Please send us that question. We will be happy to help by email.

Send a message