Native Embed lets you place a BlueConic Experience directly into your webpage without using an iframe. Because the content loads within your domain, Native Embed provides more control over styling, faster performance, and improved tracking and data capture.
Native Embed delivers several benefits that can help you integrate Experiences more deeply into your site and analytics stack:
Native Embed serves the experience in the same domain as your website, allowing BlueConic’s 1st-party cookie to be read by your analytics and marketing platforms (GA, Meta, CDPs). This eliminates cross-domain tracking issues and strengthens profile unification.
Build a more complete customer view without relying on 3rd-party cookies.
Engagement data integrates directly with your existing analytics stack for richer reporting and activation.
Flexible styling and layout — embed the experience anywhere on your page and make it feel native to your brand.
Before you begin
Confirm website access: Ensure you can edit your site’s HTML/JavaScript (directly or via CMS/Tag Manager).
Decide where the experience should render, inline, modal/lightbox, or widget.
Add a container element such as:
(<div id="my-container"></div>)with appropriate width/height.Have a published or draft campaign available and note its Campaign ID.
HTTPS required: The SDK blocks non-secure origins. Use HTTPS locally and in staging.
Review the technical documentation for developer set-up.
Create your native embed code
Navigate to your experience in the workbench.
Navigate to the Launch tab.
Select Website > Native Embed.
Click Create Native Embed Code to generate the snippet.
Name this version and select Publish or click schedule options to publish at a later time.
Copy all of the code snippets.
(Optional) enable the User ID option to include a
uidparameter for logged-in users. This supports stronger identity resolution between engagement data and your CRM or CDP.Paste the code into your website where you want the BlueConic experience to appear.
(Optional) you can also add a custom Native Embed Launch link by clicking on this text. Name this version and click Save.
Tip: If you want to test in draft mode, you can add a draft property to your launch call.
Launch the Experience on your page
Use the generated script and call jebbit.launch() with your container and Campaign ID.
Example:
jebbit.launch('#my-container', 'YOUR_CAMPAIGN_ID', { draft: true });
Best practices
Follow these recommendations to ensure a successful implementation:
Place your container (
<div>or similar element) where you want the experience to render. Use CSS to set appropriate width and height so the experience displays correctly.If you need more than one experience on the same page, call
jebbit.launch()again with a different container ID and campaign ID.Use draft or preview mode to validate your setup before publishing live.
Work with your analytics team to map BlueConic events into your existing dataLayer, GA, Meta Pixel, or CDP setup.
Next steps
Confirm analytics tracking is working as expected.
Publish the updated page.
Test your embedded campaign in your staging environment. To test in draft mode add a draft property to your launch call.