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


Refer to this article if you have integrated Stripe without using an embedded Stripe button:

How to setup a Stripe Affiliate Program


Step 1: Login to your OSI Affiliate admin control panel


Step 2: Click on Set Up Software



Step 3: Click on "Get Thank You Page Code"



Step 4: Select "Stripe Payment Gateway" From the drop down




Step 5: Click "Connect to Stripe" button



Step 6: Go to the Referral programs section of your admin.


Now select the program that you want to enable recurring commissions for.


Select show advanced settings, Turn on recurring commissions by selecting "Yes" and set your commission amount or percentage to be "Match Email"



Step 7: Login to your Stripe account and select your desired sub-account and click the "Connect my Stripe" account button.



Step 8: If you have not already generated your Stripe checkout buttons, login to your Stripe account and go to "Products"



Step 9: Select the product that you want to to generate the button for.



Step 10: Scroll down and click "Get Checkout code snippet" under the pricing section.



Step 11: Select to copy your button code.



Step 12: Before adding the code to your site, customize it by adding the bolded lines shown below into your code. Note, the first bolded line can go directly above your checkout button snippet, the other bolded line of code goes within your checkout button snippet as shown below.


<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 13: In your stripe account, click on Developers -> Webhooks



Step 14: Click on "Add Endpoint"



Step 15: In the endpoint URL field, add https://YOUR-SUBDOMAIN.ositracker.com/Stripe/checkout, replace YOUR-SUBDOMAIN with your real OSI Affiliate Software subdomain, then select your current API and then for the events, select "checkout.session.completed" and then click "Add Endpoint".



Step 16: Click API Keys



Now select "Create secret key" and then copy it to a temp file or location as you will need it in a future step.




Step 17: Go back to your OSI Admin control panel and click Set up Software -> Settings and then select "show advanced settings"




Step 18: Check the box "Include Parameters in Affiliate URL" and then click update.





Step 19: On the settings page click "Third Party Integrations"



Step 20: Select Stripe



Step 21: Paste in the Secret key that you previously copied from your Stripe API section above and click Submit



Your Stripe Checkout integration has now been completed. Feel free to test by clicking an affiliate link and doing a purchase with your Stripe Checkout button.