How to use the Maisie Chatbot Builder

In this tutorial we’ll show you how to use the Maisie Chatbot Builder so you can edit and create new Convo Flows and Convo Modules to use in your Website Bots.

Please note that this tutorial requires an understanding of our key terminology so please read our Glossary first if you haven’t done so already.

Maisie has been designed with flexibility in mind so you can configure your chatbot to use different Convo Flows on different pages of your website. You can also configure different Convo Flows on each page for different types of visitors and set different rules and triggers for when a Notification or Convo Flow is activated.

For this tutorial we’ll be editing the Welcome Returning Visitor Convo Flow for the homepage. This is one of the default Convo Flow templates that was installed automatically when you created your Maisie account.

To edit this Convo Flow navigate to the Convo Flow main screen and click the edit icon on the far right of the Flow we are going to edit.

edit convo flow

This will open the Maisie Chatbot Builder screen. On the left side of this screen is the title of the Convo Flow and underneath that sits the editor with three tabs: Notification, Convo and Settings.

Notifications

The Convo Flow screen opens on the Notification tab by default. On the right of the screen you can see the Notification message that will be displayed to returning website visitors.

To edit the Notification message hover over it and click the edit icon on the right.

notification hover

This will open the message editor on the left where you can edit the Message Text as you like.

edit notification message

Note that this message has code inserted into it. Code will be shown inside curly brackets. In this case the code { first_name ? ‘there’ } means that if Maisie has captured a returning visitor’s name previously it will insert their first name into the message. If Maisie doesn’t know the visitor’s first name it will use ‘there’ instead. You may change ‘there’ to something else but please don’t change or delete the variable first_name unless you don’t wish to personalize the message.

Once you’re done click Save to save your changes.

Note that notifications should be a brief as possible as they are intended to gain the attention of your website visitors but not impede their journey. You might wish to add a couple of Quick Replies (see below) or leave it as it is.

Convo Flows

When a website visitor clicks the message (or the Maisiebot icon) the Chat Window will launch. To view and edit the Convo Flows that display on the Chat Window click the Convo tab on the editor.

At the top of the Chat Window on the right you can see the initial Notification message at the top. Beneath that are four Quick Replies. Each Quick Reply is a response option that your website visitors can select and will direct the conversation down a different path (sub-flow) of the Convo Flow.

Quick Replies

You can edit the text in each Quick Reply by hovering over the Quick Replies you wish to edit and selecting the edit icon on the right.

This will open the Quick Reply editor on the left. Click inside the text box that you wish to edit and make your changes.

You will notice that the text on the Quick Reply in the Chat Window on the right will update dynamically as you change the text in the text box on the left. Click Save when you’ve finished.

If you want to add an extra Quick Reply click the plus icon at the bottom right of the Quick Replies section and type in your new text. Click Save.

If you want to delete a Quick Reply click inside the text box of the one you want to delete – make sure it is highlighted with a dashed red border or else you’ll delete the wrong one. Once selected click the trash can icon at the bottom right of the Quick Replies section and the Quick Reply you selected will be deleted.

Important! Deleting a Quick Reply will also delete all sub-flows attached to that Quick Reply. If you wish to keep the sub-flows it’s better to change the Quick Reply text rather than delete it.

Hamburger Menu

You might have noticed the checkbox next to each Quick Reply with the text “Include in Hamburger menu”. This is definitely not a shout out to Burger King! The Hamburger Menu is the menu at the bottom left of the Chat Window that displays on your website.

hamburger menu on chat window

When clicked the Hamburger Menu can display up to four Quick Replies that you’d like your website visitors to be able to access no matter how far down a particular Convo Sub-Flow they are. For example, someone might have clicked to see what’s new in store then wants to ask about the status of a previous order. The Hamburger Menu enables them to click the “Check my order status” Quick Reply to go back up to the top level of the Convo Flow and choose to follow the Order Status Sub-Flow.

You can choose any of the Quick Replies present in an entire Convo Flow and add them to the Hamburger Menu. It’s best to choose those Quick Replies most likely to be selected by your website visitors.

Sub-Flows for Quick Replies

For each Quick Reply you need to ensure there is a Convo Sub-Flow. Otherwise your website visitors won’t receive a response from the bot when they click a Quick Reply.

To add a Sub-Flow to a Quick Reply click the Quick Reply you want to edit in the Chat Window on the right and click the plus icon. In this tutorial we’ll work on the “See best sellers” Quick Reply.

best sellers quick reply hover

A new grey box will appear beneath the Quick Replies asking you to select an element on the left to insert into the Convo Flow. You can create your own Sub-Flows manually by adding elements like Message Text, Quick Replies, Buttons and Images or by inserting Convo Modules.

add element to best sellers quick reply

Click the element you wish to add and it will be inserted into the Convo Flow under the Quick Reply in the Chat Window on the right. To insert the Best Sellers Convo Module click the Best Sellers icon in the editor on the left.

Now you will see the Chat Window on the right update with the Convo Module we inserted.

module inserted into best sellers quick reply

The Message text that was just inserted can be edited if you wish. Any changes you make here will only be saved for this Convo Flow. Your Convo Module will not be affected.

Now, we need to add Convo Sub-Flows for all the other Quick Replies. Next we will select the “I have a question” Quick Reply. Again we click the plus icon to add a Sub-Flow.

have question quick reply hover

In this tutorial we’ll be adding a custom Help & FAQ Convo Module we built previously. So we click the Flow icon in the editor.

add module to have question quick reply

A list of your custom Convo Modules will open in the editor. Select the Module you wish to insert so that it is highlighted and click Save.

add custom module to quick reply

The Help & FAQ custom Module has now been inserted as a Sub-Flow into the Chat Window on the right. You can go ahead and make any changes you like to the Sub-Flow.

convo module inserted into have question quick reply

Make sure to check all subsequent Quick Replies within this “I have a question” Convo Sub-Flow to make sure they have complete Sub-Flows.

Now, remember we have two more Quick Replies at the highest level for which we need to add Sub-Flows: “Check my order status” and “See what’s new in store”. Just follow the same process as we have shown above to complete this.

Settings

The third tab of the editor displays the chatbot settings.

convo flow settings

You can view settings such as on which page(s) it will display, to whom and after how long. As the Convo Flow used in this tutorial is based on a pre-built template you are only able to change the timing for the chatbot being triggered and the frequency of display to the same visitor (either once per session or per day). If you create your own custom Convo Flows from scratch you can customize all these settings using our Convo Setup Wizard.

Once you’re done click click the Publish button to publish this Convo Flow to your website or click the Save Draft button to save your changes without publishing them to your website.

Pin It on Pinterest