You might have noticed on the sidebar that I have an API.AI chatbot. In case I decide to remove it or reposition it in the future, this is what it looks like as of today:
There is also multiple chat bots embedded into this site, which you can see by visiting my BotFolio.
So how do you add an API.AI chat bot to your WordPress website?
The key is to look at the embed code from your Agent Page on API.AI.
This is an example of what the embed code looks like:
<iframe width=”350″ height=”430″ src=”https://console.api.ai/api-client/demo/embedded/bbcfe49d-bc2e-4881-bb65-805b3573f572“></iframe>
The italicized URL is what we are looking for.
For the iFrame plugin, you simply replace the src with the URL from API.AI, like this:
For the iFrame sidebar widget, it is even easier, you just copy/paste the URL from API.AI into the URL textbot for the widget.
There are also some questions I have seen around having a chat bot popup from the bottom of the page in a popup window. The method is pretty much the same, but you probably need a paid plugin such as Popup Builder PRO version which allows you to create a popup into which you can embed an iFrame.
If you have reached this point and you are wondering what kind of bot you should create for a WordPress website in the first place, why not check out my book on creating a curator chat bot and adding it to your website?
The chatbot you create with this method uses the builtin iFrame integration from API.AI, where the hyperlinks are not clickable. Using some programming, you can also create chatbots which are much more customizable (e.g. can show hyperlinks).