Adding a Chat Widget to Your Site
Welcome to our Placester Hacks series! Placester Hacks are Placester-approved tricks and workarounds that allow you to accomplish some customizations that may not seem possible with the current toolsets included in Placester’s products. Keep in mind that these hacks are generally more advanced than standard setup instructions. We recommend only using them if you’re familiar with HTML and website editing.
What is a chat widget?
A chat widget is a tool you can add to your site as another means of reaching out to your client base. If you are present you can have a real-time conversation with leads that are looking at your site. If you are not available, the widget will automatically engage leads with programmed questions and responses. These conversations will be logged and sent to you so you can follow up with potential clients.
Adding a chat widget
You can find a chat widget by simply running a Google search for the terms “chatbot” or “chat widget”. You can either pay for a chat widget or obtain a free code. Many chat widgets offer the same service, however, keep in mind that free widgets tend to require more set up and do not offer as much support as the paid versions. Some free widgets we recommend are tawk.to and rebot.me and drift.com. A popular paid chat program is provided by Zendesk.
Obtaining your chat widget code
Once you have selected the widget you would like to use, you will need to obtain the embed code for the widget. For demonstration purposes, we will be using the widget from rebot.me. All other chat box widgets should follow a similar process. If you run into any difficulty finding the code, you should contact the program’s support team for more information.
Once you have set up your chat widget, look for the “embed” option.
This will display the code that you will need to embed the widget on your Placester site.
This code should look something like this.
var headID = document.getElementsByTagName("head");
var newCss = document.createElement('link');
newCss.rel = 'stylesheet';
newCss.type = 'text/css';
window._botUsername = '658495';
window._botName = 'Jane Stevens';
newCss.href = "http://rebot.me/assets/css/bot.css";
var newScript = document.createElement('script');
newScript.src = "http://rebot.me/assets/js/bot.js";
Note: If the code looks significantly different, please reach out to our support team to double check that it will work on the site.
Adding chat widget code to Placester
This will take you to your Site Settings. Scroll down to the Site Design section and click on “Custom CSS & JS”
The code must now be modified in order for the widget to function. To do this, remove the first and last line from the code. These lines should look something like,
Once you have made the necessary adjustments to your code, click “save”.You should now be able to view the chat box widget on your Placester site!
Need More Help?
If you have additional questions about adding a chat widget to your Placester site, let our support team know at firstname.lastname@example.org.