The ultimate power of our Editor is to give life to an otherwise static web content, and this is done by using Actions, together with Triggers and Conditions.
- Triggers define WHEN Actions can happen
- Conditions define IF Actions can happen
- Actions are commands that allow you to control everything on your page
A trigger is any event that allows you to run actions. Here are some examples:
- When a button is clicked
- Whenever a question is answered in a Quiz
- When the page first loads
- The moment a form is submitted successfully
- When a user scrolls down to a component
In our Editor, there will be many places where you will be able to use Triggers to run Actions, but those are specific to what you are working with. Here are some examples:
- Right-click a magic button to open its context menu and in the Actions Menu find the On click trigger
- While editing Quiz app questions, find various triggers on the left sidebar, such as When this Quiz is finished and Everytime a question is answered
- While on any stage, open the Rules menu from the right sidebar, then Add rule set, click the arrow to enter it, and now you can Add triggers that are bound to the current stage, such as When the stage loads, or if a specific data value changes, or a component becomes visible, while the stage is on.
Tip: most pages only have one Page level stage, so you can use the Rules menu to enable triggers that are always on.
What’s An Action Set
An Action Set is a group of actions in sequence, so that they execute in order, and only if all conditions are met.
Tip: you move Action Sets around by dragging them, and you can also easily copy, cut and paste them by right clicking to access their context menu (or use the usual shortcuts). You can also copy, cut and paste conditions and actions around.
Multiple Action Sets
You can add as many Action Sets as you wish to a single Trigger, and those Action Sets will run independent of each other.
Tip: This is useful when you want to do things that are unrelated, such as one Action Set is taking care of registering some data, whereas another Action Set is changing a stage of an app, independent of the data being registered.
What Are Conditions
Conditions allow you to control if the Actions of an Action Set should execute or not, when the Trigger event happens.
Here’s a simple example:
- Action Set 1
- Condition. IF the user has answered A to Question 1
- Action. go to Question 2
- Action Set 2
- Condition. IF the user has answered B to Question 1
- Action. go to Question 3
Adding A Condition
If you already have an Action Set and wish for it to only execute if one or more conditions are met, then:
- Click Add condition
- On the left input, type the name of the target to check the condition on.
Examples: “Quiz”; “Session data”; “Audience”
- Once you select a target, the dropdown will show what options are available. Select the value to run the condition on.
Example: “Quiz: Answer to Question A“
- Then setup a conditional on the chosen value.
Example: “Quiz: Answer to Question A is equal to correct“
- In some situations, you will be able to choose between:
- manual value. you type in the value yourself, manually
- value from. you to choose to link to any available data field on your page
- formula. you can create or use an existing formula
You can do multiple conditions in sequence.
The Actions of the Action Set will only run if all its conditions are true.
What Are Actions
Actions are interactive content’s bread and butter, and give life to your pages.
In general, actions allow you to control the components of your page, they allow you to modify data, they allow you to communicate to third party integrations, and they even allow you to run more actions, but which actions are avaialble will vary depending on which components you are using.
To understand it better, here are some examples of actions:
- Show or hide a component
- Scroll the page to a certain component
- Animate any particular component
- Play, Pause, Seek a video component
- Modify data of the current user
- Modify data from Session data
- Send leads to Mailchimp
So in short, an action will have a Target, such as a component or some data field, which supports one or more operations. A component can be shown, hidden, scrolled to, animated. A data field can be modified. On specific components there will also be specific actions, such as play, pause and seek on a video. All of those… are actions.
Adding An Action
Before you add an action you must:
- decide which Target your action should run on
- if Target is a component, make sure to name that component
- decide what Action you wish to run on that target
- decide which Trigger to use
How to add an action:
- On the chosen trigger interface, Add Action Set or chose to use an existing one
- Click Add Action within the Action Set you wish to use
- Type the name of the target and action you wish to call (e.g. “sectionA show”)
- Find the action on the list below and click to chose it
You can have as many actions as you wish in a single Action Set, and those actions will execute sequentially, one after the other.
Tip: you can sort actions around and even between different action sets by dragging them using the drag handle on their top left corner.