Embed Installation

Add SiteBridge to any product page

Two snippets. No build step. Works on any site that serves HTML. For the full guided setup with live validation and sandbox testing, head to the Onboarding Hub.

Step 1 Add the SiteBridge script tag

Paste this snippet just before the closing </head> tag of your product page template. Replace YOUR_SITEBRIDGE_DOMAIN with your actual SiteBridge instance domain.

<!-- SiteBridge Widget -->
<script src="https://YOUR_SITEBRIDGE_DOMAIN/widget.js"></script>

Find your SiteBridge domain in your integration settings. It looks like your-site.polsia.app.

Step 2 Tag your product cards

Add a data-product-id attribute to each product card container. SiteBridge reads this to identify and highlight products when users search.

Attribute	Required	What goes in it
`data-product-id`	Required	Your unique product ID (SKU, slug, or number)
`data-name`	Optional	Product name — helps accuracy
`data-tags`	Optional	Comma-separated keywords (e.g. `running, waterproof`)

Example — add the attributes to your existing product card markup:

<div class="product-card"
     data-product-id="SKU-1234"
     data-name="CloudStep Runner"
     data-tags="running, lightweight, neutral">
  <!-- your existing card HTML -->
</div>

If your product cards use a different CSS class, you can configure the selector — see the Setup Guide for the full config options.

Step 3 Test in the sandbox

Before pushing to production, open the Embed Sandbox — paste your product page URL or use the built-in mock products to verify the widget loads, opens, and highlights cards correctly.

Step 4 Enable structured data (optional — for SEO)

To help Google recognize your site, set siteUrl and siteName on window._sbConfig (defined before the widget script). The widget will inject valid Organization + WebSite JSON-LD into <head> automatically.

<script>
  window._sbConfig = {
    apiEndpoint:    '/api/parse-intent',
    productSelector: '.product-card',
    idAttribute:    'data-product-id',
    siteUrl:        'https://yourstore.com',
    siteName:       'YourStore'
  };
</script>

That's it. Reload your product page and the SiteBridge chat sidebar will appear in the bottom-right corner. Type a product query and matching cards highlight in real time.

Need the full guided setup?

4-step walkthrough with live config validation and a sandbox demo — all in one place.

Open Onboarding Hub → Try Sandbox