How To Create a Chatbot For Your WordPress Website

Disclosure: This post contains affiliate links. If you click on these links to sign up for this product, I’ll receive a small commission at no cost to you. Thanks for your support!

All around the socialverse there are tons of articles being shared about chatbots. It’s like one of the biggest trends going on in the socialverse right now. Bloggers, entrepreneur, big and small businesses are adding chatbots to their social media marketing plan.

Heck even I’ve started using a chatbot for this site and a new site I’m putting together – which I’ll tell you about in another blog post.

Anywho…this is how Wikipedia defines chatbot:

A chatbot is a computer program or an artificial intelligence which conducts a conversation via auditory or textual methods.

In other words, it’s designed to provide relative content and/or resources from within your website done in a personalized, conversational flow.

Do I Really Need A Chatbot?

If you’ve bounced the idea of using a chatbot for your website and wondered if you really need one, take a look at the benefits you get:

• You can grow your mailing list
• Increase engagement
• Improve customer service
• Use the feedback to improve your products/services

Pretty good reasons, right?

How To Create a Chatbot For Your Website

So, how do you create a chatbot for your website?

I started using Collect.chat* about three months ago. Since then I’ve gotten several responses. One response a month isn’t bad but I know it could be better.

The free version of Collect.chat lets you create statements and include links to share with your website visitors but it won’t flow in a conversation, you’d have to upgrade for that and I’ll go over that later in this post.

First, here’s a quick tutorial to show you how to create a chatbot with Collect.chat’s free plan.

When you create a new account you’ll automatically be taken to the preview page. Click the green ‘start’ button above the video to building your bot.

This is where you’ll see a preview or the chatbot, choose where you want to position it on your site, customize the bot by adding your brand’s colors and selecting an Avatar.

After you’ve customized the bot, click on ‘script’ at the top. Here is where the magic really happens!

Create Your Chatbot

Since this is the free plan, you don’t have the option to set up a conversation flow to get a user’s reply. So you have one shot to get the chatbot to get visitors to take the action it was designed for.

Now let me show you how to edit the bot. For the sake of this tutorial, lets create a bot to grow your mailing list.

The chatbot has a default image of a waving hand saying hello. You can keep the image but if you want to replace it, here’s what you do.

To edit the script, all you have to do is hover your mouse over the section you want to edit. You’ll see icons that look like this:

Click on the pencil icon to open the editor for that section.

Place the cursor under ‘Hello’ and hit the delete button to remove the waving hand.

Note: While I was putting this blog post together I tested it out to see if my new image would appear but the waving hand and my image appears. I looked in the help section but the only thing I found was a video that shows us how to add an image.

So here’s a fix for that…

Hover the mouse in that section and click on the trashcan icon to delete that statement. Then over on the left click on the ‘statement’ box to add it to the flow and it will appear at the bottom. Simply drag that section to the top.

Now click on the pencil icon to add your welcome statement. To a new image, click the image icon and a URL box will appear. Grab the URL where your image is stored.

For example, if the image you want to use is in the media library in WordPress, go to the library, select the image and click ‘edit’.

Copy the link under File URL:

Go back to the Collect.chat editor, paste the link in the URL box, click ‘add’ and the new image will appear. When you’re done, click the green ‘done’ button at the bottom.

And now lets create a killer statement that will get visitors to leave their email address. Remember in the free plan you get one chance because the user can only reply once so make it count!

You don’t want to push an opt-in visitor’s face so add some content before the call to action. Something like this:

Have a look at our content. I’m sure you will find articles that could be helpful to you. And before you go, don’t forget to grab our New Blogging Business bundle packed with tools and resources to help you build a thriving online business. Enter your email address to get your copy.

To edit the statement, hover the mouse over the blue ‘user’s reply’ button and click on the pencil icon. 

Click in the text area to add your content. Then under Options change the text to ‘Enter Your Email Address’. Click the green ‘done’ button to save changes.

The last thing the closing statement. You can leave it as it is or edit it to add more content. If you want to add more content, place the cursor in that section and click the pencil icon to edit the statement.

Thank you! Be on the look out for an email from me. And if you have any questions feel free to email me at cori@corinaramos.net.

Click the ‘done’ button to save changes.

Congratulations, you’ve just created your first chatbot! And now let’s test this puppy out. Click on the blue ‘Preview Bot’ button to see it in action.

Pretty cool, right?

Chatbot Settings

There is still some work to do before adding the bot to your website. From the Collect.chat dashboard, click on Settings on the left.

Here is a summary of each tab on the settings page. 

User Experience – Turn on the progress bar so that it appears on top of the widget.

User Targeting – Enter the amount of time to wait before the chatbot opens. Enter pages on your site you don’t want the chatbot to appear, block IP addresses and auto-hide settings.

Notification – Set notification settings to notify you when you get a response.

Integration – If you have a Zapier or Mailchimp account, this is where you’ll add the necessary info.

Translation – Collect.chat supports multiple languages. This is where you’ll change the text to the language you want.

Tracking – Enter your Google Analytics ID and Facebook Pixel ID for automatic event logging.

General – Click the Hide button to enable the bot. Give your bot a name and make sure your website address is listed.

And now let’s add the chatbot to your website. 

Add The Chatbot To Your WordPress Website

The first thing to do is go to Plugins and click ‘Add New’. In the search box type in Collect.chat. When the plugin appears, install and activate it.

Now go back to Collect.chat. From the Builder tab, click on ‘Publish’ to choose a method to install the chatbot. Click on ‘Install the widget on WordPress website’.

Since you’ve already installed the plugin, all you have to do is copy and code in step #2.

Go back to WordPress and under the Settings tab click on Collect.chat and paste the snippet in the ‘Chatbot Snippet’ area. Underneath that select where to show the chatbot then click ‘save settings’.

Now view your website to make sure the chatbot is enabled. If you don’t see the chatbot, clear cache, refresh your page and see if it appears.

If it doesn’t go back to Collect.chat to double check the User Targeting settings.

Upgrade For A More Personalized Conversation With Your Visitors

If you really want to engage with your visitors, Collect.chat* also has a very affordable Lite plan – we’re talkin’ $19 a month affordable!

The Lite plan includes a feature called logical jump. With this feature you customize your bot to provide visitors with a response based on their question or statement.

I want to show you how easy it is to set up so I created this tutorial to show you how to create a chat bot for your website. In this tutorial, I’ll be using the features in the Collect.chat Lite plan.

Wrapping It Up

I hope you found this tutorial helpful. If you’d like to try Collect.chat, click here* to sign up for a free for life or premium plan.

So, are you using a chatbot yet? Tell me which one you’re using and why you like it in the comments below!

And before you go I’d really appreciate it if you’d share this blog post on social media, thanks!