Don't know if you find a solution or not, but this works for me. <div id="paypal-button-container-50"></div>
<div id="paypal-button-container-100"></div>
<div id="paypal-button-container-150"></div>
<script>
var url = "https://www.paypal.com/sdk/js?client-id=xyz¤cy=GBP";
var myScript = document.createElement('script');
myScript.setAttribute('data-sdk-integration-source', 'button-factory');
myScrip.src=url;
document.head.appendChild(myScript);
function FirstPriceButton(){
paypal.Buttons({
style: {
shape: 'rect',
color: 'black',
layout: 'vertical',
label: 'paypal',
},
createOrder: function(data, actions) {
return actions.order.create({
purchase_units: [{
amount: {
value: '50'
}
}]
});
},
onApprove: function(data, actions) {
return actions.order.capture().then(function(details) {
alert('Transaction completed by ' + details.payer.name.given_name + '!');
});
}
}).render('#paypal-button-container-50');
};
function SeconPriceButton(){
paypal.Buttons({
style: {
shape: 'rect',
color: 'black',
layout: 'vertical',
label: 'paypal',
},
createOrder: function(data, actions) {
return actions.order.create({
purchase_units: [{
amount: {
value: '100'
}
}]
});
},
onApprove: function(data, actions) {
return actions.order.capture().then(function(details) {
alert('Transaction completed by ' + details.payer.name.given_name + '!');
});
}
}).render('#paypal-button-container-100');
};
function thirdPriceButton(){
paypal.Buttons({
style: {
shape: 'rect',
color: 'black',
layout: 'vertical',
label: 'paypal',
},
createOrder: function(data, actions) {
return actions.order.create({
purchase_units: [{
amount: {
value: '150'
}
}]
});
},
onApprove: function(data, actions) {
return actions.order.capture().then(function(details) {
alert('Transaction completed by ' + details.payer.name.given_name + '!');
});
}
}).render('#paypal-button-container-150');
}
myScript.onload = function () {
firstPriceButton();
secondPriceButton()
thirdPriceButton()
};
</script>
... View more