Cookies

Cookies element allows us to handle Cookies with ease directly at Bricks. You can customize almost anything.
Cookies is made up of a nestable Notification element and a non-nestable Preferences element.
Notification element is Bricks block element. You can customize all the styles you need at it’s style tab and place any element you want it.
There is a wide variety of styles included to customize Preferences element and even the possibility to have it as a modal or offcanvas.

Cookies are divided into categories.
Those essential cookies you don’t track are understand as necessary cookies. And the “Necessary” category will be always included and enabled. The user won’t have the possibility to disable it. This is, because necesary cookies are those needed to make our website work properly.
To track and set a non essential cookie at a category, create a category and set the attributes: type=”text/plain” and data-category=”customName” to the script inserting the cookie. “customName” is the name you have given to the category. The script will be linked to the category automatically.
Example: we have created a category with the name analytics, and we have declared an analytics script at the header of our website that could look like: <script src=”analytics.js”></script> and this script is inserting a cookie we want to track at our Anayltics category, so we have to declare it as: <script type=”text/plain” data-category=”analytics” src=”analytics.js”></script>
Now, the script won’t execute and insert the cookie until the user gives us his/her consent. This is, accepting Analytics category or all cookies.

Cookies element is a cookie itself. It is a necessary one as it is essential in order to manage the rest of cookies. At this section you can edit it’s name and the days until it expire.
Preferences type: preferences can be displayed as a modal or offcanvas. The demo is a modal.

At this section we can create the categories to display at preferences and to track our scripts inserting cookies.
As explained before, “Necessary” category is always included, so “Necessary title and description” controls are to edit it.
Custom categories controls:
Name: the value to be used at the data-attribute to track our scripts: data-attribue=”Name” and the script will be linked to this category.
Title: the category’s title to display at preferences.
Description: the category’s description to display at preferences.
Enabled: if true, the category will be automatically enabled on page load.
Read only: if true, the category will be automatically enabled on page load, the category’s scripts won’t be blocked and the category can’t be disabled. Just like the “Necessary” category is.

There is a wide variety of styles available to customize Preferences element at “Preferences elements” group, as well as Notification and Preferences entrance (on page load) and exit (a consent is produced) animations.

Cookies element integrates CookieConsent library (v3)
There are many possibilities available at this library.
For example, in order to be GDPR compliant you should let the user manage cookies at any time, even if they have already made a decision. You can easily achieve this by setting the attribute data-cc=”show-preferencesModal” to the element you want in order to display the preferences modal again when clicking it.
Another possibility could be to add a “Reject all” button directly at the notification. In such case, we can set data-cc=”accept-necessary”. Or even delete all the buttons that come with Notification element by default and use a Ripple Button or Anyside Button instead using data-cc=”show-preferencesModal” and data-cc=”accept-all”

– Tamu