我正在建立一个网上商店,我想使用Paypals JS SDK。然而,我只想有贝宝按钮,没有像klarna这样的东西。我知道通过添加disable-funding=card,credit,bancontact
我可以删除选项,但我如何删除贝宝本身之外的所有内容?
如果空间是问题所在,请考虑使用style:layout:horizontal,它最多会在同一行显示PayPal以外的一种本地支付方式。
但是,如果您的用例必须只显示一个资金来源或选择特定的资金来源,请使用独立按钮。在";按钮组";选项卡。这是一个完整的片段,只有PayPal的资金来源
<!DOCTYPE html>
<html>
<head>
<!-- Meta tags for mobile and IE -->
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title> PayPal Standard Standalone Buttons | Server Integration (Frontend)</title>
<style> .paypal-buttons { margin-bottom:8px; } </style>
</head>
<body>
<div id="paypal-button-container" style="max-width:750px;"></div>
<!-- Include the PayPal JavaScript SDK with correct client-id -->
<script src="https://www.paypal.com/sdk/js?client-id=test¤cy=USD"></script>
<script>
var FUNDING_SOURCES = [
paypal.FUNDING.PAYPAL,
];
// Loop over each funding source/payment method
FUNDING_SOURCES.forEach(function (fundingSource) {
// Initialize the buttons
var button = paypal.Buttons({
fundingSource: fundingSource,
style: {
color: (fundingSource==paypal.FUNDING.PAYLATER) ? 'gold' : '',
},
// Call your server to set up the transaction
createOrder: function(data, actions) {
return fetch('/path/on/your/server/paypal/order/create/', {
method: 'post'
}).then(function(res) {
return res.json();
}).then(function(orderData) {
return orderData.id;
});
},
// Call your server to finalize the transaction
onApprove: function(data, actions) {
return fetch('/path/on/your/server/paypal/order/' + data.orderID + '/capture/', {
method: 'post'
}).then(function(res) {
return res.json();
}).then(function(orderData) {
// Three cases to handle:
// (1) Recoverable INSTRUMENT_DECLINED -> call actions.restart()
// (2) Other non-recoverable errors -> Show a failure message
// (3) Successful transaction -> Show confirmation or thank you
// This example reads a v2/checkout/orders capture response, propagated from the server
// You could use a different API or structure for your 'orderData'
var errorDetail = Array.isArray(orderData.details) && orderData.details[0];
if (errorDetail && errorDetail.issue === 'INSTRUMENT_DECLINED') {
return actions.restart(); // Recoverable state, per:
// https://developer.paypal.com/docs/checkout/standard/customize/handle-funding-failures/
}
if (errorDetail) {
var msg = 'Sorry, your transaction could not be processed.';
if (errorDetail.description) msg += 'nn' + errorDetail.description;
if (orderData.debug_id) msg += ' (' + orderData.debug_id + ')';
return alert(msg); // Show a failure message
}
// Successful capture! For demo purposes:
console.log('Capture result', orderData); console.log(JSON.stringify(orderData, null, 2));
var transaction = orderData.purchase_units[0].payments.captures[0];
alert('Transaction '+ transaction.status + ': ' + transaction.id + 'nnSee console for all available details');
// Replace the above to show a success message within this page, e.g.
// const element = document.getElementById('paypal-button-container');
// element.innerHTML = '<h3>Thank you for your payment!</h3>';
// Or instead, go to another URL: actions.redirect('thank_you.html');
});
}
});
// Check if the button is eligible
if (button.isEligible()) {
// Render the standalone button for that funding source
button.render("#paypal-button-container").catch((err) => {
console.warn("Failed to finish rendering the buttons");
});
}
})
</script>
</body>
</html>