Knowledge Base

Bigcommerce Blueprint Snippet

If you own a Bigcommerce store and want to use features of Soundest, you need to add the codes, based on your theme: Blueprint or Stencil

Just copy the codes and paste them at the bottom of templates we specified.

IMPORTANT: if you are changing template, you will need to add our snippet again. Do not add both snippets at once (Blueprint and Stencil), neither of them will work in such case. 

Blueprint theme:

Open Panels/Footer.html and append

<div id="soundest-container"></div>
<script type="text/javascript">
    // SOUNDEST-1
    // Do not remove these comments, they are super important!
    window.SOUNDEST = window.SOUNDEST || {};
    SOUNDEST.shopID = "XXXXX";
    SOUNDEST.shopType = "bigcommerce";
    SOUNDEST.baseURL = "https://soundest.net/";
    SOUNDEST.eventsHost = "https://events.soundestlink.com/";
    SOUNDEST.version = new Date().toISOString().slice(0, 13);
    SOUNDEST.productID = SOUNDEST.productID || "";
    SOUNDEST.additionalData = SOUNDEST.additionalData || {};
    SOUNDEST.additionalData.email = "%%GLOBAL_CurrentCustomerEmail%%";
    SOUNDEST.cartItems = "%%GLOBAL_CartItems%%";
    // Sales
    (function(e,o,t,n){try{if(("undefined"==typeof window.SOUNDEST_SALES_ENABLED||window.SOUNDEST_SALES_ENABLED===!0)&&e.length>0&&o.length>0&&t.length>0&&n.length>0){var s=document.createElement("img"),d=["timestamp="+(new Date).getTime(),"shopBaseURL="+window.location.protocol+"//"+window.location.hostname+"/","orderID="+n,"shopType="+o,"shopID="+t,"source=jsPixel"];s.src=e+"events/saveNewsletterOrder/?"+d.join("&"),document.body.appendChild(s)}}catch(i){}window.SOUNDEST_SALES_SNIPPET=!0})(SOUNDEST.eventsHost,SOUNDEST.shopType,SOUNDEST.shopID,"%%GLOBAL_OrderId%%");
    // Cart
    (function(i,e){try{if(("undefined"==typeof window.SOUNDEST_CART_ENABLED||window.SOUNDEST_CART_ENABLED===!0)&&i.length>0&&e.length>0&&window.location.hash){var t=JSON.parse(decodeURIComponent(window.location.hash.substring(1)));if("recoverCart"===t.action){var n=document.getElementById("soundest-container"),o=document.createElement("div");o.id="soundest-cart",o.innerHTML='<div id="soundest-cart-overlay" style="position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:#ffffff;z-index:1100000001;opacity:0.9;"></div><img id="soundest-cart-loader" style="position:fixed;top:50%;left:50%;margin-top:-20px;margin-left:-20px;width:40px;height:40px;z-index:1100000002;border-width:0px;" alt="" src="'+i+"inshop/images/loading.gif?v="+e+'" width="40" height="40" />',n.appendChild(o)}}}catch(d){}window.SOUNDEST_CART_SNIPPET=!0})(SOUNDEST.baseURL,SOUNDEST.version);
    // Launcher
    (function(e,t){try{if(e.length>0&&t.length>0){var n=document.createElement("script");n.type="text/javascript",n.id="soundest-launcher",n.src=e+"inshop/bigcommerce-launcher.js?v="+t;var r=document.getElementById("soundest-container");r.parentNode.insertBefore(n,r)}}catch(c){}})(SOUNDEST.baseURL,SOUNDEST.version);
</script>

 You need to change "XXXXX" to you store id. You can find your id in the address bar when you are logged in to your store control panel.

Bigcommerce Snippet

Open Snippets/ProductAddToCart.html and append 

<script type="text/javascript">
    // SOUNDEST-2
    // Do not remove these comments, they are super important!
    window.SOUNDEST = window.SOUNDEST || {};
    SOUNDEST.productID = "%%GLOBAL_ProductId%%";
</script>

 Open Snippets/FastCartThickBoxContent.html and append

<!-- SOUNDEST-3 -->
<!-- Do not remove these comments, they are super important! -->
<!-- SOUNDEST-FASTCART-QUANTITY:%%GLOBAL_fastCartQuantity%% -->
<!-- SOUNDEST-FASTCART-PRICE:%%GLOBAL_fastCartProdTotal%% -->
<!-- SOUNDEST-FASTCART-LINK-IMAGE:%%GLOBAL_fastCartProdImg%% -->
<!-- SOUNDEST-CART-ITEMS:%%GLOBAL_fastCartNumItemsTxt%% -->

Open Snippets/CartItem.html and append

<!-- SOUNDEST-4 -->
<!-- Do not remove these comments, they are super important! -->
<!-- SOUNDEST-ITEM-%%GLOBAL_CartItemId%%-ID:%%GLOBAL_ItemId%% -->
<!-- SOUNDEST-ITEM-%%GLOBAL_CartItemId%%-QUANTITY:%%GLOBAL_ProductQuantity%% -->
<!-- SOUNDEST-ITEM-%%GLOBAL_CartItemId%%-VARIATION:%%GLOBAL_VariationId%% -->
<!-- SOUNDEST-ITEM-%%GLOBAL_CartItemId%%-PRICE:%%GLOBAL_ProductPrice%% -->
<!-- SOUNDEST-ITEM-%%GLOBAL_CartItemId%%-LINK-IMAGE:%%GLOBAL_ProductImage%% -->
<!-- SOUNDEST-ITEM-%%GLOBAL_CartItemId%%-ATTRIBUTES:%%GLOBAL_ProductOptions%% -->
<!-- SOUNDEST-ITEM-%%GLOBAL_CartItemId%%-EVENT:%%GLOBAL_EventDate%% -->
<!-- SOUNDEST-ITEM-%%GLOBAL_CartItemId%%-WRAPPING:%%GLOBAL_GiftWrappingName%% -->
<!-- SOUNDEST-CART-ITEMS:%%GLOBAL_CartItems%% -->

For Stencil codes please click here

Which theme platform do you have: Stencil or Blueprint?


Was this article helpful?
Yes No
Thank you for your feedback!