Big Cartel Theme Support

How do I change the payment icons on the Cart page?

How do I change the payment icons on the Cart page?

The payment icons displayed on your Cart page can be easily set via custom CSS. The default CSS is as follows:

/* Payment icons */
i.paypal {
    display: inline-block;
}
i.stripe {
    display: none;
}
i.visa {
    display: inline-block;
}
i.mastercard {
    display: inline-block;
}
i.amex {
    display: inline-block;
}
i.discover {
    display: none;
}

To change which payment icons are displayed, navigate to your custom style coding area - see Where do I add custom style code? - paste in the above CSS code and then edit it to your preference. Each item can have either the attribute display: none; or display: inline-block;

For example, to hide the PayPal icon and display the Stripe icon, our CSS would be:

/* Payment icons */
i.paypal {
    display: none;
}
i.stripe {
    display: inline-block;
}
i.visa {
    display: inline-block;
}
i.mastercard {
    display: inline-block;
}
i.amex {
    display: inline-block;
}
i.discover {
    display: none;
}

Click the Done and Save buttons to apply your changes.

Hide all of the icons

If you wish to hide all of the icons, and the “The Best Security For Your Payment” text, you do not need to use the above CSS. Instead, you can use the much more concise:

/* Hide Cart page payment icons */
.secure-payment {
    display: none;
}

AarcadeHow do I change the payment icons on the Cart page?