Multiple Payment Button on One Page Not Working

Cglobal
Contributor
Contributor

Can Someone Help Me Urgently, Please?

 

I am offering a coaching package for say $100. For clients who may not be able to pay one time in full, I want to offer an option for them to pay the full amount in 5 installments. I have created the buttons for the two payments (Pay One Time in Full - Checkout, and Pay 5 times - Subscription); but one disappears the moment I paste the second one. Below are the payment codes I created for the Checkout and Subscription buttons; I replaced Client Id with "client-id."

 

ONE TIME PAYMENT - CHECKOUT

 

<div id="smart-button-container">

      <div style="text-align: center;">

        <div id=“paypal-button-container"></div>

      </div>

    </div>

  <script src="https://www.paypal.com/sdk/js?client-id=clientID" data-sdk-integration-source="button-factory"></script>

  <script>

          shape: 'rect',

          color: 'gold',

          layout: 'vertical',

          label: 'checkout',

          

        },

 

        createOrder: function(data, actions) {

          return actions.order.create({

            purchase_units: [{“description”:"Amplify Coaching Program","amount":{"currency_code":"USD","value":3750}}]

          });

        },

        onApprove: function(data, actions) {

          return

            

            // Full available details

            console.log('Capture result', orderData, JSON.stringify(orderData, null, 2));

 

            // Show a success message within this page, e.g.

            const element = document.getElementById(’paypal-button-container’);

            element.innerHTML = '';

            element.innerHTML = '<h3>Thank you for your payment!</h3>';

 

            // Or go to another URL:  actions.redirect('thank_you.html');

            

          });

        },

 

        onError: function(err) {

          console.log(err);

        }

      }).render('#paypal-button-container');

    }

    initPayPalButton();

  </script>

 

 

FIVE INSTALLMENTS - SUBSCRIPTION

 

<div id="paypal-button-container-P-5R3383499H080131TMFE6CLQ"></div>
<script src="https://www.paypal.com/sdk/js?client-id=ClientID=subscription" data-sdk-integration-source="button-factory"></script>
<script>
paypal.Buttons({
style: {
shape: 'rect',
color: 'gold',
layout: 'vertical',
label: 'paypal'
},
createSubscription: function(data, actions) {
return actions.subscription.create({
/* Creates the subscription */
plan_id: 'P-5R3383499H080131TMFE6CLQ'
});
},
onApprove: function(data, actions) {
alert(data.subscriptionID); // You can add optional success message for the subscriber here
}
}).render('#paypal-button-container-P-5R3383499H080131TMFE6CLQ'); // Renders the PayPal button
</script>

 

I will really appreciate it if someone could help me out with a review of the codes and possibly add or subtract what needs to be done to have them show on the page and work. PLEASE NOTE: I have no coding experience at all.

 

I look forward to your kind support.

 

Cglobal

Login to Me Too
1 REPLY 1

hoarderscloset
Contributor
Contributor

A month and a half later and it's still happening. I got almost the exact same script using Smart Payments button for fixed . The coding works but after inputting details, it goes directly to confirmed checkout and goes to say "Thank you for your payment!", but there was no confirmation done on my end and there wasn't any actual transaction done. No email, no payment notification in bank app. I tried using the old Add to Cart button but PayPal made the page inaccessible, so now, my whole shop is in limbo, and customers are unable to purchase newly added items. Subscribing on this thread. Someone please help urgently.

Login to Me Too

Haven't Found your Answer?

It happens. Hit the "Login to Ask the community" button to create a question for the PayPal community.