Widget Mode: Voice, Chat, or Voice & ChatWidget Size: Choose between standard or extra large layout
Standard: Compact floating widget suitable for most use cases
Extra Large: Half-screen panel on desktop, full-screen on mobile — ideal for detailed conversations
Position: Choose from 8 positions (bottom-right, bottom-left, bottom-center, middle-right, middle-left, top-right, top-left, top-center)Primary Color: Brand color for buttons and accentsToggle Button Size: Small or NormalToggle Button Style: Animated (glass morphism) or Simple (flat design)Auto-Open on Page Load: When enabled, the widget automatically expands when the page loads — no click required from the visitor.
Custom Avatar: Upload your own avatar image to replace the default widget icon. Appears on the toggle button and in the chat header. Max file size: 512KB, 1:1 aspect ratio (square).Button Main Text (default: “Need help?”) — primary text on the widget buttonButton Sub Text (default: “Chat with us”) — secondary text, hidden when using the small button sizeTab Labels (Voice & Chat mode only):
Voice Tab Label (default: “Voice”) — rename to match your brand language (e.g., “Call Us”, “Speak”)
Chat Tab Label (default: “Chat”) — rename to match your brand language (e.g., “Message”, “Text”)
Header Title (default: “AI Assistant”)Header Subtitle (default: “Ready to help you ✨”)Modal Title (default: “Ready to chat?”)Start Button Text (default: “Start Voice Chat”)Modal Description (default: “Click below to start your conversation”)
This tab is only visible when the widget mode includes chat (Chat Only or Voice & Chat).
Chat Placeholder (default: “Type your message…”)Send Button Label (default: “Send message”) — accessibility label for the send buttonShow Function Calls: When disabled (default), LLM tool calls (e.g., calendar lookups, knowledge base queries) are hidden from the chat, keeping the conversation clean for end users. Enable to show tool usage details.
The chat widget supports markdown formatting, so your AI assistant can send clickable links, bold text, lists, and more.To include clickable URLs in chat messages, use markdown link format in your assistant’s prompt or initial message:
Check out our [latest offers](https://example.com/offers) or visit our [help center](https://example.com/help).
Add an instruction to your assistant’s prompt like: “When sharing links or URLs, always format them as clickable markdown links: [link text](url)” — this ensures the AI consistently outputs clickable links instead of plain text URLs.
Collect information before starting conversations:Form Configuration:
Pre-form Title (default: “Before we start…”)
Pre-form Description (default: “Please provide some information to help us assist you better”)
Submit Button Text (default: “Continue”)
Form Fields:
Add custom fields to collect data:
Variable Name: Internal variable name (maps to assistant variables). Only letters, numbers, dashes, and underscores allowed.
Field Label: Display label shown to users
Field Type: Text, Email, Phone, or Textarea
Required: Make field mandatory
Placeholder: Placeholder text shown in the field
Helper Text: Optional description below the field
Variable Mapping:
Form field names automatically map to your assistant’s variables, making collected data available during conversations.Example Form Fields:
Name: Full Name (required, text)Email: Email Address (required, email)Company: Company Name (optional, text)Message: How can we help? (optional, textarea)
AI Enabled: When toggled on (default), the AI assistant automatically responds to incoming messages. Turn this off if you want to use the widget for manual-only conversations — messages are collected but the AI does not reply.
Webhook URL: Enter a URL to receive a webhook notification whenever a new conversation starts via the widget. Use this to trigger automation flows, log events to your CRM, or notify your team in real-time.
Enable Widget: Master toggle that controls whether the widget loads on your website. When disabled, the widget will not appear even if the embed script is installed on your site. Use this to temporarily hide the widget without removing code from your website.
At the top of the configuration panel, a live preview shows exactly how your widget will look and behave on a website. The preview updates in real-time as you change any setting.Copy Preview URL — copies the preview URL to your clipboard so you can open it in a separate browser tab or share it with your team for review.Reset Data — clears all stored conversation history, form submissions, and preferences in the preview. Use this to simulate a first-time visitor experience after testing.
The preview is fully interactive — you can click the widget button, fill out the pre-chat form, and start a real conversation to test your configuration before deploying.
The embed code section provides a ready-to-copy script tag. Click Copy to copy it to your clipboard, then paste it into your website before the closing </body> tag:
Save your widget settings before copying the embed code. The script loads all configuration from the server, so any unsaved changes won’t appear on your website.
{"docsConfig":{"$schema":"https://mintlify.com/docs.json","theme":"mint","name":"HeyFred","colors":{"primary":"#002C4B","light":"#002C4B","dark":"#002C4B"},"favicon":"https://mintcdn.com/fred-f66719fb/uWiJgpSH4NzHH7q7/favicon.png?fit=max\u0026auto=format\u0026n=uWiJgpSH4NzHH7q7\u0026q=85\u0026s=1b851ced7309790b365115dc68c2b649","logo":{"light":"https://mintcdn.com/fred-f66719fb/BJtycDUiTDWfRCya/resources/logo/light.png?fit=max\u0026auto=format\u0026n=BJtycDUiTDWfRCya\u0026q=85\u0026s=eed18f4dedcec96f17080f09b4d10850","dark":"https://mintcdn.com/fred-f66719fb/BJtycDUiTDWfRCya/resources/logo/dark.png?fit=max\u0026auto=format\u0026n=BJtycDUiTDWfRCya\u0026q=85\u0026s=e1ed5d1be6aef6d87fc295d1412026a3"},"api":{"mdx":{"server":"https://app.heyfred.nl/api/","auth":{"method":"bearer","name":null}}},"navbar":{"links":[{"label":"Home","href":"https://heyfred.nl"},{"label":"Support","href":"https://heyfred.nl/contact"}],"primary":{"type":"button","label":"Dashboard","href":"https://app.heyfred.nl"}},"footer":{"socials":{"linkedin":"https://www.linkedin.com/company/assistent-fred/"}},"styling":{"latex":true},"navigation":{"pages":[]}},"deployment":{"deploymentMetadataValue":{"subdomain":"fred-f66719fb","hasAudioNarration":false,"actualSubdomain":"fred-f66719fb","customDomains":["docs.heyfred.nl"],"gitSource":{"type":"github","owner":"heyfredbv","repo":"heyfred-docs","deployBranch":"main","contentDirectory":"","isPrivate":false,"mountPath":"","label":""},"chroma":{"liveDeploymentHistoryId":"6a679d4ec8fbf8945475b90d","collectionId":"49f78201-cc71-4661-baf3-737f77bb7fc9","schemaVersion":"v3","latestBuiltDeploymentHistoryId":"6a679d4ec8fbf8945475b90d"},"entitlements":{},"buildId":"6a679d4ec8fbf8945475b90d:success","clientVersion":"0.0.3965","searchFilterCounts":[{"language":"default","tag":"API Reference","count":97},{"language":"default","tag":"Platform Guide","count":86},{"language":"default","tag":"AI Assistants Overview","count":21},{"language":"default","tag":"Assistants","count":16},{"language":"default","tag":"Troubleshooting \u0026 FAQs","count":12},{"language":"default","tag":"Automations","count":10},{"language":"default","tag":"Knowledgebases","count":10},{"language":"default","tag":"Phone Numbers","count":10},{"language":"default","tag":"No-Code Automation","count":10},{"language":"default","tag":"Conversations","count":8}]},"assistantConfig":{},"hasChatPermissions":false,"hasWebMcpPermissions":false,"toggles":[{"name":"kill-isr","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-mintlify-slack","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-v7-file-tree","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-integrations-settings","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-pr-grouping","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-prefix","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"analytics-v7","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"user-flows-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"no-publish-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-onboarding","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"llms-txt-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"pause-universal-search-reconcile","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving-live","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"stripTemperatureMiddleware","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"per-site-search-delta","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"support-platform-pylon-zendesk","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"instant-rollback","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications-server","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-private-page-search","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-fable","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fixed-ai-action-pricing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automation-resolve-merge-conflict","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"scoped-publishing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"mintql","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"page-level-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-version-history-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-nav-generations","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-page-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workspace-projects","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"assistant-v5","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"byok-sep-25","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fork-pr-previews","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"revalidation-jwt","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"vite-origin","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-agent-model-picker","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-updated-9-15","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"hobby-abuse-scan","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"dashboard-inbox","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false}],"isAtlas":false,"googleFontsInlined":false},"customCss":[],"page":{"pagePath":"ai-assistants/web-widget","slug":"/ai-assistants/web-widget","pageMetadata":{"title":"Web Widget","icon":"code","description":"Embed your AI assistant on your website with voice and chat capabilities","href":"/ai-assistants/web-widget"},"description":{"compiledSource":"\"use strict\";\nconst {jsx: _jsx} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n p: \"p\",\n ..._provideComponents(),\n ...props.components\n };\n return _jsx(_components.p, {\n children: \"Embed your AI assistant on your website with voice and chat capabilities\"\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\n","frontmatter":{},"scope":{}},"pageType":"default","mdx":{"mdxSource":{"compiledSource":"\"use strict\";const{Fragment:_Fragment,jsx:_jsx,jsxs:_jsxs}=arguments[0];const{useMDXComponents:_provideComponents}=arguments[0];function _createMdxContent(props){const _components={a:`a`,code:`code`,em:`em`,li:`li`,ol:`ol`,p:`p`,pre:`pre`,span:`span`,strong:`strong`,ul:`ul`,..._provideComponents(),...props.components},{CodeBlock,Frame,Heading,Note,OptimizedImage,Tip,Warning}=_components;if(!CodeBlock)_missingMdxReference(`CodeBlock`,true);if(!Frame)_missingMdxReference(`Frame`,true);if(!Heading)_missingMdxReference(`Heading`,true);if(!Note)_missingMdxReference(`Note`,true);if(!OptimizedImage)_missingMdxReference(`OptimizedImage`,true);if(!Tip)_missingMdxReference(`Tip`,true);if(!Warning)_missingMdxReference(`Warning`,true);return _jsxs(_Fragment,{children:[_jsx(_components.p,{children:`Add your AI assistant to any website with a customizable widget that supports voice calls, text chat, or both.`}),`\n`,_jsx(Heading,{level:`2`,id:`overview`,children:`Overview`}),`\n`,_jsx(_components.p,{children:`The Web Widget allows website visitors to interact with your AI assistant directly through:`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Voice conversations:`}),` Real-time voice calls in the browser`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Text chat:`}),` Messaging interface for text-based interactions`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Hybrid mode:`}),` Seamless switching between voice and chat`]}),`\n`]}),`\n`,_jsx(Heading,{level:`2`,id:`accessing-widget-configuration`,children:`Accessing Widget Configuration`}),`\n`,_jsxs(_components.ol,{children:[`\n`,_jsx(_components.li,{children:`Navigate to your assistant’s edit page`}),`\n`,_jsxs(_components.li,{children:[`Click the `,_jsx(_components.strong,{children:`“Web widget”`}),` button (yellow/warning color)`]}),`\n`,_jsx(_components.li,{children:`The widget configuration panel opens with live preview`}),`\n`]}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/web-widget-button.png?fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=294d05bba68354743374dcafb7b7c00e`,alt:`Web Widget Button Location`,\"data-og-width\":`1724`,width:`1724`,\"data-og-height\":`1216`,height:`1216`,\"data-path\":`resources/web-widget-button.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/web-widget-button.png?w=280\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=cad1d47fd1edca23382da7aca34aa7c4 280w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/web-widget-button.png?w=560\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=52e18203ce4c1410bd560cf24657977c 560w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/web-widget-button.png?w=840\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=ebd6ad66b3cfb8e8c8729187a531cab7 840w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/web-widget-button.png?w=1100\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=e1aba87384aaae8a7230f313ff48bae5 1100w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/web-widget-button.png?w=1650\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=e75ae9c77c10c854079761506f811db0 1650w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/web-widget-button.png?w=2500\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=a33c8efa91cd49e797aaa737fc136843 2500w`})}),`\n`,_jsx(Note,{children:_jsx(_components.p,{children:`Web Widget is a premium feature. Ensure your plan includes web widget access before configuration.`})}),`\n`,_jsx(Heading,{level:`2`,id:`widget-modes`,children:`Widget Modes`}),`\n`,_jsx(_components.p,{children:`Choose how visitors interact with your assistant:`}),`\n`,_jsx(Heading,{level:`3`,id:`voice-\u0026-chat-recommended`,children:`Voice \u0026 Chat (Recommended)`}),`\n`,_jsx(_components.p,{children:`Users can seamlessly switch between voice and text during conversations.`}),`\n`,_jsx(_components.p,{children:_jsx(_components.strong,{children:`Best for:`})}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Maximum flexibility for users`}),`\n`,_jsx(_components.li,{children:`Accessibility (voice for mobile, chat for quiet environments)`}),`\n`,_jsx(_components.li,{children:`Complex interactions requiring both modes`}),`\n`]}),`\n`,_jsx(Heading,{level:`3`,id:`chat-only`,children:`Chat Only`}),`\n`,_jsx(_components.p,{children:`Text-based messaging interface only.`}),`\n`,_jsx(_components.p,{children:_jsx(_components.strong,{children:`Best for:`})}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Customer support and FAQs`}),`\n`,_jsx(_components.li,{children:`Environments where voice isn’t appropriate`}),`\n`,_jsx(_components.li,{children:`Lead capture and qualification forms`}),`\n`]}),`\n`,_jsx(Heading,{level:`3`,id:`voice-only`,children:`Voice Only`}),`\n`,_jsx(_components.p,{children:`Real-time voice conversations only.`}),`\n`,_jsx(_components.p,{children:_jsx(_components.strong,{children:`Best for:`})}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Phone-like experience on website`}),`\n`,_jsx(_components.li,{children:`Voice-first use cases`}),`\n`,_jsx(_components.li,{children:`Hands-free interactions`}),`\n`]}),`\n`,_jsx(Heading,{level:`2`,id:`configuration-options`,children:`Configuration Options`}),`\n`,_jsx(Heading,{level:`3`,id:`general-tab`,children:`General Tab`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-general.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=1892a5ded8aac0f81733167214e2b735`,alt:`Widget General Tab`,\"data-og-width\":`1016`,width:`1016`,\"data-og-height\":`710`,height:`710`,\"data-path\":`resources/widget-tab-general.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-general.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=5433e6b6d72d73d06bb8ff1027a90d9a 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-general.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=55e3c0e93904d4c049c8b72cf2a75223 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-general.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=9ea50ae451d2ff77c4061d91495a5595 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-general.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=a5c7dd3e5016b0ac8492880bede974ba 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-general.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=72c96538c8298f2f4045a38b8a8a83b2 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-general.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=6b5c19e09955fdc0903250e54437a663 2500w`})}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Widget Mode:`}),` Voice, Chat, or Voice \u0026 Chat`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Widget Size:`}),` Choose between standard or `,_jsx(_components.strong,{children:`extra large`}),` layout`]}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Standard`}),`: Compact floating widget suitable for most use cases`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Extra Large`}),`: Half-screen panel on desktop, full-screen on mobile — ideal for detailed conversations`]}),`\n`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Position:`}),` Choose from 8 positions (bottom-right, bottom-left, bottom-center, middle-right, middle-left, top-right, top-left, top-center)`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Primary Color:`}),` Brand color for buttons and accents`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Toggle Button Size:`}),` Small or Normal`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Toggle Button Style:`}),` Animated (glass morphism) or Simple (flat design)`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Auto-Open on Page Load:`}),` When enabled, the widget automatically expands when the page loads — no click required from the visitor.`]}),`\n`,_jsx(Heading,{level:`3`,id:`button-tab`,children:`Button Tab`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-button.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=a5a6deb25cdbcc2598c8570cee0d9a6d`,alt:`Widget Button Tab`,\"data-og-width\":`1015`,width:`1015`,\"data-og-height\":`649`,height:`649`,\"data-path\":`resources/widget-tab-button.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-button.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=8987a23b6bd0bcf58283b1523a661fc2 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-button.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=34cee51bc52afd2bb885ad03c298a0a0 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-button.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=7b46ff1ceaf3d52b46b66b5348514978 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-button.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=4e5f78f91363f154d44d059da2b2c954 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-button.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=d56fe50483b7d7495087ef2fe35a59aa 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-button.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=20fb3e478d56eefab5c13b5626e332c4 2500w`})}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Custom Avatar:`}),` Upload your own avatar image to replace the default widget icon. Appears on the toggle button and in the chat header. Max file size: 512KB, 1:1 aspect ratio (square).`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Button Main Text`}),` (default: “Need help?”) — primary text on the widget button`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Button Sub Text`}),` (default: “Chat with us”) — secondary text, hidden when using the small button size`]}),`\n`,_jsx(_components.p,{children:_jsx(_components.strong,{children:`Tab Labels (Voice \u0026 Chat mode only):`})}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Voice Tab Label (default: “Voice”) — rename to match your brand language (e.g., “Call Us”, “Speak”)`}),`\n`,_jsx(_components.li,{children:`Chat Tab Label (default: “Chat”) — rename to match your brand language (e.g., “Message”, “Text”)`}),`\n`]}),`\n`,_jsx(Heading,{level:`3`,id:`header-\u0026-modal-tab`,children:`Header \u0026 Modal Tab`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-header-modal.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=31f3f4b8b75aa32586c0d92a0aab073c`,alt:`Widget Header \u0026 Modal Tab`,\"data-og-width\":`1014`,width:`1014`,\"data-og-height\":`499`,height:`499`,\"data-path\":`resources/widget-tab-header-modal.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-header-modal.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=db82954e8bc64bcab36d1d19c8d3321a 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-header-modal.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=4a659380175084b38650e75e8c8698aa 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-header-modal.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=b0bcb59cf0c276223249f964e85e10c5 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-header-modal.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=95fac35cfd5f322592c4317779a19bed 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-header-modal.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=a32ad0717d117f8e9098f15b78ade46b 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-header-modal.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=ef38fd27c64996eb7c070438b77fc863 2500w`})}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Header Title`}),` (default: “AI Assistant”)`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Header Subtitle`}),` (default: “Ready to help you ✨”)`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Modal Title`}),` (default: “Ready to chat?”)`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Start Button Text`}),` (default: “Start Voice Chat”)`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Modal Description`}),` (default: “Click below to start your conversation”)`]}),`\n`,_jsx(Heading,{level:`3`,id:`chat-settings-tab`,children:`Chat Settings Tab`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-chat-settings.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=2c32e416c30f22df151b5fe068959340`,alt:`Widget Chat Settings Tab`,\"data-og-width\":`1013`,width:`1013`,\"data-og-height\":`445`,height:`445`,\"data-path\":`resources/widget-tab-chat-settings.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-chat-settings.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=d8c3f5250d9937c8f2b1db7f8375bf84 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-chat-settings.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=dcf50182f878e200ad754751514edae7 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-chat-settings.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=3c1e3e566f4b2303b9eec39f2d47c280 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-chat-settings.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=73f6e23eb610a12607601671f083758e 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-chat-settings.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=a5f4e20392e9586a889a67c0abf0305d 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-chat-settings.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=f86499093e579460342dceb3b1ff314d 2500w`})}),`\n`,_jsx(Note,{children:_jsx(_components.p,{children:`This tab is only visible when the widget mode includes chat (Chat Only or Voice \u0026 Chat).`})}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Chat Placeholder`}),` (default: “Type your message…”)`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Send Button Label`}),` (default: “Send message”) — accessibility label for the send button`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Show Function Calls:`}),` When disabled (default), LLM tool calls (e.g., calendar lookups, knowledge base queries) are hidden from the chat, keeping the conversation clean for end users. Enable to show tool usage details.`]}),`\n`,_jsx(Heading,{level:`3`,id:`clickable-links-in-chat`,children:`Clickable Links in Chat`}),`\n`,_jsxs(_components.p,{children:[`The chat widget supports `,_jsx(_components.strong,{children:`markdown formatting`}),`, so your AI assistant can send clickable links, bold text, lists, and more.`]}),`\n`,_jsx(_components.p,{children:`To include clickable URLs in chat messages, use markdown link format in your assistant’s prompt or initial message:`}),`\n`,_jsx(CodeBlock,{numberOfLines:`2`,language:`text`,children:_jsx(_components.pre,{className:`shiki shiki-themes github-light-default dark-plus`,style:{backgroundColor:`#ffffff`,\"--shiki-dark-bg\":`#0B0C0E`,color:`#1f2328`,\"--shiki-dark\":`#D4D4D4`},language:`text`,children:_jsxs(_components.code,{language:`text`,numberOfLines:`2`,children:[_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{children:`Check out our [latest offers](https://example.com/offers) or visit our [help center](https://example.com/help).`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{})})]})})}),`\n`,_jsx(Tip,{children:_jsxs(_components.p,{children:[`Add an instruction to your assistant’s prompt like: `,_jsxs(_components.em,{children:[`“When sharing links or URLs, always format them as clickable markdown links: `,_jsx(_components.code,{children:`[link text](url)`}),`”`]}),` — this ensures the AI consistently outputs clickable links instead of plain text URLs.`]})}),`\n`,_jsx(Heading,{level:`3`,id:`voice-settings-tab`,children:`Voice Settings Tab`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-voice-settings.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=8a1f63a0c7f5e6cde56d3d289e625cff`,alt:`Widget Voice Settings Tab`,\"data-og-width\":`1014`,width:`1014`,\"data-og-height\":`480`,height:`480`,\"data-path\":`resources/widget-tab-voice-settings.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-voice-settings.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=4c2a97317b531ded10c3ee459ed41693 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-voice-settings.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=eca77ab8eeef3efc3a7f42c836a2cc04 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-voice-settings.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=99439e84311d67ad0dc75572cd3e0d5d 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-voice-settings.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=6c91435386df00a23158beb8a01168b7 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-voice-settings.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=7ee4214107210cd81acfa1d75a831046 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-tab-voice-settings.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=c8ae28dc43260f6c5e395f392909fbe6 2500w`})}),`\n`,_jsx(Note,{children:_jsx(_components.p,{children:`This tab is only visible when the widget mode includes voice (Voice Only or Voice \u0026 Chat).`})}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Connecting Text`}),` (default: “Connecting…”)`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Disconnect Text`}),` (default: “Disconnect”)`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Error Text`}),` (default: “Connection failed. Please try again.”)`]}),`\n`,_jsx(Heading,{level:`3`,id:`pre-chat-form`,children:`Pre-Chat Form`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/widget-pre-chat-form.png?fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=65aa159aaad892479abbdef559f9a4f9`,alt:`Pre-Chat Form Configuration`,\"data-og-width\":`1830`,width:`1830`,\"data-og-height\":`1266`,height:`1266`,\"data-path\":`resources/widget-pre-chat-form.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/widget-pre-chat-form.png?w=280\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=7645eea3febd269c4811c1e790f9f70c 280w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/widget-pre-chat-form.png?w=560\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=a173993fbe6501f07711a7cb993d0934 560w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/widget-pre-chat-form.png?w=840\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=7ac712c5e2f56a39a87d4674357ca84d 840w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/widget-pre-chat-form.png?w=1100\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=3bd253ae0a9e024d4f8c722434e260e6 1100w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/widget-pre-chat-form.png?w=1650\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=07ce179baf953e81309a2a9022776f95 1650w, https://mintcdn.com/fred-f66719fb/aEbn24bFdz8oLtLK/resources/widget-pre-chat-form.png?w=2500\u0026fit=max\u0026auto=format\u0026n=aEbn24bFdz8oLtLK\u0026q=85\u0026s=73f68dbc934191723fff54361d1026f7 2500w`})}),`\n`,_jsx(_components.p,{children:`Collect information before starting conversations:`}),`\n`,_jsx(_components.p,{children:_jsx(_components.strong,{children:`Form Configuration:`})}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Pre-form Title (default: “Before we start…”)`}),`\n`,_jsx(_components.li,{children:`Pre-form Description (default: “Please provide some information to help us assist you better”)`}),`\n`,_jsx(_components.li,{children:`Submit Button Text (default: “Continue”)`}),`\n`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Form Fields:`}),`\nAdd custom fields to collect data:`]}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Variable Name:`}),` Internal variable name (maps to assistant variables). Only letters, numbers, dashes, and underscores allowed.`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Field Label:`}),` Display label shown to users`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Field Type:`}),` Text, Email, Phone, or Textarea`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Required:`}),` Make field mandatory`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Placeholder:`}),` Placeholder text shown in the field`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Helper Text:`}),` Optional description below the field`]}),`\n`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Variable Mapping:`}),`\nForm field names automatically map to your assistant’s variables, making collected data available during conversations.`]}),`\n`,_jsx(_components.p,{children:_jsx(_components.strong,{children:`Example Form Fields:`})}),`\n`,_jsx(CodeBlock,{numberOfLines:`5`,language:`text`,children:_jsx(_components.pre,{className:`shiki shiki-themes github-light-default dark-plus`,style:{backgroundColor:`#ffffff`,\"--shiki-dark-bg\":`#0B0C0E`,color:`#1f2328`,\"--shiki-dark\":`#D4D4D4`},language:`text`,children:_jsxs(_components.code,{language:`text`,numberOfLines:`5`,children:[_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{children:`Name: Full Name (required, text)`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{children:`Email: Email Address (required, email)`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{children:`Company: Company Name (optional, text)`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{children:`Message: How can we help? (optional, textarea)`})}),`\n`,_jsx(_components.span,{className:`line`,children:_jsx(_components.span,{})})]})})}),`\n`,_jsx(Heading,{level:`3`,id:`ai-response-settings`,children:`AI Response Settings`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-ai-response-settings.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=19e5154b99b9c1a8adf521b0a2bea696`,alt:`Widget AI Response Settings`,\"data-og-width\":`1012`,width:`1012`,\"data-og-height\":`189`,height:`189`,\"data-path\":`resources/widget-ai-response-settings.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-ai-response-settings.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=ae331f072d8f93ab575fb69d0e7e6357 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-ai-response-settings.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=cb7d097ab8880733bb2934fa14706e13 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-ai-response-settings.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=9ec045c696d571aa668a141046ae5026 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-ai-response-settings.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=353359d83acfa05b004ca807e4de1f17 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-ai-response-settings.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=0fd65fa6795d04f9d1da064d5c612758 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-ai-response-settings.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=70d547239fab433c6e60ac775552ce18 2500w`})}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`AI Enabled:`}),` When toggled on (default), the AI assistant automatically responds to incoming messages. Turn this off if you want to use the widget for manual-only conversations — messages are collected but the AI does not reply.`]}),`\n`,_jsx(Heading,{level:`3`,id:`conversation-webhook`,children:`Conversation Webhook`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-conversation-webhook.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=00c95b858d07e20898d70fcf517b4340`,alt:`Widget Conversation Webhook`,\"data-og-width\":`1011`,width:`1011`,\"data-og-height\":`313`,height:`313`,\"data-path\":`resources/widget-conversation-webhook.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-conversation-webhook.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=002d9859246080f8b67dae7dbe8f5efa 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-conversation-webhook.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=756fe283a4ae370496f582e9b0c902a6 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-conversation-webhook.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=0beafe4f9ac8d1f22bd798a594f5c53e 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-conversation-webhook.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=bba501ca55e9290499d446cd74b31f98 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-conversation-webhook.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=41641eb69b389db6ad51c1c28de1e5f0 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-conversation-webhook.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=19393f9ec2c8dc68ac150da081847255 2500w`})}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Webhook URL:`}),` Enter a URL to receive a webhook notification whenever a new conversation starts via the widget. Use this to trigger automation flows, log events to your CRM, or notify your team in real-time.`]}),`\n`,_jsx(Heading,{level:`3`,id:`widget-display`,children:`Widget Display`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-display-toggle.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=d89ef9bf67f001d22b1deef2a8c2924c`,alt:`Widget Display Toggle`,\"data-og-width\":`1016`,width:`1016`,\"data-og-height\":`271`,height:`271`,\"data-path\":`resources/widget-display-toggle.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-display-toggle.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=826d9c32f671aafac3dc5b25c0bdf2db 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-display-toggle.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=9e4abefbab17848d98d320f65777facc 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-display-toggle.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=5e74dfa6cdb77d8a43fedd8b3e281360 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-display-toggle.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=765345d6fe66b978e27a9df187b39266 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-display-toggle.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=2e178068f437384c27c8ebacf3dec5ad 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-display-toggle.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=5a998e6f819286c049cbca3b98e328e5 2500w`})}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Enable Widget:`}),` Master toggle that controls whether the widget loads on your website. When disabled, the widget will not appear even if the embed script is installed on your site. Use this to temporarily hide the widget without removing code from your website.`]}),`\n`,_jsx(Heading,{level:`2`,id:`live-widget-preview`,children:`Live Widget Preview`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-live-preview.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=24dd19494c2ffffd28544ab33ca7dba8`,alt:`Widget Live Preview`,\"data-og-width\":`1013`,width:`1013`,\"data-og-height\":`511`,height:`511`,\"data-path\":`resources/widget-live-preview.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-live-preview.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=090a2a58a7d55e1bfd145d74918575d0 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-live-preview.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=b87cb40de5237066735953f323786606 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-live-preview.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=4f29d31dadeb510e19d647ef6b2875bb 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-live-preview.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=34fb304366306f00ff20df3d0da1ced7 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-live-preview.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=7a31fb6a8cd973a484e8aabec67fdb6f 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-live-preview.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=79436a9d1b603f10f221a29ea69c0f63 2500w`})}),`\n`,_jsx(_components.p,{children:`At the top of the configuration panel, a live preview shows exactly how your widget will look and behave on a website. The preview updates in real-time as you change any setting.`}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Copy Preview URL`}),` — copies the preview URL to your clipboard so you can open it in a separate browser tab or share it with your team for review.`]}),`\n`,_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Reset Data`}),` — clears all stored conversation history, form submissions, and preferences in the preview. Use this to simulate a first-time visitor experience after testing.`]}),`\n`,_jsx(Tip,{children:_jsx(_components.p,{children:`The preview is fully interactive — you can click the widget button, fill out the pre-chat form, and start a real conversation to test your configuration before deploying.`})}),`\n`,_jsx(Heading,{level:`3`,id:`embed-code`,children:`Embed Code`}),`\n`,_jsx(Frame,{children:_jsx(OptimizedImage,{src:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-embed-code.png?fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=8b0df2556055ceb211b3ea9fa929a23b`,alt:`Widget Embed Code`,\"data-og-width\":`1012`,width:`1012`,\"data-og-height\":`270`,height:`270`,\"data-path\":`resources/widget-embed-code.png`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-embed-code.png?w=280\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=47da11acd0e8a57a4353a7e52a540437 280w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-embed-code.png?w=560\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=f46e7d64c2d9791d35575e2df8114103 560w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-embed-code.png?w=840\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=07a2738d4816e462aa3dc2c7928e528e 840w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-embed-code.png?w=1100\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=b53b23ae1869ea46096cebd1b17dde72 1100w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-embed-code.png?w=1650\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=a750a36357032671935d906feb5814fe 1650w, https://mintcdn.com/fred-f66719fb/DHH-adzjgdJo9dde/resources/widget-embed-code.png?w=2500\u0026fit=max\u0026auto=format\u0026n=DHH-adzjgdJo9dde\u0026q=85\u0026s=8ad05f23bb2d20dd088f0cac656163da 2500w`})}),`\n`,_jsxs(_components.p,{children:[`The embed code section provides a ready-to-copy script tag. Click `,_jsx(_components.strong,{children:`Copy`}),` to copy it to your clipboard, then paste it into your website before the closing `,_jsx(_components.code,{children:`\u003c/body>`}),` tag:`]}),`\n`,_jsx(CodeBlock,{filename:``,numberOfLines:`3`,language:`html`,children:_jsx(_components.pre,{className:`shiki shiki-themes github-light-default dark-plus`,style:{backgroundColor:`#ffffff`,\"--shiki-dark-bg\":`#0B0C0E`,color:`#1f2328`,\"--shiki-dark\":`#D4D4D4`},language:`html`,children:_jsxs(_components.code,{language:`html`,numberOfLines:`3`,children:[_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:`\u003c`}),_jsx(_components.span,{style:{color:`#116329`,\"--shiki-dark\":`#569CD6`},children:`script`}),_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` src`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"https://app.heyfred.nl/embed.js\"`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#0550AE`,\"--shiki-dark\":`#9CDCFE`},children:` data-assistant-id`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#D4D4D4`},children:`=`}),_jsx(_components.span,{style:{color:`#0A3069`,\"--shiki-dark\":`#CE9178`},children:`\"your-assistant-id\"`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:`>`})]}),`\n`,_jsxs(_components.span,{className:`line`,children:[_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:`\u003c/`}),_jsx(_components.span,{style:{color:`#116329`,\"--shiki-dark\":`#569CD6`},children:`script`}),_jsx(_components.span,{style:{color:`#1F2328`,\"--shiki-dark\":`#808080`},children:`>`})]}),`\n`]})})}),`\n`,_jsx(Warning,{children:_jsxs(_components.p,{children:[`Save your widget settings `,_jsx(_components.strong,{children:`before`}),` copying the embed code. The script loads all configuration from the server, so any unsaved changes won’t appear on your website.`]})}),`\n`,_jsx(Heading,{level:`2`,id:`installation`,children:`Installation`}),`\n`,_jsxs(_components.ol,{children:[`\n`,_jsx(_components.li,{children:`Configure and save your widget settings`}),`\n`,_jsxs(_components.li,{children:[`Copy the embed code from the `,_jsx(_components.strong,{children:`Embed Code`}),` section`]}),`\n`,_jsxs(_components.li,{children:[`Paste the script tag before the closing `,_jsx(_components.code,{children:`\u003c/body>`}),` tag on your website`]}),`\n`,_jsx(_components.li,{children:`Visit your website and verify the widget appears in the configured position`}),`\n`,_jsx(_components.li,{children:`Test voice/chat functionality and pre-chat form (if configured)`}),`\n`]}),`\n`,_jsx(Heading,{level:`2`,id:`widget-behavior`,children:`Widget Behavior`}),`\n`,_jsx(Heading,{level:`3`,id:`first-visit`,children:`First Visit`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Widget button appears in configured position`}),`\n`,_jsx(_components.li,{children:`Click opens modal/chat interface`}),`\n`,_jsx(_components.li,{children:`Pre-chat form displays (if configured)`}),`\n`,_jsx(_components.li,{children:`After form submission, conversation starts`}),`\n`]}),`\n`,_jsx(Heading,{level:`3`,id:`return-visits`,children:`Return Visits`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Previous conversation state may be restored`}),`\n`,_jsx(_components.li,{children:`Form data remembered (if visitor hasn’t cleared cookies)`}),`\n`,_jsx(_components.li,{children:`Seamless continuation of support experience`}),`\n`]}),`\n`,_jsx(Heading,{level:`3`,id:`conversation-tracking`,children:`Conversation Tracking`}),`\n`,_jsxs(_components.p,{children:[`All widget conversations appear in your `,_jsx(_components.a,{href:`/conversations/overview`,children:`Conversations`}),` page for review and analysis.`]}),`\n`,_jsx(Warning,{children:_jsx(_components.p,{children:`HTTPS (SSL certificate) is required for voice functionality. HTTP sites can only use chat mode due to browser security restrictions.`})}),`\n`,_jsx(Heading,{level:`2`,id:`troubleshooting`,children:`Troubleshooting`}),`\n`,_jsxs(_components.p,{children:[`For setup and configuration issues, see `,_jsx(_components.a,{href:`/troubleshooting/web-widget`,children:`Web Widget Troubleshooting`}),`.`]}),`\n`,_jsx(Heading,{level:`2`,id:`next-steps`,children:`Next Steps`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Test widget using the live preview`}),`\n`,_jsx(_components.li,{children:`Embed code on your website`}),`\n`,_jsxs(_components.li,{children:[`Monitor conversations in the `,_jsx(_components.a,{href:`/conversations/overview`,children:`Conversations`}),` page`]}),`\n`]})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={..._provideComponents(),...props.components};return MDXLayout?_jsx(MDXLayout,{...props,children:_jsx(_createMdxContent,{...props})}):_createMdxContent(props)}return{default:MDXContent};function _missingMdxReference(id,component){throw new Error(`Expected `+(component?`component`:`object`)+\" `\"+id+\"` to be defined: you likely forgot to import, pass, or provide it.\")}","frontmatter":{},"scope":{"config":{},"pageMetadata":{"title":"Web Widget","icon":"code","description":"Embed your AI assistant on your website with voice and chat capabilities","href":"/ai-assistants/web-widget"}}},"mdxSourceWithNoJs":null},"mdxExtracts":{"tableOfContents":[{"title":"Overview","slug":"overview","depth":2,"children":[]},{"title":"Accessing Widget Configuration","slug":"accessing-widget-configuration","depth":2,"children":[]},{"title":"Widget Modes","slug":"widget-modes","depth":2,"children":[{"title":"Voice \u0026 Chat (Recommended)","slug":"voice-\u0026-chat-recommended","depth":3,"children":[]},{"title":"Chat Only","slug":"chat-only","depth":3,"children":[]},{"title":"Voice Only","slug":"voice-only","depth":3,"children":[]}]},{"title":"Configuration Options","slug":"configuration-options","depth":2,"children":[{"title":"General Tab","slug":"general-tab","depth":3,"children":[]},{"title":"Button Tab","slug":"button-tab","depth":3,"children":[]},{"title":"Header \u0026 Modal Tab","slug":"header-\u0026-modal-tab","depth":3,"children":[]},{"title":"Chat Settings Tab","slug":"chat-settings-tab","depth":3,"children":[]},{"title":"Clickable Links in Chat","slug":"clickable-links-in-chat","depth":3,"children":[]},{"title":"Voice Settings Tab","slug":"voice-settings-tab","depth":3,"children":[]},{"title":"Pre-Chat Form","slug":"pre-chat-form","depth":3,"children":[]},{"title":"AI Response Settings","slug":"ai-response-settings","depth":3,"children":[]},{"title":"Conversation Webhook","slug":"conversation-webhook","depth":3,"children":[]},{"title":"Widget Display","slug":"widget-display","depth":3,"children":[]}]},{"title":"Live Widget Preview","slug":"live-widget-preview","depth":2,"children":[{"title":"Embed Code","slug":"embed-code","depth":3,"children":[]}]},{"title":"Installation","slug":"installation","depth":2,"children":[]},{"title":"Widget Behavior","slug":"widget-behavior","depth":2,"children":[{"title":"First Visit","slug":"first-visit","depth":3,"children":[]},{"title":"Return Visits","slug":"return-visits","depth":3,"children":[]},{"title":"Conversation Tracking","slug":"conversation-tracking","depth":3,"children":[]}]},{"title":"Troubleshooting","slug":"troubleshooting","depth":2,"children":[]},{"title":"Next Steps","slug":"next-steps","depth":2,"children":[]}],"codeExamples":{}},"jsLinks":[],"subdomain":"fred-f66719fb","siteName":"HeyFred","title":"Web Widget - HeyFred","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{}},"lastModified":"2026-07-02T10:41:43.653Z","originalFileLocation":"ai-assistants/web-widget.mdx"},"headHtml":"\u003cscript data-mint-head>(function(){var d=document.documentElement,p=null;if(!p){try{p=localStorage.getItem(\"isDarkMode\")}catch(e){}if(p==='true')p='dark';else if(p==='false')p='light';if(p!=='light'\u0026\u0026p!=='dark'\u0026\u0026p!=='system')p=\"system\"}var r=p==='system'?(matchMedia(\"(prefers-color-scheme: dark)\").matches?'dark':'light'):p;d.classList.remove(r==='dark'?'light':'dark');d.classList.add(r);d.setAttribute(\"data-theme-preference\",p)})();\u003c/script>\u003cmeta data-mint-head name=\"description\" content=\"Embed your AI assistant on your website with voice and chat capabilities\">\u003cmeta data-mint-head name=\"application-name\" content=\"HeyFred\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon/android-chrome-192x192.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"180x180\" href=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon/apple-touch-icon.png\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon/favicon-16x16.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon/favicon-32x32.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon/favicon.ico\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon-dark/android-chrome-192x192.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon-dark/favicon-16x16.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon-dark/favicon-32x32.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon-dark/favicon.ico\" media=\"(prefers-color-scheme: dark)\">\u003cmeta data-mint-head property=\"og:title\" content=\"Web Widget - HeyFred\">\u003cmeta data-mint-head property=\"og:description\" content=\"Embed your AI assistant on your website with voice and chat capabilities\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"HeyFred\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://docs.heyfred.nl/ai-assistants/web-widget\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head property=\"og:image\" content=\"https://fred-f66719fb.mintlify.app/_mintlify/api/og/v2?division=AI+Assistants+Overview\u0026amp;title=Web+Widget\u0026amp;description=Embed+your+AI+assistant+on+your+website+with+voice+and+chat+capabilities\u0026amp;theme=bc90dad9d8132084d844ec3c\u0026amp;signature=863ae44203c23ebc61ecb4ad4d9ded5837c0d93c6409ee3e64a44a8292c5e955\">\u003cmeta data-mint-head property=\"og:image:width\" content=\"1200\">\u003cmeta data-mint-head property=\"og:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Web Widget - HeyFred\">\u003cmeta data-mint-head name=\"twitter:description\" content=\"Embed your AI assistant on your website with voice and chat capabilities\">\u003cmeta data-mint-head name=\"twitter:image\" content=\"https://fred-f66719fb.mintlify.app/_mintlify/api/og/v2?division=AI+Assistants+Overview\u0026amp;title=Web+Widget\u0026amp;description=Embed+your+AI+assistant+on+your+website+with+voice+and+chat+capabilities\u0026amp;theme=bc90dad9d8132084d844ec3c\u0026amp;signature=863ae44203c23ebc61ecb4ad4d9ded5837c0d93c6409ee3e64a44a8292c5e955\">\u003cmeta data-mint-head name=\"twitter:image:width\" content=\"1200\">\u003cmeta data-mint-head name=\"twitter:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"/mintlify-assets/_mintlify/favicons/fred-f66719fb/3_lbsaEWaZp53zAV/_generated/favicon/browserconfig.xml\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"HeyFred\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#002C4B\">\u003clink data-mint-head rel=\"canonical\" href=\"https://docs.heyfred.nl/ai-assistants/web-widget\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/ai-assistants/web-widget.md\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://docs.heyfred.nl/#organization\",\"name\":\"HeyFred\",\"url\":\"https://docs.heyfred.nl\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://mintcdn.com/fred-f66719fb/BJtycDUiTDWfRCya/resources/logo/light.png?fit=max\u0026auto=format\u0026n=BJtycDUiTDWfRCya\u0026q=85\u0026s=eed18f4dedcec96f17080f09b4d10850\"}},{\"@type\":\"WebSite\",\"@id\":\"https://docs.heyfred.nl#website\",\"name\":\"HeyFred\",\"url\":\"https://docs.heyfred.nl\",\"publisher\":{\"@id\":\"https://docs.heyfred.nl/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://docs.heyfred.nl/ai-assistants/web-widget#webpage\",\"url\":\"https://docs.heyfred.nl/ai-assistants/web-widget\",\"name\":\"Web Widget\",\"description\":\"Embed your AI assistant on your website with voice and chat capabilities\",\"dateModified\":\"2026-07-02T10:41:43.653Z\",\"isPartOf\":{\"@id\":\"https://docs.heyfred.nl#website\"},\"breadcrumb\":{\"@id\":\"https://docs.heyfred.nl/ai-assistants/web-widget#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://docs.heyfred.nl/ai-assistants/web-widget#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"AI Assistants Overview\",\"item\":\"https://docs.heyfred.nl/ai-assistants/what-is-ai-assistant\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Web Widget\",\"item\":\"https://docs.heyfred.nl/ai-assistants/web-widget\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://docs.heyfred.nl/ai-assistants/web-widget#article\",\"headline\":\"Web Widget\",\"name\":\"Web Widget\",\"description\":\"Embed your AI assistant on your website with voice and chat capabilities\",\"url\":\"https://docs.heyfred.nl/ai-assistants/web-widget\",\"mainEntityOfPage\":{\"@id\":\"https://docs.heyfred.nl/ai-assistants/web-widget#webpage\"},\"dateModified\":\"2026-07-02T10:41:43.653Z\",\"publisher\":{\"@id\":\"https://docs.heyfred.nl/#organization\"},\"isPartOf\":{\"@id\":\"https://docs.heyfred.nl#website\"}}]}\u003c/script>\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@type\":\"WebSite\",\"name\":\"HeyFred\",\"creator\":{\"@type\":\"Organization\",\"name\":\"Mintlify\",\"url\":\"https://mintlify.com\"}}\u003c/script>","siteName":"HeyFred","nav":{"global":null,"anchors":[{"anchor":"Platform Guide","icon":"book","groups":[{"group":"Introduction","pages":[{"title":"What is HeyFred?","icon":"circle-question","href":"/introduction/what-is-heyfred"},{"title":"How It Works (Quick Overview)","icon":"diagram-project","href":"/introduction/how-it-works"},{"title":"Key Terminology","icon":"book","href":"/introduction/key-terminology"}]},{"group":"Getting Started","pages":[{"title":"Core Concepts","icon":"lightbulb","href":"/getting-started/core-concepts"},{"title":"Understanding Call Minutes \u0026 Billing","icon":"credit-card","href":"/getting-started/understanding-billing"}]},{"group":"AI Assistants Overview","pages":[{"title":"What is an AI Assistant?","icon":"robot","href":"/ai-assistants/what-is-ai-assistant"},{"group":"Creating and Editing an AI Assistant","icon":"robot","pages":[{"title":"General Settings","icon":"gear","href":"/ai-assistants/settings/general"},{"title":"Prompt \u0026 Tools","icon":"wrench","href":"/ai-assistants/settings/prompt-and-tools"},{"title":"Post-call Actions","icon":"webhook","href":"/ai-assistants/settings/post-call-actions"}]},{"title":"Assistant Modes","icon":"wave-pulse","href":"/ai-assistants/assistant-modes"},{"title":"Assistant best practices","icon":"sliders","href":"/ai-assistants/assistant-configuration"},{"title":"System Prompts","icon":"brain","href":"/ai-assistants/system-prompt"},{"title":"AI Prompt Editor","icon":"sparkles","href":"/ai-assistants/ai-prompt-editor"},{"title":"Flow Builder","icon":"share-nodes","href":"/ai-assistants/flow-builder"},{"title":"Initial Message \u0026 Audio","icon":"message-dots","href":"/ai-assistants/initial-message"},{"title":"Tools \u0026 Functions","icon":"screwdriver-wrench","href":"/ai-assistants/tools-and-functions"},{"title":"Custom Mid-Call Tools","icon":"code-branch","href":"/ai-assistants/custom-tools"},{"title":"MCP Servers","icon":"share-nodes","href":"/ai-assistants/mcp-servers"},{"title":"Voice Selection \u0026 Voice Cloning","icon":"microphone","href":"/ai-assistants/voice-selection"},{"title":"Filler Audio","icon":"volume","href":"/ai-assistants/filler-audio"},{"title":"Cal.com Appointment Scheduling","icon":"calendar-days","href":"/ai-assistants/cal-com-scheduling"},{"title":"Calendly Appointment Scheduling","icon":"calendar-days","href":"/ai-assistants/calendly-scheduling"},{"title":"GoHighLevel Appointment Scheduling","icon":"calendar-plus","href":"/ai-assistants/gohighlevel-scheduling"},{"title":"Testing Your Assistant","icon":"vial","href":"/ai-assistants/testing"},{"title":"Test Chat Interface","icon":"comment-dots","description":"Test your assistant with a text-based chat interface for rapid iteration","href":"/ai-assistants/test-chat"},{"title":"Web Widget","icon":"code","href":"/ai-assistants/web-widget"}]},{"group":"Campaigns","icon":"bullhorn","pages":[{"title":"Campaigns Overview","icon":"bullhorn","description":"Create and manage call, WhatsApp, and SMS campaigns to reach leads at scale","href":"/campaigns/index"},{"title":"Creating a Campaign","icon":"plus","href":"/campaigns/creating-campaigns"}]},{"group":"Leads","icon":"users","pages":[{"title":"Leads Overview","icon":"users","href":"/leads/index"},{"title":"Managing Leads","icon":"user-gear","href":"/leads/managing-leads"},{"title":"Importing Leads","icon":"file-import","href":"/leads/importing-leads"}]},{"group":"Custom Dashboards","icon":"chart-line","pages":[{"title":"Custom Dashboards","icon":"chart-line","href":"/custom-dashboards/overview"},{"title":"Widget Configuration","icon":"sliders","href":"/custom-dashboards/widget-types"}]},{"group":"Conversations","icon":"messages","pages":[{"title":"Conversations Overview","icon":"messages","href":"/conversations/overview"},{"title":"Viewing \u0026 Managing Conversations","icon":"list-check","href":"/conversations/viewing-and-managing"}]},{"group":"WhatsApp Business","icon":"whatsapp","pages":[{"title":"WhatsApp Business Integration","icon":"whatsapp","href":"/whatsapp/overview"},{"title":"WhatsApp Senders","icon":"phone","href":"/whatsapp/senders"},{"title":"Message Templates","icon":"file-lines","href":"/whatsapp/templates"},{"title":"WhatsApp Conversations","icon":"messages","href":"/whatsapp/conversations"},{"title":"WhatsApp Automation","icon":"bolt","href":"/whatsapp/automation"}]},{"group":"Phone Numbers","pages":[{"title":"Types of Phone Numbers","icon":"phone","href":"/phone-numbers/types"},{"title":"Purchasing \u0026 Managing Numbers","icon":"phone-plus","href":"/phone-numbers/purchasing-and-managing"},{"title":"Pricing \u0026 Regions","icon":"money-bill","href":"/phone-numbers/pricing-and-regions"},{"title":"SMS Capabilities","icon":"message-sms","href":"/phone-numbers/sms-capabilities"},{"title":"Assigning Numbers to Assistants","icon":"link","href":"/phone-numbers/assigning-to-assistants"}]},{"group":"Inbound Calls","pages":[{"title":"Inbound Calls Overview","icon":"phone-arrow-down-left","href":"/inbound-calls/overview"},{"title":"Provisioning \u0026 Managing Phone Numbers","icon":"phone-plus","href":"/inbound-calls/provisioning"},{"title":"Configuring the Inbound Assistant","icon":"sliders","href":"/inbound-calls/configuring"},{"title":"Inbound Call Insights","icon":"chart-line","href":"/inbound-calls/insights"}]},{"group":"Outbound Calls","pages":[{"title":"Outbound Calls Overview","icon":"phone-arrow-up-right","href":"/outbound-calls/overview"},{"title":"Creating \u0026 Managing Campaigns","icon":"bullhorn","href":"/outbound-calls/campaigns"},{"title":"Caller ID \u0026 Handling","icon":"id-card","href":"/outbound-calls/caller-id"},{"title":"Voicemail Handling","icon":"voicemail","href":"/outbound-calls/voicemail-handling"},{"title":"Scripts \u0026 Prompts for Sales or Collections","icon":"file-lines","href":"/outbound-calls/scripts-and-prompts"},{"title":"Mass/Parallel Dialing","icon":"phone-volume","href":"/outbound-calls/mass-dialing"}]},{"group":"AI Prompting \u0026 Conversation Design","pages":[{"title":"Prompt Writing Basics","icon":"pen-nib","href":"/conversation-design/prompt-basics"},{"title":"Knowledge Bases","icon":"database","href":"/conversation-design/knowledge-bases"},{"title":"Handling Interruptions \u0026 Speech Sensitivity","icon":"hand","href":"/conversation-design/interruptions"},{"title":"Language \u0026 Accent Support","icon":"language","href":"/conversation-design/language-support"}]},{"group":"Automation \u0026 Integrations","pages":[{"title":"Claude \u0026 ChatGPT Connector (MCP)","icon":"plug","href":"/mcp-connector"},{"title":"Overview of No-Code Automation","icon":"wand-magic-sparkles","href":"/automation/overview"},{"title":"Webhook \u0026 API","icon":"code","href":"/automation/webhook-api"},{"title":"Phone System Integrations","icon":"phone-office","href":"/provisioning/phone-system-integrations"}]},{"group":"Costs \u0026 Pricing","pages":[{"title":"Cost Overview","icon":"dollar-sign","href":"/pricing/overview"},{"title":"Pricing Breakdown","icon":"calculator","href":"/pricing/usage-based"},{"title":"Number Rentals \u0026 International Rates","icon":"globe","href":"/pricing/number-rentals"}]},{"group":"Number Provisioning","pages":[{"title":"Supported Countries","icon":"globe","href":"/provisioning/supported-countries"},{"title":"Managing Your Numbers","icon":"list-check","href":"/provisioning/managing-numbers"},{"group":"SIP trunking","icon":"phone-volume","pages":[{"title":"Overview","href":"/provisioning/sip-trunking/sip-integration"},{"title":"Twilio Integration","href":"/provisioning/sip-trunking/twilio"},{"title":"Zadarma Integration","href":"/provisioning/sip-trunking/zadarma"},{"title":"DIDLogic Integration","href":"/provisioning/sip-trunking/didlogic"},{"title":"Telnyx Integration","href":"/provisioning/sip-trunking/telnyx"}]}]},{"group":"Settings","pages":[{"title":"Data Retention","icon":"clock-rotate-left","href":"/settings/data-retention"}]},{"group":"Troubleshooting \u0026 FAQs","pages":[{"title":"AI Behavior Issues","icon":"robot","href":"/troubleshooting/ai-behavior"},{"title":"Billing \u0026 Credits","icon":"money-bill","href":"/troubleshooting/billing"},{"title":"Cal.com Issues","icon":"calendar-days","href":"/troubleshooting/cal-com"},{"title":"Calendly Issues","icon":"calendar-days","href":"/troubleshooting/calendly"},{"title":"Call Quality Issues","icon":"phone","href":"/troubleshooting/call-quality"},{"title":"Campaign Issues","icon":"wrench","href":"/troubleshooting/campaigns"},{"title":"GoHighLevel Issues","icon":"calendar-days","href":"/troubleshooting/gohighlevel"},{"title":"Leads Issues","icon":"user-gear","href":"/troubleshooting/leads"},{"title":"SIP Integration Issues","icon":"phone-volume","href":"/troubleshooting/sip-integration"},{"title":"Voice \u0026 Response Issues","icon":"microphone","href":"/troubleshooting/voice-problems"},{"title":"Web Widget Issues","icon":"code","href":"/troubleshooting/web-widget"},{"title":"WhatsApp Troubleshooting","icon":"circle-question","href":"/troubleshooting/whatsapp"}]}]},{"anchor":"No-Code Automation","icon":"wand-magic-sparkles","color":{"light":"#6c63ff","dark":"#6c63ff"},"pages":[{"title":"No-Code Automation","href":"/automation-platform/introduction"}]},{"anchor":"API Reference","icon":"code","color":{"light":"#1c51fc","dark":"#1c51fc"},"pages":[{"title":"API Reference","href":"/api-reference/introduction"}]},{"anchor":"Platform updates","icon":"scroll","color":{"light":"#ffbb00","dark":"#ffbb00"},"pages":[{"title":"Platform updates","href":"/releases"}]}]},"title":"Web Widget - HeyFred","buildId":"dpl_849ArpqvBiCczQiT1Y1stNGpbqHT","deploymentId":"dpl_849ArpqvBiCczQiT1Y1stNGpbqHT","dynamics":["07c022d89b","a74be98ba7"],"chunks":["Frame-Cz91mEGH.js","DynamicMarkdown-a8hUKrw6.js","zoom-image-lightbox-CaUwvYH3.js","lightbox-handle-r17bVUz3.js"]}
