diff --git a/docs/deployment/introduction.mdx b/docs/deployment/introduction.mdx
index 23d11fc..6d735bc 100644
--- a/docs/deployment/introduction.mdx
+++ b/docs/deployment/introduction.mdx
@@ -8,5 +8,4 @@ You can deploy Dograh Platform using Docker on a remote server using Docker, eit
 
 - [Docker](docker)
 - [Custom Domain](custom-domain)
-- [Add to Website](web-widget)
 - [Heroku](heroku)
diff --git a/docs/docs.json b/docs/docs.json
index 085bdcd..70e7a73 100644
--- a/docs/docs.json
+++ b/docs/docs.json
@@ -88,7 +88,8 @@
                   "voice-agent/api-trigger",
                   "voice-agent/webhook"
                 ]
-              }
+              },
+              "voice-agent/add-to-website"
             ]
           },
           {
@@ -145,7 +146,6 @@
               "deployment/docker",
               "deployment/custom-domain",
               "deployment/update",
-              "deployment/web-widget",
               "deployment/heroku"
             ]
           },
diff --git a/docs/images/add-to-website.png b/docs/images/add-to-website.png
new file mode 100644
index 0000000..d8dca4b
Binary files /dev/null and b/docs/images/add-to-website.png differ
diff --git a/docs/images/save-configurations.png b/docs/images/save-configurations.png
index 6a00589..00b6e5f 100644
Binary files a/docs/images/save-configurations.png and b/docs/images/save-configurations.png differ
diff --git a/docs/deployment/web-widget.mdx b/docs/voice-agent/add-to-website.mdx
similarity index 97%
rename from docs/deployment/web-widget.mdx
rename to docs/voice-agent/add-to-website.mdx
index 6059b53..006b1ff 100644
--- a/docs/deployment/web-widget.mdx
+++ b/docs/voice-agent/add-to-website.mdx
@@ -1,19 +1,20 @@
 ---
 title: Add to Website
 description: Add your Dograh voice agent to any website so visitors can talk to it.
+tag: "NEW"
 ---
 
 ### How to add it
 
-Add your voice agent to any website using the Deploy Agent dialog in your agent's settings.
+Add your voice agent to any website using the Configure Widget dialog in your agent's settings.
 
 Step 1: Open the agent settings by clicking the gear icon in the top-right of the agent editor.
 
 ![Open agent settings](../images/open-settings.png)
 
-Step 2: Scroll to the **Deployment** section and click **Configure Embed**.
+Step 2: Scroll to the **Add to Website** section and click **Configure Widget**.
 
-![Go to Deployment](../images/go-to-deployment.png)
+![Go to Add to Website](../images/add-to-website.png)
 
 Step 3: Enable embedding, add your website's domain to **Allowed Domains**, choose **Floating Widget**, **Inline Component**, or **Headless (Bring Your Own UI)**, customize the button (position, color, text) if applicable, and click **Save Configurations**.
 
diff --git a/ui/package-lock.json b/ui/package-lock.json
index 982ae57..2edb193 100644
--- a/ui/package-lock.json
+++ b/ui/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "ui",
-  "version": "1.26.0",
+  "version": "1.27.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "ui",
-      "version": "1.26.0",
+      "version": "1.27.0",
       "dependencies": {
         "@dagrejs/dagre": "^1.1.4",
         "@nangohq/frontend": "^0.69.47",
diff --git a/ui/src/app/workflow/[workflowId]/components/EmbedDialog.tsx b/ui/src/app/workflow/[workflowId]/components/EmbedDialog.tsx
index b2e54b2..f698ed7 100644
--- a/ui/src/app/workflow/[workflowId]/components/EmbedDialog.tsx
+++ b/ui/src/app/workflow/[workflowId]/components/EmbedDialog.tsx
@@ -1,4 +1,4 @@
-import { Check, Copy, Loader2, Mic, Plus, Rocket, Trash2 } from "lucide-react";
+import { Check, Copy, ExternalLink, Loader2, Mic, Plus, Rocket, Trash2 } from "lucide-react";
 import { useCallback, useEffect, useState } from "react";
 
 import {
@@ -25,6 +25,7 @@ import {
 } from "@/components/ui/select";
 import { Separator } from "@/components/ui/separator";
 import { Switch } from "@/components/ui/switch";
+import { WIDGET_MODE_DOCUMENTATION_URLS } from "@/constants/documentation";
 
 interface EmbedDialogProps {
     open: boolean;
@@ -177,12 +178,23 @@ export function EmbedDialog({
         <Dialog open={open} onOpenChange={onOpenChange}>
             <DialogContent className="sm:max-w-4xl w-full max-h-[90vh] overflow-y-auto">
                 <DialogHeader>
-                    <DialogTitle className="flex items-center gap-2">
-                        <Rocket className="h-5 w-5" />
-                        Deploy Workflow
-                    </DialogTitle>
+                    <div className="flex items-center justify-between">
+                        <DialogTitle className="flex items-center gap-2">
+                            <Rocket className="h-5 w-5" />
+                            Configure Widget
+                        </DialogTitle>
+                        <a
+                            href={WIDGET_MODE_DOCUMENTATION_URLS[embedMode]}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className="flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground transition-colors pr-6"
+                        >
+                            Docs
+                            <ExternalLink className="h-3.5 w-3.5" />
+                        </a>
+                    </div>
                     <DialogDescription>
-                        Embed &quot;{workflowName}&quot; on any website with a simple script tag
+                        Add &quot;{workflowName}&quot; to any website with a simple script tag.
                     </DialogDescription>
                 </DialogHeader>
 
@@ -542,8 +554,8 @@ document.getElementById('talk-btn').addEventListener('click', () => {
                                     </Button>
                                 </div>
 
-                                {/* Embed Script (shows after saving) */}
-                                {embedToken && embedToken.is_active && (
+                                {/* Embed Script (shows after saving; placeholder before) */}
+                                {embedToken && embedToken.is_active ? (
                                     <>
                                         <Separator />
                                         <div className="space-y-3">
@@ -578,6 +590,16 @@ document.getElementById('talk-btn').addEventListener('click', () => {
                                             </p>
                                         </div>
                                     </>
+                                ) : (
+                                    <>
+                                        <Separator />
+                                        <div className="space-y-3">
+                                            <Label className="text-muted-foreground">Embed Code</Label>
+                                            <div className="rounded-lg border border-dashed bg-muted/30 px-4 py-8 text-center text-sm text-muted-foreground">
+                                                Click <span className="font-medium">Save Configurations</span> to generate your embed script.
+                                            </div>
+                                        </div>
+                                    </>
                                 )}
                             </>
                         )}
diff --git a/ui/src/app/workflow/[workflowId]/settings/page.tsx b/ui/src/app/workflow/[workflowId]/settings/page.tsx
index 672f9c0..b1bff34 100644
--- a/ui/src/app/workflow/[workflowId]/settings/page.tsx
+++ b/ui/src/app/workflow/[workflowId]/settings/page.tsx
@@ -79,7 +79,7 @@ const NAV_ITEMS = [
     { id: "dictionary", label: "Dictionary", icon: BookA },
     { id: "voicemail", label: "Voicemail Detection", icon: PhoneOff },
     { id: "recordings", label: "Recordings", icon: Mic },
-    { id: "deployment", label: "Deployment", icon: Rocket },
+    { id: "deployment", label: "Add to Website", icon: Rocket },
     { id: "report", label: "Report", icon: FileDown },
     { id: "identity", label: "Agent UUID", icon: Fingerprint },
 ];
@@ -1294,17 +1294,16 @@ function WorkflowSettingsInner({
                                 <CardHeader>
                                     <CardTitle className="flex items-center gap-2 text-base">
                                         <Rocket className="h-4 w-4" />
-                                        Deployment
+                                        Add to Website
                                     </CardTitle>
                                     <CardDescription>
-                                        Generate and manage the embed configuration to deploy this workflow on external
-                                        websites.{" "}
+                                        Configure a widget to add this voice agent to your website.{" "}
                                         <a href={SETTINGS_DOCUMENTATION_URLS.deployment} target="_blank" rel="noopener noreferrer" className="inline-flex items-center gap-0.5 underline">Learn more <ExternalLink className="h-3 w-3" /></a>
                                     </CardDescription>
                                 </CardHeader>
                                 <CardFooter className="border-t pt-6">
                                     <Button variant="outline" onClick={() => setIsEmbedDialogOpen(true)}>
-                                        Configure Embed
+                                        Configure Widget
                                     </Button>
                                 </CardFooter>
                             </Card>
diff --git a/ui/src/constants/documentation.ts b/ui/src/constants/documentation.ts
index 56f3b66..374b0c6 100644
--- a/ui/src/constants/documentation.ts
+++ b/ui/src/constants/documentation.ts
@@ -24,7 +24,13 @@ export const SETTINGS_DOCUMENTATION_URLS: Record<string, string> = {
     templateVariables: `${DOCS_BASE}/voice-agent/template-variables`,
 
     recordings: `${DOCS_BASE}/voice-agent/pre-recorded-audio`,
-    deployment: `${DOCS_BASE}/deployment/web-widget`,
+    deployment: `${DOCS_BASE}/voice-agent/add-to-website`,
+};
+
+export const WIDGET_MODE_DOCUMENTATION_URLS: Record<"floating" | "inline" | "headless", string> = {
+    floating: `${DOCS_BASE}/voice-agent/add-to-website#floating-widget`,
+    inline: `${DOCS_BASE}/voice-agent/add-to-website#inline-component`,
+    headless: `${DOCS_BASE}/voice-agent/add-to-website#headless-mode`,
 };
 
 export const TOOL_DOCUMENTATION_URLS: Record<string, string> = {