How do I add a search bar to my website?

The search bar is an inline AI search input your visitors can use to ask questions about your organization. Unlike the chat widget (which floats in the corner), the search bar appears exactly where you place it.

Note: Only one search bar can display per page. Choose one placement — don't add it in two spots on the same page. Placing two will cause neither to appear.

The search bar is fully customizable. Once your organization is set up with Civilized, go to your Admin Dashboard under Settings → Widgets to generate an embed with the size, colors, and shape that match your site, then copy it from there.

WordPress sites

Install the Civilized plugin (see How do I install the Civilized WordPress plugin?). Once active, the Settings → Civilized page walks you through every way to place the search bar — adding it to a post or page, or to a header/footer/sidebar on both block and classic themes. No code needed.

Squarespace sites

1. Click Edit on the page where you want the search bar.
2. Hover over the section you want to edit and click Edit Section (or Edit Site Footer if you're adding it to the footer).
3. Press the Add Block button.
4. Drag the block on the grid into the position you want.
5. Choose </> Code as the block type.
6. Set Mode to HTML.
7. Open the editor and replace the default “Hello World” with your embed code from the dashboard.

Wix sites

1. Add a code block. Click + Add and select Elements. Search “code,” select Embed Code, and drag it into your page section. Make sure What to Embed is set to Code.
2. Paste the code. Click the block, paste your embed code from the dashboard into the Enter HTML embed code box, and click Apply.
3. Publish. Click Publish at the top right.

Note: If you see “This domain has not been approved yet” inside the editor, ignore it — it's a Wix security restriction. View your live site in a new tab to see the working widget.

Any other website

Paste your embed code from the dashboard into a code or embed block on the page where you want the bar to appear. The same block can also go inside a header, footer, or sidebar section that you edit visually in your builder — the bar will then repeat on every page that section is loaded on.