Similar Tasting Products JS Plugin

What is required to implement:

A synced inventory collection ID (provided by Preferabli)
An integration ID (provided by Preferabli)
Ability to add/edit your theme
Ability to grab product ID/SKU from your e-commerce platform
Website whitelisted for use, please reach out to [email protected] for CORS whitelisting

How to implement:

Include the following within the head of your website:
- jQuery: https://stp.preferabli.com/jquery.preferabli.stp.js
  VanillaJS: https://stp.preferabli.com/preferabli.stp.js
- Global stylesheet: https://stp.preferabli.com/preferabli.stp.style.css
- Theme stylesheet (optional): https://stp.preferabli.com/preferabli.stp.theme.css
```
<script type="text/javascript" src="https://stp.preferabli.com/jquery.preferabli.stp.js"></script>
<link rel="stylesheet" href="https://stp.preferabli.com/preferabli.stp.style.css"/>
<link rel="stylesheet" href="https://stp.preferabli.com/preferabli.stp.theme.css"/>
```
Create an empty div with id=product-stp for Preferabli Similar Tasting Products app to render:
```
<div id="product-stp"></div>
```

Add the following snippet of code at bottom of website or below the div. Be sure to update variables with your custom ids:

<script type="text/javascript">
	// jQuery Version 
	(function() {

        var stp = jQuery('#product-stp').preferabliSTP({
            integration_id: %INTEGRATION_ID%,
       			 collection_id: %COLLECTION_ID%,
        });

        stp.preferabliSTP('getProducts', {
            product_id: '%PRODUCT_ID%',
            price_min_percent: 50, // Optional
            price_max_percent: 150, // Optional
        });

    })(jQuery);

		// Vanilla JS Version

    var _stp = new PreferabliSTP('#product-stp', {
      integration_id: %INTEGRATION_ID%,
       collection_id: %COLLECTION_ID%,
    });
    _stp.getProducts({
      product_id: '%PRODUCT_ID%',
      price_min_percent: 15,
      price_max_percent: 150
    });
		
</script>

Additionally, if you want limit products to a certain price percentages, you can add price_min_percent and/or price_max_percent in place of the getProducts line above

These percentages work off the price of the product at hand. Eg. for a $20 bottle, if price_min_percent=50, then the min_price would calculate as $20 * 50% = $10. Similarly price_max_percent=150 becomes $20 * 150% = $30.