Setting your chat widget on specific pages of your website

Crystal Field Updated by Crystal Field

You've installed the Smith.ai Chat widget on your website, but you only want it to appear on specific pages.

Instead of using the JavaScript snippet provided in your chat account, you'll need to modify things a bit. Find your code and paste it into a notepad editor. There are a few things we'll need:

  • Your specific chat ID (we'll show you how to find this)
  • The addresses of the pages you'd like to include
  1. Find your Chat ID and keep this handy. We will refer to this as $ChatID.
  2. Find the addresses of the page(s) you want to add the widget, and paste them into your text document.
  1. Then delete everything from "https:// through the first slash for each of them
  1. Ok, so at this point, you should have your $ChatID and the paths of any pages you want the widget on. Now, paste this into your document:
<script type="text/javascript">
var includePagePaths = [
  "page1",
  "page2"
];
var showWidget = false;
for (var int = 0; int < includePagePaths.length; int++) {
  if (window.location.pathname.includes(includePagePaths[int])) {
    showWidget = true;
    break;
  }
}
if (showWidget == true) {
  // show the smith.ai widget
window.SMITH={},window.SMITH.smithChatAccount="$ChatID"; var script=document.createElement("script"); script.async=!0, script.type="text/javascript",script.src="https://app.smith.ai/chat/widget-latest.js",document.getElementsByTagName("HEAD").item(0).appendChild(script);
}
</script>
  1. Replace $ChatID with your actual Chat ID.
  2. This next part is a bit trickier. You're going to wrap each page in quotes and put a comma after each except for the last one. Like:
    "page1",
    "page2",
    "page3",
    "page4"
    (notice the last one does not have a comma)
    or in our case:
    "versus/ruby-receptionists",
    "blog/the-top-5-mistakes-small-business-owners-make-with-their-ivr"
  3. Ok, assuming you did everything, You'll now have a chunk of code like this. BUT NOT THIS, because if you just copy and paste ours, it won't do anything.
<script type="text/javascript">
var includePagePaths = [
  "versus/ruby-receptionists",
  "blog/the-top-5-mistakes-small-business-owners-make-with-their-ivr"
];
var showWidget = false;
for (var int = 0; int < includePagePaths.length; int++) {
  if (window.location.pathname.includes(includePagePaths[int])) {
    showWidget = true;
    break;
  }
}
if (showWidget == true) {
  // show the smith.ai widget
window.SMITH={},window.SMITH.smithChatAccount="a1234b56-cd78-90ef-abcd-a1b23cd456ef"; var script=document.createElement("script"); script.async=!0, script.type="text/javascript",script.src="https://app.smith.ai/chat/widget-latest.js",document.getElementsByTagName("HEAD").item(0).appendChild(script);
}
</script>

Questions? Contact us!

If you're already a Smith.ai client and need help, please email us at support@smith.ai or call us at (650) 727-6484 for assistance.

If you're not yet a Smith.ai client, please schedule a free consultation to get started with our live chat or email us at sales@smith.ai. We'll help you select the best plan to match your business’s growth goals and budget.

How did we do?

Installing Smith.ai Web Chat on a WordPress Website

Why is my Chat widget displaying incorrectly?

Contact