We’re going to explain how every single key in this template works.
For the initial configuration of the behavioural message, please refer to the dedicated article how to configure a behavioural message.

LAYOUT > More
Zindex box : We set up a z-index to place the message above our website.
Box position : we can set a starting position for the box message.
Hide icon on title box : we can hide the icon within the text on the open button.
Text animation on the title box : we can activate or deactivate the animation on the initial text (effect on the text when the button is displayed).
Movable box : if set to “yes” the box will be draggable, if set to no, the box will be fixed in its opening position.
Animation speed (in milliseconds) is the speed at which it animates the text when the box is displayed, the higher the value, the slower the animation will run.
Additional CSS code : we can insert custom CSS code WARNING: insert valid CSS code.
LAYOUT > Location & Size
Drop Shadow Color : Set the color of the drop shadow.
Side Image Width (in px) | Minimum side image height (in px): we set the size of the side image.
Distance from the sides (in px): The starting distance of the left or right box (depending on the position) from the boundaries of the viewport.
Inner padding (in px) is the margin between the edge of the box and the contents.
Title Box Background Color | Rollover Title Icon Color | Rollover Title Box Background Color | Close Icon Color : We set the colors of the open button (the colors and text size will be configured in the next group of options).
Background Color | Outer Edge Color | Rounded corners (in px) | Border size (in px) we set the border colors of the content box.
Side image link destination : we can set the destination for the side image link.
Distance above/below : The starting distance of the box above or below (depending on location) relative to the boundaries of the viewport.
Minimum width of the content (in px) we can set a minimum width of the content box, but this will never exceed the width of the viewport.
Close icon : we select the icon we want for the close button of the message.
To show the drop shadow , we can decide whether to show or hide the drop shadow.
LAYOUT > Message Text
Link Color: We set the colors of the links to the internal text.
Title Box Text Color | Rollover Title Box Text Color | Title box text size (in px) | Title icon color : we set colors and sizes of the open message button.
Side image on the left : we can place the image on the left (option yes) or on the right (option no).
Side image link : Enter the URL for the side image.
Show side image : we can hide the side image.
Side image : we select the image to be shown next to the content through the media gallery.
Title icon : Select the icon to show next to the title in the open button.
Inner Text Color | Interior Title Color | Internal text size (in px) | Internal Title Size (in px): We configure the color and size of the text content.
Uppercase internal titles : We can force the “UPPERCASE” style for internal content titles.
Box title : we enter the text to be displayed in the open button.
Hide side image in responsive: if set to “yes” the side image for mobile resolutions will not be displayed.
Internal text in the box we enter the text content to be displayed.
Hide HTML content : We can choose to hide text content.
LAYOUT > Content recommendation
REC size original price (in px _ if on offer) | REC color original price (if on offer) | REC bar color original price (if on offer) | REC Color Text Price | REC text size price (in px): We configure the color and size of the text with the prices.
REC image height (in px) we set the height of the image on the product card.
REC button text we enter the text to be inserted into the card button.
REC color text product description | REC Color Text Product Name | REC Product Description Text Size (in px) | REC product name text size (in px) we configure the color and size for the text on the product card.
REC uppercase product name : We can force the “UPPERCASE” style for the product name.
REC Separation Line Thickness | REC separator line color : We configure the thickness (in px) and color of the separator line between the rec and the text content.
Hide REC Name | Hide REC Description | Hide img REC | Hide REC Pricing | Hide REC button: we can decide to hide or show the individual elements of the cards.
REC Price Order | Order description REC | REC Image Order | Order REC name we can decide the order of each element, the higher the value will be the sooner it will be inserted.

FORM > Location and Dimensions
Show Form Hide REC We can decide whether to show the form or the rec.
Form Input Background Color | Form Input Border Color | Color checkbox/radio form | Label form color | Form Background Color : We set the colors for label, input, and background.
Rounded corners of the form (in px): if the background of the form is active, we can set the rounded corners.
Form inner padding (in px if background color is active) we set the distance of the form’s contents from its outer margin.
Show Form Background if set to “yes” the background will be visible, otherwise it will not be visible.
Form Label Text Size (in px): We set the text size on the form’s labels.

BUTTONS > Button
Button rounded corners (in px) | Rollover Buttons Text Color | Rollover Buttons Background Color | Button Background Color | Button text size (in px) | Button Text Color | Rollover Button Border Color | Button Border Color | Button border size (in px) We set colors and text sizes for all buttons.
Uppercase button text : We can force the “UPPERCASE” style for all buttons.
Thanks for contributing!