Chat Widget for Website: Pick a Layout and Add It
A chat widget is the part of the chat your visitors see: the button in the corner, the box inside a page or a search window. Most guides to adding one skip the first decision, which is where the widget should sit and how it should behave on each page. This guide covers both. It shows how to choose a layout that fits how your visitors look for answers, how to add the widget to your site with one script tag, and what to check before you call it done, including on phones.
Step 1: Decide where visitors look for answers
Think about your pages, not about the widget. A shopper on a product page wants a quick chat in the corner. A reader on a pricing page wants to ask right where they are. Someone in your help section wants a full page, and a developer in your docs wants a search box they can open with one click. Write down your three most visited page types and what a visitor wants on each, so your layout choice follows the page.
Step 2: Choose a layout
OneType offers five layouts for the same agent, with the same knowledge and answers: a chat bubble, a launcher in the corner that opens a chat panel; an inline answer box, a question box inside your page that grows into a short conversation; a help page, a full page chat for help and support sections; a search palette, a centered dialog opened from a button; and a docs sidebar, a drawer on the side of the page that opens next to your content. You pick the layout when you choose one of the chat templates. If you switch layouts later, your agent's name, greeting and starter questions stay the same, and you do not train anything twice.
Step 3: Set the name, greeting and starter questions
Today you pick a template and add your logo, name, greeting and starter questions. Use the starter questions for the top questions from your list, so visitors reach common answers in one click. Keep the greeting short and say what the chat can help with. The chat answers only from the pages and files you give it, with a numbered source next to each sentence, so check the answers in the test chat before the widget goes live.
Step 4: Add the widget with one script tag
After you go live, OneType shows your script tag ready to copy. It goes just before the closing body tag, and the same line works anywhere you can add custom code. There are no plugins to install. If someone else edits your site, one link opens an email with the snippet and instructions, ready to send to them. The widget loads only on the domains you allow, so anyone who copies your script tag onto another site gets nothing. When you use the Go live step, your domain is added for you.
Step 5: Check it on desktop and phone
Open your published site in a new tab, not the editor preview. A chat button appears in the corner, and within about a minute OneType shows "Live on" followed by your site's address. You do not have to open the chat for this. If nothing shows after ten minutes, check that the line is on the published page, that the address is an allowed domain, that no ad blocker or security policy blocks the widget and that you reloaded the page. Then test on a phone: the chat opens full screen on phones, except the inline box, which stays in your page. Ask one question your pages answer and one they do not.
Add the widget in minutes
See the layouts: chat layouts, check the install steps, or start free.