The 'allowCookies' configuration parameter
The allowCookies (boolean) parameter controls whether cookies are enabled in the Flow. By default, it is set to true.
You can explicitly set it to false to disable the Flowbox cookie. This prevents the cookie from being created, which means that the user's interactions and analytics data will not be tracked. The Flow is always displayed regardless of the Cookie settings.
To set the allowCookies parameter to false, add the parameter to the Flow's embed snippet:
<div id="js-flowbox-flow"></div>
<script>
window.flowbox('init', {
container: '#js-flowbox-flow',
key: 'YOUR FLOW KEY',
locale: 'language-COUNTRY',
allowCookies: false
})
</script>
Cookies setup for Cookiebot users
Cookies setup for Cookiebot users
If you use Cookiebot, depending on your setup the Flow might be automatically disabled whenever a user doesn't accept a specific set of Cookies (usually "Marketing" as Cookiebot automatically considers categorizes Flowbox under "Marketing", although Flowbox cookies actually matches "Statistics"). In order to ensure that the Flow is properly displayed regardless of the user's Cookie consent, you will need to configure Cookiebot so it no longer disables it.
The next step would be to modify the code that has been used to integrate the Flow itself by using the allowCookies configuration parameter. The code below uses Cookiebot's "CookiebotOnLoad" event to set up the allowCookies parameter to true or false depending on the user's choice during the Cookies consent prompt. This event is triggered whenever the user submits consent or when the user navigates to a page where consent has already been submitted. Once the parameter is set up, the script proceeds to initialize the Flow.
<div id="js-flowbox-flow"></div>
<script data-cookieconsent="ignore">
window.addEventListener('CookiebotOnLoad', function () {
let fbxCookies = Cookiebot.consent.statistics;
(function (d, id) {
if (!window.flowbox) { var f = function () { f.q.push(arguments); }; f.q = []; window.flowbox = f; }
if (d.getElementById(id)) { return; }
var s = d.createElement('script'), fjs = d.scripts[d.scripts.length - 1]; s.id = id; s.async = true;
s.src = 'https://connect.getflowbox.com/flowbox.js';
fjs.parentNode.insertBefore(s, fjs);
})(document, 'flowbox-js-embed');
window.flowbox('init', {
container: '#js-flowbox-flow',
key: 'INSERT FLOW KEY HERE',
locale: 'language-COUNTRY',
allowCookies: fbxCookies
})
})
</script>
Make sure to add the values of your Flow Key in the initializer script's "key" parameter, and the value of your Catalog's locale in the initializer script's "locale".
Cookies setup for CookieScript users
Cookies setup for CookieScript users
When using CookieScript, you might need to set up the Flow's cookies manually in order to prevent it from being automatically hidden if a visitor doesn't accept the cookies under which Flowbox has been categorized. In order to do so, you can use JavaScript to listen to the Custom Events that CookieScript fires whenever a visitor approves consent for a specific type of cookie.
The following example awaits for the "Unclassified" type of Cookies to be approved before setting up the allowCookies parameter to true. Otherwise, it will be false and the Flow's cookie will not be created.
<script>
var fbxAllowCookies = false;
var flowContainerId = "js-flowbox-flow";
(function(d, id) {
if (!window.flowbox) { var f = function () { f.q.push(arguments); }; f.q = []; window.flowbox = f; }
if (d.getElementById(id)) {return;}
var s = d.createElement('script'), fjs = d.scripts[d.scripts.length - 1]; s.id = id; s.async = true;
s.src = 'https://connect.getflowbox.com/flowbox.js';
fjs.parentNode.insertBefore(s, fjs);
})(document, 'flowbox-js-embed');
function insertFlow(){
window.flowbox("init", {
container: '#' + flowContainerId,
key: 'INSERT FLOW KEY HERE',
locale: 'language-COUNTRY',
allowCookies: fbxAllowCookies
});
}
window.addEventListener('CookieScriptCategory-unclassified', function () {
fbxAllowCookies = true;
if (document.querySelector('#' + flowContainerId)){
document.querySelector('#' + flowContainerId).remove();
}
insertFlow();
});
if (fbxAllowCookies == false){
insertFlow();
}
</script>
Make sure to add the values of your Flow Key in the initializer script's "key" parameter, and the value of your Catalog's locale in the initializer script's "locale".
Depending on how you're categorizing the Flowbox cookie, you might need to listen to a different other than "CookieScriptCategory-unclassified"