Campaign Element Settings

This article will describe the different settings available for each element in the Campaign Editor. For the purpose of this guide, we have divided the settings into Design- and Action Settings. Design settings are settings that change the appearance of the widget, while Actions are settings for links, submissions, scripts, etc. 

Some of the settings apply to all the elements ( standard settings), such as width, colors, and margins, while some are unique for their element type (special settings), eg. the color of the checkbox for Consent, or styling for the close button. 

Standard Design Settings

The standard settings apply to almost all of the elements, to change their dimensions, background, and margins. 

Width and Height

Horizontal Align

If you decrease the width elements to less than 100%, the aligning option will activate. This allows to you align the element horizontally within its parent element.

Background Color

Change the background color of the element. The color can be set through the color picker, hex, or RGBA. You can also change the transparency of the color here.

If you rather have an image as a background, upload one here, or select it from your previously added images. After selection, you can adjust the size- and position settings of the background image. 

Rounded Corners

Border

Margin

Padding

Shadow

Change the shadow of the widget by adjusting the sliders and color.

• Horizontal: Adjust the shadow from right to left.
• Vertical: Adjust the shadow from top to bottom.
• Blur: Adjust how transparent ("blurry") the shadow should be.

• Spread: Adjust the length of the shadow, ie. how far away from the element the shadow should spread.

  

Hide on Mobile/Desktop

Special Design Settings

The special settings apply only to some of the elements, depending on their functionality.

Text Formatting

For text elements, or elements containing text (consent, Instagram, etc.), there will be text formatting available in the edit menu. 

Tiny Editor

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. 

Font Family

Color

Change the color of the text through the color picker, hex, RGBA, or HSLA. You can also change the transparency of the color.

Align

Font Size & Line Height

Font Weight

Required Fields

Vertical Align

Icon Image

Animation

Make your buttons a bit more creative with some animations! Have it wiggle every other second, or use the color-swipe to create a "netflix-next-episode-feeling".

Appearance on Mouseover (buttons)

With these settings, you can change the appearance of your button on hover/mouseover behavior. You can change the background color, text color, and border. 

Animation on mouseover

Animations work on mouseover (hoover) too, so you can wiggle the button whenever the visitor hoovers the button. The animations available are color swipe, circle, and show icon.

Checkbox Settings

Image Size

Actions

Actions

These options are available on the regular buttons and images. Some are also available for the submit button and the close button. 

• Open URL: Add the URL to the link you want to open on the button click. It will redirect the user to the same tab.
• Open URL in a new tab: Add the URL to the link you want to open on the button click. It will redirect the user to a new window.
• Change Step (only active if the widget has more than 1 step): Select what step you want to change to on a button click. 
• Close widget: Select this option to close the widget with the click of a button. 

• No action: If you don't want to do anything on click. This is usually combined with executing a script in the script feature.

  

Additional action

Apart from the above actions, there are also some more advanced actions you can use. 

• Log a goal in Triggerbee: Add a goal to all visitors that click this button, eg. "clicked on button A" vs. B if you have several buttons in your campaign. 
• Add a tag to visitor: Add a tag to the visitor that clicks on this button, for instance adding "prospect" to all signups.
• Open up campaign: Open up another (the other campaign must be published with the trigger "Manually" in order to appear in the dropdown)
• Execute script: Use this function to add any script to your widget, which will be triggered on the button click.
• Auto-trigger action: With this feature, you can have your selected actions automatically happen after X seconds. Perfect for auto-closing after submissions!

The whole Slide is a button