Welcome to Propane Chat, the premier AI Chatbot for your website in any industry. Here, we'll teach you how to install both the embedded version and the widget version of Propane Chat on your Wordpress site. It will involve a tiny bit of code, but don't worry, it should take less than 5 minutes to install and we'll guide you through every step of the way. If you have any trouble getting set up there is a link to sign up for a free consulation at the bottom of this page.
Embed vs. Widget:
There are two ways to use Propane Chat. You can embed it on a specifc page of your website or you can have it appear as a widget in the corner of the pages of your website. The little chat icon in the bottom right corner of this screen is the widget version and this is the embedded version and what it might look like on a page of your website:
How to install the Propane Chat Widget on Wordpress:
Before we begin, in order to add Propane Chat to your Wordpress website you must have a plugin-enabled Wordpress plan. This is a Wordpress policy and thus is outside of our (Propane Chat's) control. To see Wordpress' policy on their site you can click here.
To start, first you will need the widget code found in the Propane Chat Dashboard. Visit the Embed Chat tab and then click on "Get Embed Code". Copy the widget code.
You will also need to install this free plugin that will allow you to add the widget code to your Wordpress site.
Here is the link to the free plugin: https://wordpress.com/plugins/insert-headers-and-footers/myyeetstore.wordpress.com
After you have installed and activated the WPCode plugin you should see it on the left-hand side of your Wordpress dashboard.
Navigate to Code Snippets → Header & Footer. Paste the widget code into the Header box and click the “Save Changes” button as shown below:
The chat icon will now be in the bottom right corner of your website and Propane Chat can answer customer questions through that widget.
How to embed Propane Chat on Wordpress:
First, you will need the Embed iFrame Code found in the Propane Chat Dashboard. Visit the Embed Chat tab and then click on "Get Embed Code". Copy the Embed iFrame Code.
Now, navigate to the page of your Wordpress site where you would like to embed Propane Chat.
Use the plus button in the top right of the screen to add a "Custom HTML" block to the page as shown below:
Once you have the HTML block, paste in the iFrame code from the Propane Chat dashboard.
You can adjust the height of the chat by changing the height percentage in the code and pressing enter so that the number and the percentage symbol (%) are on separate lines as shown below:
Changing the width of the embedded chat is done by repeating the same process with the width percentage.
Now, when you click on the preview button of the HTML block you should see the embedded chat:
Simply click save in the top right corner and you should be good to go.
Having trouble?
Thanks for choosing Propane Chat. If you are having any trouble getting Propane Chat set up on your Wordpress, or if you would simply like expert advice getting Propane Chat ready to help your customers, feel free to sign up for a free consulation call with a member of the Propane Chat team here: https://calendly.com/propanechat
We look forward to fueling your customer engagement one conversation at a time 🔥