How to create a Cookie Law Box

European and American laws require that digital publishers give visitors to their sites and apps information about their use of cookies and other forms of local storage. These laws also require that consent be obtained.

The implementation of such notice can vary from website to website. We have chosen to explain in this tutorial the most common use case which is a box with some informational text and an "I understand" button

What content should you add

Go to Components > Engage Box
Click New from the top bar
Enter a popup title in the Title field
Select Freetext from the Box Type drop-down list
Click Toggle Editor and type your HTML like the one shown in the screenshot

How do you trigger it correctly

Click the Trigger tab
Choose on Page Load for a Trigger Point
Choose your desired Cookie duration. A 30-day Cookie should be suitable.

How should you style it

The styling of it is of course optional. You can follow these steps for a good start if Bootstrap is used by your template.

Click the Advanced tab and type in your Custom CSS textbox the following CSS

.rstboxes .rstboxCookieBar {
	overflow:hidden;
	font-size:16px;
}
.rstboxes .rstboxCookieBar .btn {
	margin-left:20px;
}
.rstboxes .rstboxCookieBar .rstbox-close:hover {
    background-color: rgba(0, 0, 0, 0.9);
    color: #fff;
}
.rstboxes .rstboxCookieBar .rstbox-close {
    background-color: rgba(0, 0, 0, 0.7);
    height: 100%;
    line-height: 0;
    padding: 18px;
}
@media only screen and (max-width:1024px) {
	.rstboxes .rstboxCookieBar .rstbox-close {
		display:none;
	}
}

Then set the Class Suffix option to rstboxCookieBar. Save and close!