I'm trying to add a script to my Webflow website, but it's not working. I added it to the header, but nothing happens when I test it with my IP address. Any solution? I'm not very familiar with JavaScript, so I'm not sure what's wrong.
TL;DR
- Place the script in the "Before </body> tag" section in Webflow’s Custom Code, then publish your site.
- Use a third-party IP detection API (like ipify.org) in your script and check for errors using the browser Console on the live published site.
It sounds like you're trying to run a custom script (likely with IP-based logic) on your Webflow site by placing it in the header, but it's not executing as expected. There are a few common reasons this happens.
1. Verify Where You Placed the Script
- Go to Project Settings > Custom Code.
- If you placed the script in the Inside
<head>tag field, it may be executing before the page has fully loaded. - Try moving it to the "Before
</body>tag" section instead; this ensures that the DOM is loaded before your script runs. - After updating, publish your site again. Custom code changes do not affect the Designer or Editor preview—only the live site.
2. Confirm Your Script Logic
- If your script depends on your IP address, ensure the IP detection method works.
- Browser-side JavaScript can't directly retrieve a user’s IP address unless it uses an external API like ipinfo.io, ip-api.com, or ipify.org.
- If you're doing something like:
if (userIP === 'your.public.ip') { / do something / }, then you'll need to make an API call to get the IP, since there's no built-in browser method for this.
3. Test with Developer Tools
- Open your live site in Chrome, then open DevTools (Right click > Inspect > Console tab).
- Look for any errors related to your script (e.g., "Uncaught ReferenceError" or "Failed to fetch").
- If the console says your script is undefined or not running, the issue might be with how it’s inserted or the logic inside it.
4. Ensure HTTPS Compatibility
- Webflow serves sites over HTTPS. If your script fetches data from an HTTP endpoint, the browser may block it.
- Use HTTPS-based APIs and make sure external scripts use https:// URLs.
5. Site Must Be Published to Test
- Custom code only appears on the published site, not in preview mode.
- Go to Publish > Publish to Selected Domains, then test on the live URL.
Summary
Move your script to the Before </body> tag, ensure it's using a valid IP detection method via a third-party API, and confirm it's error-free using the Console on your live, published site. This should get your JavaScript running properly on your Webflow site.