Webflow support custom code in HTML Embed areas, as well as in page-level and site-level custom code areas.
However, these areas have a size limit, are difficult to access and inconvenient to develop in.
While there are some hacks such as uploading your JS as .txt files, none of these are really suitable for development work. It's well worth your time to invest in learning the real tools that will work for you.
If you want to host a JavaScript file for free, there are several reliable options available. In general you should think of this as two parts;
Here are some of the best combinations;
Finsweet has a walkthrough of this process.
https://www.youtube.com/watch?v=GEodIxXdmnY&ab_channel=Finsweet
Github has a built-in editor, full history, and excellent user control. To serve the content you have several options;
A free public CDN that can serve files from npm packages or directly from GitHub repositories. It's optimized for loading speed and can be used to host and serve your JS files.
With Netlify, you can drag and drop your project, and it will be hosted for free. It's great for hosting static sites, but you can also use it to serve individual JS files.
It can also be directly connected to a public Github repo, and auto-publish from it. Private repos are also available on a paid Netlify plan.
Another platform similar to Netlify. Vercel provides hosting for static files and JS-based projects like those made with Next.js.
Glitch allows you to write, share, and remix code for fun and practical purposes. You can host full web applications, but it's also feasible to serve individual JS files.
Part of Google's Firebase suite of tools, Firebase Hosting offers free hosting for static assets, including JS files.
A community-driven CDN which hosts many popular JavaScript libraries and plugins. If your JS file is a library or tool that others might benefit from, you can request its inclusion on CDNJS.
During development, these are other great options which support an Interactive Development Environment ( IDE ). This allows you to code freely, and then immediately save and view the results in your Webflow site without having to update script in your site's custom code area.
However these options may not be entirely free.
Offers a nice built in editor, and delivers any file type by CDN, however it has no history or ability to revert changes, and not designed for team use.
Codepen pro allows you to directly serve your JS and CSS files so that they can be referenced in your Webflow site.
Similar to Codepen but a bit beefier on project management.
Codespaces is one of our favorite frameworks today. It involves a bit of knowledge and setup, however if you do real development on Webflow we consider it a non-negotiable part of the equation.
