Bloomreach Web SDK

👍
Data hub rollout
Data hub provides new unified API integration methods for sending data to multiple Bloomreach products. Access is being rolled out in phases. For new implementations, we recommend using Data hub where available. Existing product-specific integrations remain fully supported for Marketing, Search, and Conversational agent.

The Bloomreach Web SDK lets you integrate your website with Bloomreach and track customer behavior across both Marketing and Search. It's built on top of the Marketing JavaScript SDK and inherits its functionality. If you've worked with that SDK before, the setup should feel familiar.

🚧
Important
Namespace conflict: The Bloomreach Web SDK and the Marketing JavaScript SDK share the same namespace and cookie structure. You can't run both on the same website at the same time. If you're migrating from the Marketing JavaScript SDK, follow the migration guide before proceeding.

Installation

To install the SDK, add the following snippet to the <head> of your HTML before any other scripts. Replace the placeholder values with your actual credentials — see Find your credentials for instructions.

You can also add it via Google Tag Manager if you manage scripts through a tag management system.

📘
Note
Google Tag Manager only supports ES5 and throws a compilation error with the ES6-based JavaScript snippet. To avoid this:

Add the snippet using a <script type="text/gtmscript"> tag instead of a standard <script> tag. This bypasses GTM's compilation step and allows the SDK to load correctly.

Remove the new_experiments configuration or explicitly set new_experiments: false. GTM doesn't support new_experiments.

<style>.xnpe_async_hide{opacity:0 !important}</style>
<script>
  !function(e,t,n,i,o,r){
    const s=4e3,c="xnpe_async_hide";
    function a(e){
      if("number"!=typeof e)return e;
      const t=new Date;
      return new Date(t.getTime()+1e3*e)
    }
    function p(e){
      return e.reduce((function(e,t){
        return e[t]=function(){e._.push([t.toString(),arguments])},e
      }),{_:[]})
    }
    function m(e,t,n){
      const i=n.createElement(t);
      i.src=e;
      const o=n.getElementsByTagName(t)[0];
      return o.parentNode.insertBefore(i,o),i
    }
    function l(e){
      return"[object Date]"===Object.prototype.toString.call(e)
    }
    r.target=r.target||"//api.exponea.com",
    r.file_path=r.file_path||r.target+"/js/brweb.min.js",
    o[t]=p(["anonymize","initialize","identify","getSegments","update",
      "track","trackLink","trackEnhancedEcommerce","getHtml","showHtml",
      "showBanner","showWebLayer","ping","getAbTest","loadDependency",
      "getRecommendation","reloadWebLayers","_preInitialize",
      "_initializeConfig","metadata"]),
    o[t].notifications=p(["isAvailable","isSubscribed","subscribe","unsubscribe"]),
    o[t].segments=p(["subscribe"]),
    o[t]["snippetVersion"]="v3.1.1",
    function(e,t,n,i){
      e[i]={sdk:e[n],sdkObjectName:n,skipExperiments:!!t.new_experiments,
        path:t.target,streamId:t.stream_id}
    }(o,r,t,i),
    function(e,t,n){m(e.file_path,t,n)}(r,n,e),
    function(e,t,n,i,o,r,p,u){
      if(!e.new_experiments)return;
      !0===e.new_experiments&&(e.new_experiments={});
      const _=e.new_experiments.hide_class||c,
            f=e.new_experiments.timeout||s,
            d=encodeURIComponent(r.location.href);
      let g;
      e.cookies&&e.cookies.expires&&(
        "number"==typeof e.cookies.expires||l(e.cookies.expires)
          ?g=a(e.cookies.expires)
          :e.cookies.expires.tracking&&(
              "number"==typeof e.cookies.expires.tracking||
              l(e.cookies.expires.tracking)
            )&&(g=a(e.cookies.expires.tracking)));
      g&&g<new Date&&(g=void 0);
      const b=e.target+"/webxp/streams/"+e.stream_id+"/"+t+"/"+
        (u.exec(p.cookie)||[0,"new"])[1]+
        "/modifications.min.js?http-referer="+d+
        "&timeout="+f+"ms"+
        (g?"&cookie-expires="+Math.floor(g.getTime()/1e3):"");
      "sync"===e.new_experiments.mode&&
      r.localStorage.getItem("__exponea__sync_modifications__")
        ?function(e,t,n,i,o){
            n[o][t]="<"+t+' src="'+e+'"></'+t+">";
            i.writeln(n[o][t]);
            i.writeln("<"+t+">!"+o+".init && document.writeln("+o+"."+t+
              '.replace("/'+t+'/","/'+t+'-async/")'+
              '.replace("><"," async><"))</'+t+">")
          }(b,t,r,p,n)
        :function(e,t,n,i,o,r,s,c){
            r.documentElement.classList.add(e);
            const a=m(n,i,r);
            function p(){
              o[c].init||m(n.replace("/"+i+"/","/"+i+"-async/"),i,r)
            }
            function l(){r.documentElement.classList.remove(e)}
            a.onload=p,a.onerror=p,o.setTimeout(l,t),o[s]._revealPage=l
          }(_,f,b,t,r,p,o,n)
    }(r,n,i,0,t,o,e,RegExp("__exponea_etc__"+"=([\\w-]+)")),
    function(e,t,n){
      var i;
      e[t]._initializeConfig(n);
      (null===(i=n.experimental)||void 0===i?void 0:i.non_personalized_weblayers)
        &&e[t]._preInitialize(n);
      e[t].start=function(i){
        i&&Object.keys(i).forEach((e=>n[e]=i[e]));
        e[t].initialize(n)
      }
    }(o,t,r)
  }(document,"brweb","script","webxpClient",window,{
    target: "https://api.XXXXXXX.dev",
    // Your Bloomreach API base URL
    stream_id: "XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX",
    // Your event stream ID
    experimental: {
      non_personalized_weblayers: true
    },
    new_experiments: {
      mode: "sync"
    },
    customer: {
      email_id: "[email protected]"
      // Identified visitor's email address
    },
    track: {
      default_properties: {
        customer_tier: "gold-member"
        // Custom properties added to all events
      },
      metadata: {
        domain_key: "Pacific",
        // Provided by your Discovery consultant
        view_id: "en_US",
        // Provided by your Discovery consultant
        test_data: true,
        // Ignores events in Discovery on production
        debug: true
        // Enables real-time integration mode in Discovery
      }
    },
  });
  brweb.start();
</script>

📘
Note
Some privacy regulations require you to call brweb.start() only after the visitor has granted cookie consent.

Find your credentials

You need 2 credentials to configure the snippet: target and stream_id.

target is your Bloomreach API base URL. Find it in either of these locations:

Event streams menu — the endpoint URL is displayed in the Access security tab on an event stream details page.
Data hub > Workspace settings > Access Management > API > API Credentials

stream_id is your event stream ID. Find it in Data hub > Event streams > select your stream > Settings.

Configuration

The Bloomreach Web SDK shares its base configuration with the Marketing JavaScript SDK. For a full reference of shared configuration options, see JS SDK configuration.

The following options are unique to the Bloomreach Web SDK.

Metadata

Use the metadata object inside track to pass Search-specific properties with every tracked event. Contact your Search technical consultant to get the correct values for your account.

Parameter	Type	Description
`domain_key`	String	Identifies your Search catalog. Provided by your Search consultant.
`view_id`	String	Identifies the catalog view, for example, a locale or region. Provided by your Search consultant.
`test_data`	Boolean	When `true`, Search ignores events on production. Use during testing.
`debug`	Boolean	When `true`, enables real-time integration mode and ignores events in Search on production.

Real-time segments

Real-time segments (RTS) let Marketing pass live customer segment data to Search for personalized search and merchandising. To enable RTS, add the following to your configuration object:

cdp_segments: {
  rts: true
}

Custom tracking domain

A custom tracking domain (CTD) lets you serve the SDK from your own domain, which can improve resilience against ad blockers and enable first-party data collection. For setup instructions, see Custom tracking domain.

What's next?

Explore the Bloomreach Web SDK documentation:

Read the Marketing JavaScript SDK documentation for details on: