Skip to main content
You can add an AI voice agent and a chat widget to any WordPress site by pasting one script tag. There is no SmartAlex plugin to install, and you do not need one. The widget is a single async script that reads its own published configuration (variant, colours, agent) from the server at load time, so the identical snippet works on a classic theme, a block theme, or a page builder like Elementor or Divi. If you searched for a “WordPress AI phone widget” or a way to add AI chat to WordPress, this is the whole job: get your tenant ID, drop in the snippet, publish.
There is no official “SmartAlex plugin” in the WordPress directory. Anything claiming to be one is not ours. The real, supported path is the script tag on this page (or the React component if your theme is headless).

Before you start

1

Have a SmartAlex workspace with a published agent

Build one in Studio. You can point Studio at your website URL and it drafts an agent in under 60 seconds, or create one from scratch.
2

Copy your tenant ID

Open the widget code panel in SmartAlex (Widget Studio). The data-tenant-id value is a UUID unique to your workspace. If you drive the account from an AI client over MCP, the tool smartalex_get_widget_install_code returns the same snippet.

The snippet

This is the exact tag. Replace YOUR_TENANT_ID with your workspace UUID. The data-tenant-id attribute is the only one you set: colour, layout, and which agent answers are all controlled from Widget Studio, not from the markup.
Because styling lives server-side, restyling the widget later never means editing WordPress again. You change it once in Studio and every page updates.

Two ways to embed it

Pick based on where you want the widget to appear.

Whole site (recommended)

Inject the script into the site footer so it loads on every page and post.

One page or post

Drop a Custom HTML block into a single page when you only want it there.
The cleanest no-code route is a “header and footer scripts” plugin (for example WPCode, Insert Headers and Footers, or Header Footer Code Manager). These let you add markup to every page without touching theme files.
1

Install a header/footer scripts plugin

From your WordPress dashboard, go to Plugins, then Add New, and install any reputable headers-and-footers plugin. Activate it.
2

Paste the snippet into the footer slot

Open the plugin’s settings, find the “Footer” (or “Before </body>”) field, and paste the script tag. The footer slot is preferred because the widget loads after your page content.
3

Save and clear caches

Save. If you run a caching or CDN plugin (WP Rocket, W3 Total Cache, LiteSpeed, or Cloudflare), purge the cache so visitors get the updated page.
Editing a classic theme directly instead? Add the snippet just before the closing </body> tag in your child theme’s footer.php. Always use a child theme so a theme update does not overwrite it. Block themes do not expose footer.php, so use the plugin route above.

One page: Custom HTML block

For a single landing page or contact page in the block (Gutenberg) editor:
1

Add a Custom HTML block

Edit the page, click the plus to add a block, search for “Custom HTML”, and insert it.
2

Paste the snippet

Paste the same script tag into the block.
3

Update the page

Click Update. Preview the live page (not just the editor) to see the widget load.
A Custom HTML block only renders the widget on the page that contains it. For a persistent widget across the whole site, use the footer injection method instead.

How it loads

Choosing a widget variant

You set the variant in Widget Studio, not in the WordPress markup. Five are available:
The voice-only variants (Voice pill and Ask Alex) appear in the picker only when your agent runs on the SmartAlex voice engine. The text variants (Pill, Chat bar, Side panel) are always available. Only one widget is active per workspace at a time, and saving a new active widget switches the previous one off. See widgets for the full breakdown.

Verify it is live

Open your published site in a normal browser tab (not the WordPress editor) and hard refresh. The widget should appear in the corner. If it does not:
  • Confirm YOUR_TENANT_ID is your real UUID, with no quotes or spaces left over.
  • Purge every caching layer (page cache plugin and CDN). Stale HTML is the most common cause.
  • Check that a security or “script blocker” plugin has not stripped the tag. Allowlist the api.getsmartalex.com host if needed.
  • If you used a Custom HTML block, remember it only shows on that one page.

Going further

The widget is one of three ways to plug SmartAlex into your stack. You can also drive the whole account from an AI client over the MCP server, and let your agent call your own WordPress or CRM endpoints mid-call with Custom HTTP Tools. Custom HTTP Tools and MCP keys are unlocked by the Power Tools add-on at $29/mo (see add-ons); full plan pricing is on /pricing.

Widget install reference

The canonical snippet, React usage, and every install detail.

Widget variants

Compare all five widget styles and when to use each.

Build-with overview

Every platform and AI client you can connect SmartAlex to.

Operate SmartAlex over MCP

Connect Claude, Cursor, or ChatGPT to run your account.