What are the steps to troubleshoot issues with the Finsweet script not working in Webflow, causing the cookie banner not to appear and console errors to occur?
TL;DR
- Ensure the script is correctly placed in Webflow’s Custom Code settings or Page Settings.
- Verify the Finsweet script URL is correct and accessible.
- Check console errors in DevTools for missing dependencies or syntax issues.
- Confirm Webflow HTML structure and class names match Finsweet’s requirements.
- Temporarily disable conflicting scripts and test if the issue resolves.
- Test on the published site, as custom code may not work in preview mode.
- Clear cache and test in an incognito window or different browser.
If your Finsweet script is not working in Webflow, causing the cookie banner to not appear and resulting in console errors, follow these steps to troubleshoot the issue.
1. Check Script Placement
- Ensure the script is placed in the correct location (e.g., inside the
<head>or before the closing</body>tag). - Webflow Settings: Go to Project Settings > Custom Code, and verify if the script is added in the correct area.
- Inside the Page: If using Page Settings, check for correct inclusion under Custom Code.
2. Verify Script Source URL
- Make sure the Finsweet script URL is correct and accessible.
- Open the script URL in a new browser tab to check if it loads without errors.
- If using a self-hosted or modified version, ensure its path and dependencies are correct.
3. Check Console Errors
- Open Chrome DevTools (F12 or right-click > Inspect > Console).
- Look for JavaScript errors related to the Finsweet script (e.g.,
404 Not Found,Uncaught TypeError, orCORS policy issues). - If any errors appear, resolve them based on their descriptions, such as missing dependencies or incorrect syntax.
4. Confirm Webflow Element Structure
- Ensure that the required HTML structure and class names match the expected values by Finsweet.
- If their script relies on specific
data-attributesor classes (e.g.,.cookie-banner), verify that your Webflow elements include them correctly.
5. Disable Conflicting Scripts
- Other custom scripts can interfere with Finsweet. Temporarily disable other third-party scripts in Project Settings > Custom Code and reload the page.
- If the Finsweet script starts working, re-enable other scripts one by one to identify the conflict.
6. Test on Published Site
- Some Webflow custom code only works on the published site, not in the Webflow Designer Preview mode.
- Publish the site and check if the issue persists.
7. Clear Cache and Test in Incognito
- Clear browser cache and load the site in an incognito window to rule out cache-related issues.
- Try a different browser or device to ensure it's not a local issue.
Summary
Verify the script placement, source URL, console errors, Webflow element structure, and conflicting scripts. Also, test on the published site and in an incognito window. If the issue persists, check for updates in Finsweet documentation for compatibility changes.