I am using the advanced integration procedure to integrate a paypal button, but I would like to change the default image of the button with the one that includes also the credit card logos, e.g.:
<script src="https://www.paypalobjects.com/api/checkout.js"></script>
<div id="paypal-button"></div>
<script>
paypal.Button.render({
env: 'sandbox',
locale:'it_IT',
payment: function(resolve, reject) {
var CREATE_PAYMENT_URL = '/make-payment';
paypal.request.post(CREATE_PAYMENT_URL)
.then(function(data) { resolve(data.paymentID); })
.catch(function(err) { reject(err); });
},
style: {
size: 'medium',
color: 'blue',
shape: 'rect'
},
onAuthorize: function(data, actions) {
console.log("done")
}
}, '#paypal-button');
</script>
By reading the documentation it seems that it is not possible to set an attribute to change the default paypal image. Any ideas?
Going forward, the integration requires that the button is rendered by PayPal -- this mean we can keep a consistently hi-resolution button across all devices, so the button looks sharp no matter what the display, including retina devices.
I'm part of the team that works on this button, so we can look into adding a variation which includes card logos. I think it'd be a useful addition.