The Campaign Editor

The campaign editor is where you build and design your campaign. If you are creating a form, this is also where you connect your integrated email or CRM tool. This guide will explain all the parts of the editor. 

Design & Behaviour

The design & behavior menu consists of two parts, the Design & Elements menu, and the Form Settings (only if you are creating a form).

Design & Elements

This is a list of all your current campaign elements. They are listed from left to right, top to bottom. Rearrange the elements by drag-and-drop directly in the campaign, or here in the design & menu.

Form Settings

If you are creating a widget containing a form, you will also have the Form Settings in the design & behavior menu. This is where you decide what will happen on conversion, ie. where should the collected data be stored? Usually, you want to store it in a response list and send it to your integrated email tool. 

Depending on what apps you have integrated, different options will appear in the list. Select the app you want to connect to the widget, and enter the settings before you Save. You will find more information about the Form Settings here.

Note: If you want to use Double-Opt-In (confirmation email), make sure you have that set up in your app before activating it in Triggerbee.

Adding new elements

In the right menu, next to the Design & Behaviour, you will find the Add section. This is where you add new elements to your campaign. All types of elements are covered in this guide. Elements that are disabled, can not be selected either because they can only be used once (like the email input field), or because it's an upcoming feature. 

Click on any element to add it to the campaign, or drag and drop it directly to the desired position. The settings menu of the new element will open so that it can be customized just the way you like. Press Save at the bottom of the settings menu to save, or simply just press anywhere in the widget for auto-saving.

Removing elements

If you want to remove an element, you can do so by simply clicking on the element and then clicking on the trashcan next to it in the editor, or on the Delete button at the bottom of the settings menu. 

Element Settings Menu

Each element has its own settings. Click on any element in the design & elements menu to open the element settings menu. The settings menu can also be opened by clicking the desired element in the canvas. By clicking an element, their settings will open on the right side of the editor. Watch your element change its appearance immediately as you adjust the settings in the menu. 

Elements that have text in them, like text elements or buttons, will also have a tiny editor in the canvas for text formatting. This is perfect for when you want to change color, size, or formatting on specific words in your text. Remember that the tiny formatting overrides any settings in the settings menu, ie. if you change the font size the tiny, you have to remove that formatting before changing it in the element settings menu. 

Want to know more about all the element settings? Go ahead and read this guide!

Desktop vs. Mobile

Use the Desktop and Mobile buttons at the bottom of the canvas to toggle between each device. This allows you to see what the widget will look like in Mobile vs Desktop view. If there's an element that you don't want to show on mobile devices, simply press "Hide on Mobile" at the bottom of the element settings. Hidden elements will show in the Layout, but will be disabled for the selected device. If you want to know more about mobile editing, please check out this guide that covers it all!

Steps

A campaign can contain one or more steps, which is useful for nudges or giving out discount codes after signups. 

There are three types of slides.

• Primary. This is a Regular slide. Useful for having multistep guides. You can have as many Primary steps as you like. 
• Success. Use the Success step as the last step in your widget, for rendering your discount code to the converted visitor, or simply saying thanks for signing up. 
• Teaser. Teasers are minimal campaigns that you can either use as your first step in your campaign, to nudge about an offer, or as a minimized version for reminder dismissal visitors. When clicked, the full-size widget is opened.
  

🎉 Now that you know all about the editor, let's jump into learning more about the elements!