Cookie Notice

Falcon has a built-in notification component that allows users to notify cookie uses on the website.

Toggle Notification
Structure

Falcon's Cookie Notice uses Bootstrap's "Toast" feature to show the notice content. .notice class is responsible for showing the notice as a popup. See Toasts documentation on Bootstrap.

<div class="toast bg-white notice" role="alert" data-options='{"autoShow":true,"autoShowDelay":0,"showOnce":true,"cookieExpireTime":7200000}' data-autohide="false" aria-live="assertive" aria-atomic="true">
  <div class="toast-body d-flex justify-content-center px-5">

    <!-- Your notice content-->
  </div>
</div>
Options

You can pass options via data-options through .notice element to control it's behavior.

data-options object
Example
data-options={"autoShow": true, "autoShowDelay": 3000, "showOnce": true, "cookieExpireTime": 7200000}}
Option Type Defaults Description
autoShow Boolean false Set true to make the Notice show automatically after the page is loaded.
autoShowDelay Number 0 How much time (ms) should wait after the page is loaded before showing the Notice. Works only when the autoShow is set true
showOnce Boolean false The Notice will show only once - for the first time when a user view the website and remain hidden according to the cookieExpireTime number.
cookieExpireTime Number 7200000 After how many time (ms) the cookie will expired. Count down starts after the user hits the “Close” or “OK, I UNDERSTAND” button on the cookie notice.

Thank you for creating with Falcon |
2020 © Themewagon

v2.8.0