Customizing automatic website page messages
Last updated
Was this helpful?
Last updated
Was this helpful?
When you have a chatbot connected to your website, it makes sense to customize the conversations that virtual assistant starts with customers depending on which page the user is visiting.
For example, on your “Pricing” page the conversation should be quite different from the “About Us” page or from other pages that describe specific products or services.
Activechat makes it easy to define specific messages that your bot will display on certain pages of your website. To make it work, you need to install our website tracking pixel and a chat widget.
Go to the “Website messages” section in your bot builder to customize bot conversation depending on the page URL.
By default, there are no URL-based scenarios defined, so this page will be blank. Click the “+” sign to add a new website page message.
Example of setting up two different website messages
Enter a meaningful part of the page URL in the “IF user visits any of these URLs” input field. You can add up to 3 different URL keys per message. When someone is visiting your website and the page URL contains any of these keys (remember that the key is inclusive, i.e. if you type /bot as a key in the message settings, this message will be displayed both on www.yoursite.com/bottles and www.yoursite.com/start/bottom, and anywhere else where page URL contains that key).
IMPORTANT! When the user is visiting any page of your website for the first time, your chatbot will first display a welcome message instead of a page-specific message. But when the same user refreshes her page or visits the same page again, the bot will proceed to a page-specific message.
Optionally, you can add a button (URL or event) to each website message.
Please note that website messages will be displayed every time your users is visiting or refreshing a page. It can feel a bit annoying on multiple, repeated visits. To customize it with visit counters and more complex logic you will need some experience with our Visual Chatbot Builder.
You can easily build a website chatbot with customized messages for every page of your website. That’s the power of conversational marketing – the ability to start engaging conversations that are highly personalized.
In Activechat, there's an event (and skill!) for every type of customer interaction, and website page visits are handled by the _page_visit skill.
When you have Activechat pixel installed on your website, the “_page_visit” system event will be triggered every time when the user is visiting any page of your website. The address and title of the visited page will be available in the $_last_page_visit_title and $_last_page_visit_url system attributes.
So, let’s open the “_page_visit” skill in the visual builder (you can use the link in the “Website messages” menu or find it in the visual builder tabs) and start customizing!
Keep in mind that you can always revert back to standard website messages setup by clicking the “Restore skill” button.
To send custom messages on specific pages of your website your skill will use the SWITCH block to check the value of the $_last_page_visit_url attribute and branch the conversation accordingly. Let’s start with a simple example first.
When you open the “_page_visit” skill for the very first time, don’t be confused by the number of blocks there. It’s necessary to make simplified “Website messages” menu work, but once you decide to use a visual builder instead, you can delete almost everything there.
Zoom the canvas out to approximately 40-45% and delete every block except the first four (hint: hold down keyboard Shift while dragging around blocks with the mouse to select multiple blocks at once and then hit “Delete” or “Backspace”). Here’s what should be left on canvas:
Note the use of SWITCH and DATA blocks here. The first SWITCH is checking the value of the $___page_visits attribute and proceeds to another SWITCH (checking the “muted” status) if it’s equal to 1. Otherwise, the DATA block is setting its value to 1 and then the SEND block is triggering the “start” skill. This is a simple logic that implements the default website chatbot behavior – display welcome message first (when a new user is visiting your website) and display page-specific messages on consequent visits. You can change this too, and start your website chatbot straight from the page-specific message – just remove these three blocks, and connect the CATCH listener for the “_page_load” event directly to your next blocks. Please keep in mind that this change will affect the website chat widget only – the Facebook Messenger widget will be starting with a welcome message anyway, due to Facebook’s policies.
The second SWITCH is checking the value of the $_muted system attribute to see if the bot is muted for the current user. If it’s true, the bot does nothing, otherwise, we’re good to proceed to our custom website chatbot messages.
Let’s start with a simple example first. We’ll use the SWITCH block to check the value of the $_last_page_visit_url attribute and, based on this, we’ll be launching different skills on the “About us”, “Services” and “Portfolio” pages of our website. For every other page, the chatbot will remain silent until the user types a message in the chat – then the “default” skill will be triggered.
Please note that the “_page_visit” event is triggered on EVERY visit to the web page. If your visitor clicks F5 to reload the page, this event will be triggered again. If the user visits page A, then goes to page B and then returns back to page A, “_page_visit” will be triggered twice on page A.
This can make chatbot behavior a little bit annoying, so you (as a seasoned conversational designer) will definitely want to customize this further. Let’s do it!
Here’s what we will be building now:
Website chatbot will send customized page-specific messages only after the user spends a certain amount of time on the page
One message will be sent to the same user only once in the 24-hour interval
We’ll be counting the number of times a user visits pages that interest us most, and once the number of visits exceeds 3 we’ll tag this user with a “frequent_visitor” tag and display a different message
To achieve this, we’ll build separate skills for different pages on the website. Let’s call these skills “page_services”, “page_about_us” and “page_portfolio”. Then, we’ll use a SWITCH block to decide which skill to launch on a new page visit.
But first, we need some preparations in the “_page_visit” skill to implement our conversational logic.
What’s going on here? When the “_page_visit” event happens, the skill starts and immediately sends another event, “reset_page_timers”. We’ll need this event later, in the page-specific skills, to stop timers that count time spent by the user on the page.
Next, we use the SWITCH block to see if the $seen_before user attribute is set to true. If it’s not, that means that the skill is being run for the very first time for that user, so we proceed to some data manipulation – four DATA blocks below will set initial values of page counters ($page_visits_about_us, $_page_visits_portfolio, and $page_visits_services) to zero. Later, in page-specific skills, we’ll be incrementing these values to see which pages our website chatbot user is visiting.
After this, we continue to the SWITCH block, checking the value of the $_last_page_visit_url attribute. If this URL contains specific keys (like “/services/”, for example), we’ll use SEND blocks to start our page-specific skills. Please note that we’re using “contains” instead of “is equal to”. Usually, it’s advised to avoid complete URLs in the SWITCH block conditions – this will keep your bot from confusion when $_last_page_visit_url contains complex URLs with extra parameters (for example, UTM labels).
Now, let’s see what’s happening in the page-specific skills.
When one of these page-specific skills starts running, we know that the user has just loaded a page on your website. So, first of all, we’ll increment the value of the counter for that specific page with the DATA block. Next, we’ll start the TIMER and set it to run once after 15 seconds – this will delay the execution of the rest of the flow in that skill for 15 seconds.
If the user is leaving the page (clicking the link and navigating to another page) before 15 seconds, we definitely do not want our chatbot to display that page-specific message anymore. So, we’re using the CATCH block to listen to the “reset_page_timers” event that the “_page_load” skill will be triggering on every page visit. Once this event occurs, this block will stop the timer.
Otherwise, if it’s 15 seconds and the user is still on the same page, we continue to the SWITCH block to check if the current page message is locked for 24 hours after being shown already (to avoid user annoyance). We use $page_locked_services attribute to track this (for other page-specific skills the name will be $page_locked_about_us and $page_locked_portfolio). If this attribute is set to true, the chatbot will do nothing (since there are no blocks connected to the conditional exit). Otherwise, we’ll use another SWITCH block to check the value of the $page_visits_services attribute (remember we’ve increased it by 1 at the very beginning of this page-specific skill?)
If the number of visits is 3 or less, we’ll instruct our bot to start our regular “services” skill (sending an event with the SEND block). If it’s more than 3, the chatbot tag this user with a “frequent_visitor” tag and will display a different message – instead of running our regular “services” skill we’ll be inviting the user to arrange a 1-on-1 call with a sales representative.
And, eventually, after doing this, we’ll lock our page-specific skill for 24 hours with the $page_locked_services attribute, setting it to true and launching the TIMER block to set it back to false in 24 hours.
Were you following? Perfect! You’ve just managed to implement complex conversational logic in the website chatbot, congrats!
If you ever feel confused with some concepts used above, don't hesitate to contact us (either by email at ask@activechat.ai or by talking to our own virtual assistant). You can do almost anything conversation-related with Activechat due to the amazing flexibility of the platform, but it comes with a bit of a learning curve.
