Chat Widget

Create an embedded chat widget

Embedded placement renders any supported Chat Widget type inline inside your page content instead of floating over it as a chat bubble. It is available for every supported chat type — All-In-One Chat, SMS/Email Chat, Live Chat, Facebook Chat, Instagram Chat, WhatsApp Chat, and Voice AI — and it works on funnels, websites, landing pages, and custom HTML sites.

Create an embedded chat widget

Embedded / Inline is a placement option on every supported widget type, so you can convert an existing widget or start from a new one.

  1. Go to Sites > Chat Widget.

  2. Click + New to create a widget, or open an existing widget.

  3. Select a widget type: All-In-One Chat, SMS/Email Chat, Live Chat, Facebook Chat, Instagram Chat, WhatsApp Chat, or Voice AI.

  4. Open the Style tab.

  5. Under Widget Placement, choose Embedded / Inline (Renders inside content).

  6. Customize the widget. Theme and appearance options cover color themes, avatar, header, and colors. Chat Window options cover the intro message, contact form fields such as Name and Phone, mandatory fields, and button text. Messaging and behavior options cover auto-responses, live-chat assignment, business hours, and chat-closed messages.

  7. Click Get Code in the top right, then copy the embed script.

For the full walkthrough of the Chat Widget, see Getting started with the Chat Widget. For more on styling options, see Chat Widget customizations.

Install the widget on your site

The widget renders exactly where you place the embed code, so decide which section of the page should hold the chat before you paste.

  • Funnels: open the Funnel Builder, add a Custom Code element where the chat should appear, paste the embed code, then save and publish the funnel.

  • Websites and landing pages: open the website editor, paste the embed code in the section where the chat should appear, then publish the page.

  • Custom HTML sites: open the website editor or HTML file, paste the embed code in the desired section, then publish.

To add the widget to a JourneyCARE website, see Add the Chat Widget to a JourneyCARE website.

How embedded widgets behave

Embedded placement is a presentation option, not a new channel: the widget still uses the chat type you selected. Embedded widgets:

  • Open automatically within the page and stay continuously visible — visitors cannot minimize them.

  • Do not show the floating chat bubble or the initial prompt popup.

  • Use dimensions optimized for an embedded layout, and floating-bubble-only settings and controls are hidden automatically.

  • Render inline exactly where the code is placed, and sticky widgets can still be used on other pages.

  • In an All-In-One Chat widget, let visitors switch between the available channels without leaving the embedded widget.

Using multiple embedded widgets on one page is not recommended because it can cause user-experience and tracking conflicts.

Switching a widget between Sticky and Embedded placement while custom dimensions are configured resets the dimensions to the recommended defaults for the new placement.

Troubleshooting

Match the symptom you are seeing and check the corresponding fix below.

The widget does not appear on the page

Verify the embed code is correctly placed in the page, then confirm the page is published.

The widget has layout problems

Verify the container width fits the page layout, then check for CSS conflicts with the page's existing styles.

Chat does not respond

Check the assignment settings and the business-hours configuration for the widget.

Was this helpful?
Was this helpful?