Skip to main content

BigCommerce Integration: Blueprint Snippets

Learn how to add Blueprint codes to your BigCommerce store

Written by Paulius
Updated this week

Omnisend snippets connect your BigCommerce store with Omnisend, enabling cart recovery, sales tracking, signup forms, the product picker, and more. Omnisend adds snippets automatically for new stores. If you're using an older version, you'll need to install them manually using BigCommerce's Script Manager or by editing theme files.

This article explains how to add Blueprint snippets to complete your BigCommerce integration.

Using a Stencil theme? Follow the BigCommerce Stencil Snippets guide instead.


Before You Begin

  • Before adding snippets, you need to connect your BigCommerce store to Omnisend.

  • You can use only one snippet type at a time: Stencil or Blueprint. Mixing both will break functionality. If you're not sure which theme you're using, check BigCommerce's guide.

  • When switching themes, you must re-add the snippets. Theme changes remove existing code.

  • Omnisend adds snippets automatically for new BigCommerce stores. If you see an error message like the one below, you'll need to add them manually using the steps in this guide.

Adding the Snippets

You'll need to add five snippets across different template files in your BigCommerce store. Each snippet tracks a specific part of the customer journey – from page views to cart updates to order completion.

Follow each instruction carefully, and make sure to update the shop ID placeholder (XXXXXX) in the code.

Step 1. Find your store ID

To activate the tracking snippets, you must replace XXXXXX with your actual shop ID. If the correct ID is not used, the code will not work.

You can find your shop ID in the URL when logged into your BigCommerce control panel. It typically appears as: https://store-XXXXXX.mybigcommerce.com/

Store Hash in the address bar

Couldn't find the shop ID? Check BigCommerce’s guide for step-by-step instructions.

Step 2. Add code snippets to your BigCommerce store

1. Google Analytics Tab Script

Location: Advanced Settings → Web Analytics → Google Analytics tab

If a Google Analytics tracking code is already present, paste the Omnisend code below the GA tag.

<script type="text/javascript">
    // SOUNDEST-V6-1
    // Do not remove these comments, they are super important!
    window.SOUNDEST = window.SOUNDEST || {};
    // Do not forget to replace XXXXXX with your shop ID! You can find it in your shop's permanent address: https://store-XXXXXX.mybigcommerce.com/. How to find it: https://goo.gl/1XddvQ
    SOUNDEST.shopID = "XXXXXX";
    SOUNDEST.shopType = "bigcommerce";
    SOUNDEST.eventsHost = "https://events.soundestlink.com/";
    (function(r,s,c){try{if(0<r.length&&0<s.length&&0<c.length){var u=!0,e=null,l=[],p=function(n){var e,t,o,a=document.cookie.split(";"),i=n+"=";for(/mybigcommerce.com/.test(location.hostname)&&(i=n+"-"+r+"="),t=0;t<a.length;t+=1)0===(o=a[t].trim()).indexOf(i)&&(e=o.substring(i.length,o.length));return e},n=function(){if(!u&&0<l.length){for(var n=0;n<l.length;n++){var e=document.createElement("img"),t=["timestamp="+(new Date).getTime(),"shopBaseURL="+window.location.protocol+"//"+window.location.hostname+"/","shopID="+r,"shopType="+s,"orderID="+l[n],"source=ga"],o=p("omnisendAnonymousID"),a=p("omnisendSessionID"),i=p("omnisendContactID"),d=p("omnisendAttributionID");void 0!==o&&t.push("anonymousID="+o),void 0!==a&&t.push("sessionID="+a),void 0!==i&&t.push("contactID="+i),void 0!==d&&t.push("attributionID="+d),e.src=c+"events/saveNewsletterOrder/?"+t.join("&"),document.body.appendChild(e)}l=[]}};if(void 0!==window.pageTracker){var t=window.pageTracker._addTrans,o=window.pageTracker._addItem,a=window.pageTracker._trackTrans;window.pageTracker._addTrans=function(n){e=n,t.apply(this,arguments)},window.pageTracker._addItem=function(n){e=n,o.apply(this,arguments)},window.pageTracker._trackTrans=function(){null!=e&&-1===l.indexOf(e)&&l.push(e),e=null,n(),a.apply(this,arguments)}}else window.pageTracker={_addTrans:function(n){e=n},_addItem:function(n){e=n},_trackTrans:function(){null!=e&&-1===l.indexOf(e)&&l.push(e),e=null,n()}};"loading"!==document.readyState?(u=!1,n()):document.addEventListener?document.addEventListener("DOMContentLoaded",function(){u=!1,n()}):document.attachEvent("onreadystatechange",function(){"loading"!==document.readyState&&(u=!1,n())})}}catch(n){}})(SOUNDEST.shopID,SOUNDEST.shopType,SOUNDEST.eventsHost);
</script>

2. Panels/Footer.html Script


<script type="text/javascript">
    // SOUNDEST-V6-2-B
    // Do not remove these comments, they are super important!
    window.SOUNDEST = window.SOUNDEST || {};
    // Do not forget to replace XXXXXX with your shop ID! You can find it in your shop's permanent address: https://store-XXXXXX.mybigcommerce.com/. How to find it: https://goo.gl/1XddvQ
    SOUNDEST.shopID = "XXXXXX";
    SOUNDEST.shopType = "bigcommerce";
    SOUNDEST.baseURL = "https://omnisrc.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%%";
    (function(t,e){try{if(t.length>0&&e.length>0&&window.location.hash.length>0&&"recoverCart"===JSON.parse(decodeURIComponent(window.location.hash.substring(1))).action){var i=document.createElement("div"),n=document.getElementById("soundest-container");i.id="soundest-cart";i.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="'+t+"inshop/images/loading.gif?v="+e+'" width="40" height="40" />';n.appendChild(i)}}catch(f){}})(SOUNDEST.baseURL,SOUNDEST.version);
    (function(e,t){try{if(e.length>0&&t.length>0){var n=document.createElement("script"),c=document.getElementById("soundest-container");n.type="text/javascript";n.id="soundest-launcher";n.src=e+"inshop/bigcommerce-launcher.js?v="+t;c.parentNode.insertBefore(n,c)}}catch(f){}})(SOUNDEST.baseURL,SOUNDEST.version);
</script>

3. Snippets/ProductAddToCart.html Script

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

4. Snippets/FastCartThickBoxContent.html Script

<!-- SOUNDEST-V6-4-B -->
<!-- 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%% -->

5. Snippets/CartItem.html Script

<!-- SOUNDEST-V6-5-B -->
<!-- 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%% -->

Contacts Syncing

All contacts added or updated via BigCommerce will be automatically added to your Omnisend AudienceContacts list. These contacts will also receive the tag source: bigcommerce.

This allows you to easily filter and segment contacts synced from BigCommerce. You can create a segment based on Tag is source:bigcommerce. Learn more about segments here.

FAQ

Why didn't snippets install automatically after I connected my store?
Automatic snippet installation works for most new BigCommerce stores, but some older stores or custom Blueprint themes require manual installation. After connecting your store, check Script Manager within 10 minutes. If no Omnisend scripts appear, follow the manual installation steps in this guide.

Can I use both Blueprint and Stencil snippets at the same time?
No. Using both will break functionality. Use only one snippet type based on your theme. If you switch from Blueprint to Stencil (or vice versa), remove old snippets first, then add the correct ones.

Do I need to add Blueprint snippets if I already have Omnisend scripts in Script Manager?

No. If you see Omnisend scripts in BigCommerce → Storefront → Script Manager, snippets were added automatically. Do not add snippets manually because duplicate scripts will break functionality.

I added the snippets, but forms/popups still don't appear. What should I check?

  1. Confirm you replaced XXXXXX with your actual shop ID in all five snippets (not the full URL, just the hash).

  2. Go to StorefrontScript Manager in BigCommerce. Make sure you don't have duplicate scripts added.

  3. Clear your browser cache and test in incognito mode.


Need a hand? Connect with our Support Team through the in-app chat or drop us an email at [email protected].

Did this answer your question?