In your server-side code, create an API route to start a SaleSnip session using the SaleSnip API.
https://api.example.com/negotiate
Copy
const config = { // TODO: Replace with your project id projectId: "[YOUR_PROJECT_ID]", currency: "USD", // The currency code for the negotiation. products: [ { id: "product_id", // Your internal product ID name: "Product Name", // Product name displayed to the user description: "Product Description", // Optional, a short product description image: "https://example.com/product.png", // Optional, a URL to the product image price: { initial: 100.0, // The original price of the product per unit minimum: 80.0, // The minimum price of the product that can be negotiated per unit }, }, ],};const session = await axios.post( "https://api.salesnip.com/v1/sessions", config, { headers: { "Content-Type": "application/json", "X-Api-Key": process.env.SALESNIP_API_KEY, }, },);res.status(200).json({ session: session.data.id });
Ensure this code is run server-side only to protect your API key.
You find the full API reference of this SaleSnip API route
here.
Integrate the SaleSnip snippet into your website by adding the following script within the tags, ideally just before the closing tag.
SaleSnip Snippet
Copy
<script>!function(e,n){if(!n.loaded){var t,a,r=n||{};for(r.__queue=[],(n=e.createElement("script")).type="text/javascript",n.async=!0,n.src="https://cdn.salesnip.com/v1/script.min.js",(o=e.getElementsByTagName("script")[0])?o.parentNode.insertBefore(n,o):e.head.appendChild(n),r.__handler=function(e){return function(){r.__queue.push([e].concat(Array.prototype.slice.call(arguments,0)))}},t="open on off".split(" "),a=0;a<t.length;a++){var i=t[a];r[i]=r.__handler(i)}var o=new Proxy(r,{get:function(e,n){return n in e||(e[n]=r.__handler(n)),e[n]}});window.salesnip=o,window.salesnip.loaded=1}}(document,window.salesnip||{});</script>
// TODO: Replace with your API route from the previous stepconst res = await fetch("(YOUR_API_URL)/negotiate", { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ // Add information about the product selected by the user if needed }),});// TODO: Handle the errorif (!res.ok) throw new Error("Failed to start negotiation");const body = await res.json();window.salesnip.open(body.session, { theme: { mode: "dark", // Optional, can be 'dark' or 'light'. Defaults to 'light' },});
Create an API route that loads the session data from SaleSnip and starts the checkout or payment process.
https://api.example.com/checkout
Copy
// Load the SaleSnip session dataconst session = await axios.get( `https://api.salesnip.com/v1/sessions/${req.body.session}`, { headers: { "X-Api-Key": process.env.SALESNIP_API_KEY, }, },);// TODO: Checkout all products in session.products with their negotiated price (data.products[number].price.current)// Make sure to multiply the unit price by the quantity to get the total price.
Ensure this code is run server-side only to protect your API key.
You find the full API reference of this SaleSnip API route
here.
Listen to the SaleSnip complete event to start the checkout or payment.
SaleSnip Events
Copy
// The complete event is triggered when the user agrees to a negotiated pricewindow.salesnip.on("complete", onNegotiationComplete);function onNegotiationComplete(data) { // TODO: Replace with your API route from the previous step fetch("(YOUR_API_URL)/checkout", { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ session: data.id, }), }); // TODO: Start the checkout or payment process}