{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":["admonition","cards","card"]},"redocly_category":"Products","product_name":"Engage Studio","type":"markdown"},"seo":{"title":"In-Browser Messaging Overview","description":"Learn how to deliver personalized in-browser experiences—popup overlays and inline DOM replacements—using Engage Studio's In-Browser Messaging feature and Real-Time Personalization 2.0.","siteUrl":"https://docs.treasure.ai","lang":"en-US","jsonLd":{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://www.treasure.ai/","name":"Treasure AI","url":"https://www.treasure.ai/","logo":"https://www.treasure.ai/hubfs/assets/images/logos/primary-logo.svg"},{"@type":"WebSite","@id":"https://docs.treasure.ai/#website","name":"Treasure AI Documentation","url":"https://docs.treasure.ai/","inLanguage":["en","ja"],"publisher":{"@id":"https://www.treasure.ai/"}}]}},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"in-browser-messaging","__idx":0},"children":["In-Browser Messaging"]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"warning","name":"Beta"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["In-Browser Messaging is currently in Beta. Features and SDK contracts may change before general availability."," ","Contact your Customer Success Manager for access."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["In-Browser Messaging"]}," lets marketers deliver personalized web experiences—such as promotional banners, modal overlays, and inline content replacements—directly on a customer's website. Unlike email or push notifications, in-browser messages are rendered inside the browser while the user is actively browsing, making them ideal for contextual promotions, cart reminders, and time-sensitive announcements."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["All targeting and personalization decisions are handled server-side by ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Real-Time Personalization 2.0 (RT 2.0)"]},", so the client-side footprint remains minimal."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"message-types","__idx":1},"children":["Message Types"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["In-Browser Messaging supports two delivery modes:"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"width":"20%","data-label":"Type"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Type"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"40%","data-label":"Description"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Description"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"40%","data-label":"Best For"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Best For"]}," "]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Popup"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Displays a message in an overlay on top of the page to capture attention without changing existing content."]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Welcome offers, exit-intent promotions, announcements"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Inline"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Inserts your message directly into the page, replacing existing content for a seamless, native experience."]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Sale banners, cart coupon reminders, product-level promotions"]}]}]}]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Message type is selected at creation time and ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["cannot be changed"]}," after a campaign is saved."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"how-it-works","__idx":2},"children":["How It Works"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["In-Browser Messaging is built on ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Real-Time Personalization 2.0"]},". The delivery flow is:"]},{"$$mdtype":"Tag","name":"Diagram","attributes":{"data-language":"mermaid","diagramType":"mermaid","diagramSource":"sequenceDiagram\n actor User\n participant SDK as TD Web SDK\n participant RT as RT 2.0 Personalization API\n\n User->>SDK: Visit page or trigger event
(page_view, cart_add, etc.)\n SDK->>RT: Send event with personalization token\n RT->>RT: Evaluate entry criteria
& segment membership\n alt Eligibility conditions met\n RT-->>SDK: Return campaign payload\n alt Popup campaign\n SDK->>User: Overlay popup on page\n else Inline campaign\n SDK->>User: Replace Zone element innerHTML\n end\n else Conditions not met\n RT-->>SDK: Return empty response\n end\n User->>User: View, interact with,
or dismiss the message\n","diagramHtml":"RT 2.0 Personalization APITD Web SDKRT 2.0 Personalization APITD Web SDKalt[Popup campaign][Inline campaign]alt[Eligibility conditions met][Conditions not met]UserVisit page or trigger event(page_view, cart_add, etc.)Send event with personalization tokenEvaluate entry criteria& segment membershipReturn campaign payloadOverlay popup on pageReplace Zone element innerHTMLReturn empty responseView, interact with,or dismiss the messageUser","diagramHtmlDark":"RT 2.0 Personalization APITD Web SDKRT 2.0 Personalization APITD Web SDKalt[Popup campaign][Inline campaign]alt[Eligibility conditions met][Conditions not met]UserVisit page or trigger event(page_view, cart_add, etc.)Send event with personalization tokenEvaluate entry criteria& segment membershipReturn campaign payloadOverlay popup on pageReplace Zone element innerHTMLReturn empty responseView, interact with,or dismiss the messageUser"},"children":["sequenceDiagram\n actor User\n participant SDK as TD Web SDK\n participant RT as RT 2.0 Personalization API\n\n User->>SDK: Visit page or trigger event
(page_view, cart_add, etc.)\n SDK->>RT: Send event with personalization token\n RT->>RT: Evaluate entry criteria
& segment membership\n alt Eligibility conditions met\n RT-->>SDK: Return campaign payload\n alt Popup campaign\n SDK->>User: Overlay popup on page\n else Inline campaign\n SDK->>User: Replace Zone element innerHTML\n end\n else Conditions not met\n RT-->>SDK: Return empty response\n end\n User->>User: View, interact with,
or dismiss the message\n"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"prerequisites","__idx":3},"children":["Prerequisites"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/marketing-cloud/engage-studio/experiences/setup-and-prerequisites"},"children":["Setup & Prerequisites"]}," for the full list of requirements before creating a campaign."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"campaign-lifecycle","__idx":4},"children":["Campaign Lifecycle"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["In-Browser Message campaigns follow this status lifecycle:"]},{"$$mdtype":"Tag","name":"Diagram","attributes":{"data-language":"mermaid","diagramType":"mermaid","diagramSource":"stateDiagram-v2\n direction LR\n [*] --> Draft\n Draft --> Live : Launch\n Live --> Paused : Pause\n Paused --> Live : Resume\n Live --> Finished : Complete\n Paused --> Finished : Complete\n Finished --> [*]\n","diagramHtml":"

Launch

Pause

Resume

Complete

Complete

Draft

Live

Paused

Finished

","diagramHtmlDark":"

Launch

Pause

Resume

Complete

Complete

Draft

Live

Paused

Finished

"},"children":["stateDiagram-v2\n direction LR\n [*] --> Draft\n Draft --> Live : Launch\n Live --> Paused : Pause\n Paused --> Live : Resume\n Live --> Finished : Complete\n Paused --> Finished : Complete\n Finished --> [*]\n"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"width":"15%","data-label":"Status"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Status"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"55%","data-label":"Description"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Description"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"30%","data-label":"Editable?"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Editable?"]}," "]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Draft"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Created but not yet delivered."]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["✅ All settings"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Live"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Actively delivering to eligible users."]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["❌ Pause first to edit"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Paused"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Delivery stopped; can be resumed."]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["✅ All settings"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Finished"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Manually completed; cannot be reactivated."]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["❌"]}]}]}]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Campaigns in ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Draft"]}," or ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Finished"]}," status can be deleted. ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Message type and content become immutable once a campaign goes Live or is Finished."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"creating-a-campaign","__idx":5},"children":["Creating a Campaign"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Each campaign is created through two steps — ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Target Audience"]}," and ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Message Content"]}," — followed by ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Launch"]},". The steps are the same regardless of message type; only the content configuration differs between Popup and Inline."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Select the guide for your message type:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/marketing-cloud/engage-studio/experiences/create-a-popup-campaign"},"children":["Create a Popup Campaign"]}," — modal overlay with the drag-and-drop editor"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/marketing-cloud/engage-studio/experiences/create-an-inline-campaign"},"children":["Create an Inline Campaign"]}," — DOM replacement with the HTML/CSS code editor"]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"authoring-with-the-web-message-previewer","__idx":6},"children":["Authoring with the Web Message Previewer"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Engage Studio provides the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Engage Studio — Web Message Previewer"]}," Chrome Extension to help marketers identify target DOM elements on the live website and preview campaign content before launch — without writing CSS selectors by hand."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The Extension is an ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["authoring assist tool only"]}," — the delivery architecture has no dependency on it. Customers who cannot install the Extension can still specify CSS selectors manually using browser DevTools."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["➡️ ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/marketing-cloud/engage-studio/experiences/chrome-extension"},"children":["Install and use the Web Message Previewer"]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"use-cases","__idx":7},"children":["Use Cases"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"limited-time-sale-banner","__idx":8},"children":["Limited-Time Sale Banner"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Display an inline sale banner on a product detail page only during an active sale period. Configure entry criteria in RT 2.0 to check the current time against the product's sale window, and use a Zone ID targeting the banner area (for example, ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["#product-banner-area"]},")."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"cart-coupon-reminder","__idx":9},"children":["Cart Coupon Reminder"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["When a user adds a product to the cart, show a coupon reminder icon if an applicable coupon exists. RT 2.0 evaluates the user's coupon list against the added product and returns the reminder content if a valid, applicable coupon is found."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"in-this-section","__idx":10},"children":["In This Section"]},{"$$mdtype":"Tag","name":"Cards","attributes":{"columns":3,"cardMinWidth":240},"children":[{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Setup & Prerequisites","icon":"settings","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/products/marketing-cloud/engage-studio/experiences/setup-and-prerequisites"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Install the TD Web SDK and configure RT 2.0 prerequisites."]}]},{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Create a Popup Campaign","icon":"layout","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/products/marketing-cloud/engage-studio/experiences/create-a-popup-campaign"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Build a modal overlay campaign with the drag-and-drop editor."]}]},{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Create an Inline Campaign","icon":"code","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/products/marketing-cloud/engage-studio/experiences/create-an-inline-campaign"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Replace a DOM element with personalized HTML content."]}]},{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Personalize Message Content","icon":"user","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/products/marketing-cloud/engage-studio/experiences/personalize-message-content"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Use Profile Variables and Liquid syntax to personalize messages."]}]},{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Web Message Previewer","icon":"chrome","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/products/marketing-cloud/engage-studio/experiences/chrome-extension"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Visually select DOM elements and preview campaigns before launch."]}]},{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Troubleshooting","icon":"help-circle","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/products/marketing-cloud/engage-studio/experiences/troubleshooting"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Diagnose and resolve common In-Browser Messaging issues."]}]}]}]},"headings":[{"value":"In-Browser Messaging","id":"in-browser-messaging","depth":1},{"value":"Message Types","id":"message-types","depth":2},{"value":"How It Works","id":"how-it-works","depth":2},{"value":"Prerequisites","id":"prerequisites","depth":3},{"value":"Campaign Lifecycle","id":"campaign-lifecycle","depth":2},{"value":"Creating a Campaign","id":"creating-a-campaign","depth":2},{"value":"Authoring with the Web Message Previewer","id":"authoring-with-the-web-message-previewer","depth":2},{"value":"Use Cases","id":"use-cases","depth":2},{"value":"Limited-Time Sale Banner","id":"limited-time-sale-banner","depth":3},{"value":"Cart Coupon Reminder","id":"cart-coupon-reminder","depth":3},{"value":"In This Section","id":"in-this-section","depth":2}],"frontmatter":{"seo":{"title":"In-Browser Messaging Overview","description":"Learn how to deliver personalized in-browser experiences—popup overlays and inline DOM replacements—using Engage Studio's In-Browser Messaging feature and Real-Time Personalization 2.0."}},"lastModified":"2026-07-13T06:08:49.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/products/marketing-cloud/engage-studio/experiences","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}