Code export

On paid Workspace plans, you can export your site’s HTML, CSS, JavaScript, and assets from inside the Webflow Designer. You can do this to back up your code and provide it to your client if they request it. You can also use the exported code to host it anywhere you’d like – no attribution required. 

In this lesson, you’ll learn:

1. How to export your code
2. How to export minified HTML
3. What your exported files include
4. What your exported files don’t include
5. FAQ and troubleshooting tips

How to export your code

1. Open your site in the Designer
2. Click the Export button 
3. Click Prepare ZIP 
4. Download the ZIP file

Important: CMS, User Accounts, and Ecommerce content (databases) and Logic flows aren’t included in exported code. On exported sites, Collection lists will show the empty state, and Collection pages won’t show any content that’s bound to Collection fields. Any password protected pages on your site will no longer be protected after code export. Additionally, site search and forms (including file upload and reCAPTCHA) will not work on exported sites in order to comply with GDPR. Learn more about collecting form submissions on exported sites.

How to export minified HTML

Minifying your HTML can help improve page load times by removing white space, comments, and other code elements browsers don’t need to load the page. To export minified HTML:

1. Click the Export button at the top of the Designer
2. Press Control + O on your keyboard
3. Check the Minify HTML checkbox that appears in the export window
4. Click Prepare ZIP 
5. Download the ZIP file

What your exported files include

The downloaded ZIP file contains all your site’s pages, styles, scripts, and images:

1. A CSS folder with all your site’s styles included in 3 .css files:

• a CSS file (e.g., your-site-name.css) that contains all of your site’s custom styles
• webflow.css which contains common base styles for the Webflow layout system, as well as all the components like navbars, sliders, and tabs
• normalize.css which makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.

2. A JS folder which contains the Webflow.js file. This file contains all the JavaScript necessary to make the interactive elements of your pages work properly. Things like forms, navbars, sliders, tabs, and interactions rely on webflow.js. If you delete this file, your page might look correct, but it won’t work as expected.
3. An images folder with all the images uploaded in your site’s asset manager
4. .html files for all of your site’s pages (including Collection template pages without content)

Important: CMS, User Accounts, and Ecommerce content (databases) and Logic flows aren’t included in exported code. On exported sites, Collection lists will show the empty state, and Collection pages won’t show any content that’s bound to Collection fields. Any password protected pages on your site will no longer be protected after code export. Additionally, site search and forms (including file upload and reCAPTCHA) will not work on exported sites in order to comply with GDPR. Learn more about collecting form submissions on exported sites.

Good to know: If you’d like to see a sample of the code Webflow exports, check out the source code of our homepage by right-clicking and selecting View page source. It’s all built in Webflow!

What your exported files don’t include

The following features and content are not included in exported code and will not function as expected on exported websites: 

• CMS content and functionality (including Collection items and Collection lists)
• User Accounts content and functionality (including users and access groups)
• Ecommerce content and functionality (including products and checkout)
• Site and/or page password protection
• Form submission processing 
• Pre-existing form submissions (can be exported separately)
• reCAPTCHA elements within forms
• Site search
• Logic flows

Note: CMS, User Accounts, and Ecommerce Collections can be exported separately in CSV format if you want to save a backup of your Collection items, user accounts, and products. Learn more about CSV export.

FAQ and troubleshooting tips

Why is there a “w-” prefix in front of class names?

Webflow prefixes component-specific classes with “w-” to avoid conflicts with other code frameworks. 

Can I choose to export only a part of my site’s code? 

At the moment, you can’t choose what gets exported. Every exportable part of your site will be included in each and every export. 

Can I edit the code after I export it? 

You can edit the code after exporting. Keep in mind, however, that manual changes to exported files may break some Webflow components. 

Can I remove the .html extensions from the URL of my exported pages? 

If you want to remove the .html extensions from your exported pages, you can do so with an .htaccess file. 

Do I need to provide attribution to Webflow if I host my site externally? 

After exporting, you don’t need to provide attribution to Webflow or maintain a Webflow plan for your exported site to work on your own server. 

Does the exported code include my CMS, Memberships, and Ecommerce content?

CMS, User Accounts, and Ecommerce content (databases) aren’t included in exported code. Collection lists will show the empty state, and Collection pages won’t show any content that’s bound to Collection fields. 

Will password protected pages still be protected after I export my code? 

No. Any password protected pages on your site won’t be protected after code export. Your site must be hosted with Webflow in order for password protection to work as expected. Learn more about project and page passwords. 

Will all elements function on my site if I host the code elsewhere? 

CMS, User Accounts, and Ecommerce content (databases) and functionality, as well as Logic flows, aren’t included in exported code. These features require hosting to function as expected. On exported sites, Collection lists will show the empty state, and Collection pages won’t show any content that’s bound to Collection fields. Any password protected pages on your site will no longer be protected after code export. 

Additionally, site search and forms (including file upload and reCAPTCHA) will not work on exported sites in order to comply with GDPR. To collect form submissions, you’ll need to use a third-party tool or embed a third-party form integration. Learn more about collecting form submissions on exported sites.

Why don’t my Lottie animations work locally when I export my site?

For security reasons, Lottie JSON files won’t load from your local file system, so Lottie animations won’t appear when you load your site locally — they need a web server to work as expected.