Hey,
I’m currently setting up Facebook Pixel consent following The Webflow guide here: Facebook Pixel | Webflow University
I’ve designed the banner, added the animations and added the JS code to make the local storage.
And it does work 90%.
So when a user enters the site the first time he will get the banner, and when he clicks “Grant”, Facebook will fire the pixel.
But if the user refreshes the site, the banner will now be gone, but the Facebook pixel does not fire.
From my understanding, the script below should check if FB is granted, and if it is, it should be fired.
Here is link to the test site: https://checkdstaging.webflow.io/
(I’ve also tried it on live site, but no luck)
So my guess is that there is something wrong with the JS provided by Webflow (?)
This is the JS:
<script type='text/javascript'>
var popup = document.getElementById('consentPopup');
var alreadyLoaded = window.localStorage.getItem('fbGrantConsent') === 'true';
//Show the consent banner if consent is not granted, hide it if consent is already granted.
if (alreadyLoaded) {
popup.style.display = 'none';
fbq('consent', 'grant');
} else {
popup.style.display = 'block';
}
//Grant consent and store it in localStorage of the browser
var consentBtn = document.getElementById('consentBtn');
consentBtn.addEventListener("click", function() {
fbq('consent', 'grant');
window.localStorage.setItem('fbGrantConsent', 'true');
});
</script>
Any suggestions?