At Tidio, you have two options for adding a flow. You can do it by using our ready templates or by building your own flow from scratch. Whether you prefer starting from a blank canvas or leveraging pre-designed templates, Tidio has you covered.
In this article, you'll learn:
- How to create a flow from scratch
- How to add nodes in the editor
- How to connect, disconnect, move, and delete nodes
- How to save your flow
- How to use a pre-made flow template
- What other materials to check out
Creating a flow from scratch
To build a custom flow, open the Flows section in your Tidio admin panel and click on the Create from scratch button - you will find it in the My Flows section, as well as the Templates section.
Creating a flow manually allows you to build a scenario using available nodes. Each flow needs to begin with a trigger that tells the flow when to start. After setting the trigger, you can add actions and conditions to complete your flow. Of course, you can modify the trigger(s) later as well.
Adding nodes (triggers, actions, conditions)
The first thing you'll see when creating your flows is a window with all available triggers. Triggers are categorized by visitor actions on your page or widget, and by actions you initiate:
After choosing your trigger, you'll see the visual flow editor. It provides a grid where you can add and connect nodes (such as triggers, conditions, and actions). Think of it as creating a "map" for your flow — a logical chain of events that occur on the visitor's side, often referred to as a flow decision tree.
On the right, you will see a menu with all the available nodes: triggers, conditions, and actions. That is where you select all your building blocks for the current flow; to place a node, simply click on it and drag it onto the editing area.
Connecting, disconnecting, and moving nodes
The first node you add should automatically connect with the trigger; in general, however, you need to connect nodes manually. To do that, click on one of the node's points (located around each node) and drag a link towards the other node:
After disconnecting one node, you can link another one that you prefer:
If you wish to move several nodes at once, first ensure that you have the Select cursor enabled in the lower-left of the editor (that is the default):
This mode allows you to select nodes and move them around, using your left mouse click. You can select a larger area with multiple nodes as well:
The other option is the Move cursor:
This mode will aid you with dragging and moving the screen around for better visibility and navigation (using the left mouse click). You can still select and edit nodes, but only one at a time.
To delete a node, hover you mouse pointer over the node and click on the X button on the right:
You can also delete multiple nodes at once. First, select the nodes you wish to delete (by clicking and dragging, as explained earlier). You can't use the X button to delete them all at the same time, however; you need to use either the backspace or delete key on your keyboard.
Saving your flow
While the editor will save your progress automatically (creating a draft version of your flow), you can manually save any changes by hitting the Activate button in the top-right. That will also enable your flow, so that it starts working.
Of course, you can simply use the Close button as well, to exit the editor and keep your changes saved as a draft - you can keep editing the flow later on.
Adding a Flow template
If you prefer a quicker start, Tidio offers a variety of pre-designed flow templates categorized by goals - inside the general Flows section:
- Sales Flows
- Leads Flows
- Support Flows
Additionally, if the current templates don't quite fit your needs and you are new to Tidio, you can access the Welcome to Flows tab, available on the left side of your Flows section. This screen features a dedicated flow tailored for your specific Tidio project, offering clear recommendations for your next steps.
Navigating the templates
You can see all the available templates when you access a specific list. You can use the Search option if you know what you're looking for; you can also limit your view by using the filter and sorting options at the top:
For example, you can select the communication channel where the template should work (live chat, Messenger, Instagram, WhatsApp):
... or sort the templates by relevance, popularity, recommendation, date added, or name:
You also get access to Strategies - a quick way of adding several flows that work well together. You can learn more about this particular tool in this article.
Adding a template
To add and activate a template, you first need to decide which one(s) you like. Find a template in one of the lists, e.g. the Support Flows list:
All of the relevant templates will be listed there in the form of tiles. Hover your mouse over a chosen template to see some more information - and click on the blue Learn more button:
You'll see a new window where you can test the flow (as it would appear in your chat widget) by clicking on the Test it out button, or customize (and later activate it) by clicking on the blue Use template button.
When you choose Use Template, you'll see some basic options to modify this template to your preference, e.g. by customizing the most relevant flow messages:
You can also enter the more advanced customization mode by clicking on the Advanced editing option at the bottom; that way, you will be taken to the flow editor, where you can modify every detailed aspect of your new flow.
Click on each of the nodes you see on the editing map, and modify the texts to your preference:
Remember to click Activate when finished to ensure the changes are saved, and your new flow is enabled.
Further reading
If you wish to learn more about the manual flow creation process (or you're just looking for inspiration), see some of our other articles:
- Collecting valuable data with the Send a Form node
- Create an FAQ flow
- Flow portals - start one flow from another
- Create an autoresponder for missed conversations
- Adding links to flows
- Using the Visitors Says trigger
Comments
0 comments
Please sign in to leave a comment.