Follow the instructions below to integrate your Stripe checkout buttons with OSI Affiliate Software.


Step 1: Copy Checkout Code

Create/Edit recurring product on Stripe & copy checkout code


Step 2: Connect with your Stripe account

Step 3: Enable URL parameters from affiliate link


Step 4: Affiliate Program with recurring

Create OSI affiliate referral program with recurring sales and link with your Stripe checkout product page.



Step 5: Customize the Checkout Code

Customize the checkout code copied in step 1 as given in the following example. Note modified code is marked in bold, you just need to add this code.

<script type="text/javascript" src="https://www.ositracker.com/js/url-params.js"></script>

<!-- Load Stripe.js on your website. -->

<script src="https://js.stripe.com/v3"></script>


<!-- Create a button that your customers click to complete their purchase. Customize the styling to suit your branding. -->

<button

  style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"

  id="checkout-button-plan_..."

  role="link"

>

  Checkout

</button>


<div id="error-message"></div>


<script>

(function() {

  var stripe = Stripe('pk_live_...');


  var checkoutButton = document.getElementById('checkout-button-plan_...');

  checkoutButton.addEventListener('click', function () {

    // When the customer clicks on the button, redirect

    // them to Checkout.

    stripe.redirectToCheckout({

      items: [{plan: 'plan_...', quantity: 1}],


      // Do not rely on the redirect to the successUrl for fulfilling

      // purchases, customers may not always reach the success_url after

      // a successful payment.

      // Instead use one of the strategies described in

      // https://stripe.com/docs/payments/checkout/fulfillment

      successUrl: window.location.protocol + '//YourWebSite.com/success',

      cancelUrl: window.location.protocol + '//YourWebSite.com/canceled',

      clientReferenceId: urlParams['affiliate_id'] + '_' + urlParams['prodgroup'],

    })

    .then(function (result) {

      if (result.error) {

        // If `redirectToCheckout` fails due to a browser or network

        // error, display the localized error message to your customer.

        var displayError = document.getElementById('error-message');

        displayError.textContent = result.error.message;

      }

    });

  });

})();

</script>

Step 6: Webhook Setup

You need to setup a webhook.


In https://YOUR-SUBDOMAIN.ositracker.com/Stripe/checkout, replace YOUR-SUBDOMAIN with your real OSI Affiliate Software subdomain.