Remove everything from Paypal Smart Buttons except paypal itself

Question

I'm building an online shop and I want to use Paypals JS SDK. However, I only want to have the paypal button, no such things as klarna or so. I know that by adding disable-funding=card,credit,bancontact I can remove options, but how can I remove everything except paypal itself?

Answer 1

If space is the issue, consider using style:layout:horizontal which will show at most one local payment method other than PayPal on the same line.

But if your use case must only show one funding source or choose specific ones, use standalone buttons . There's an example there under the "set of buttons" tab. Here's a full snippet with just the PayPal funding source

 <,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&currency=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 += '\n\n' + 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 + '\n\nSee console for all available details'). // Replace the above to show a success message within this page; eg; // 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>

Remove everything from Paypal Smart Buttons except paypal itself

Question

1 answers

solution1
0 2022-08-25 14:02:32

Remove everything from Paypal Smart Buttons except paypal itself

Question

1 answers

solution1 0 2022-08-25 14:02:32

solution1
0 2022-08-25 14:02:32