To host a published Framer site on Netlify, export its public pages, test the downloaded files, then deploy the folder containing index.html. Keep the original site available until you have checked the new deployment and replaced any services it still needs.
This guide covers NoCodeExport's public-URL workflow. The ZIP is a snapshot of the rendered site, not your editable Framer project, a live CMS, or a new React or Next.js application.
Choose the export you need
Open the Framer export tool, paste a published URL you own or have permission to export, and review the scan results. Select the pages and asset options before starting the export.
- Testing one page: Free supports single-page exports with assets linked to the original host. This is useful for reviewing output, but is not an independent backup.
- Moving a site: choose an eligible paid option for the required pages and downloaded assets. Site Pass and subscription plans have different limits.
- Continuing to edit in Framer: export and deploy again after updates. The hosted snapshot does not update itself.
Yes. Free lets you try a single published page, with images and fonts linked to the original site. It allows up to 10 exports per month, but each domain gets only one successful Free export in total, shared across all Free accounts; that domain allowance does not reset monthly. Failed attempts do not use it. For another export of the same domain, choose a Site Pass for one successful export or Pro for recurring exports. See the current pricing details. Netlify hosting allowances and charges are separate.
Framer's HTML export article says native HTML export is unavailable, while its portability article describes downloading published files. NoCodeExport works from the public website. Platform-hosted services still need separate migration.
1. Inspect the downloaded ZIP
Save an untouched copy, then extract the ZIP into a working folder. Open the included README.md: it describes the export mode and may warn about pages that were not fully processed.
| Item | What to check |
|---|---|
index.html | The entry file at the root of the folder you will publish. When you selected a subpage, it may lead to another exported page. |
| Other HTML files | Confirm the selected pages are present. Keep their paths and relative asset references intact. |
| Downloaded assets | Availability depends on the selected options and resources the exporter could retrieve. |
assets/framer/ | When runtime mirroring is used, downloaded Framer resources go here, including JavaScript modules ending in .mjs. |
RUN_LOCALLY.md | Included when runtime mirroring is used; follow the instructions for your package. |
sitemap.xml and robots.txt | If included, inspect the domain and page URLs before publishing elsewhere. |
The layout varies by export. Do not rename hashed scripts or flatten folders: imports depend on their paths. Downloaded assets do not guarantee complete independence. Videos, embeds and dynamic requests can still contact Framer or another provider.
2. Test over HTTP
Double-clicking index.html uses a file:// address, which can prevent modules and other resources from loading. Use a local web server.
With Node.js installed, open a terminal in the extracted folder and run:
npx serve .
Open the HTTP address printed by the command. An editor's local-server extension is another option.
Compare the source and export at desktop and mobile widths. Follow links, open menus, inspect fonts and images, and test scroll effects. Record differences. The Framer animation guide has further interaction checks.
3. Deploy the extracted folder
Sign in to Netlify and open Netlify Drop. Upload the extracted folder whose root contains index.html, then open the generated deployment URL. Avoid uploading its parent directory. Keep the HTML, assets and any hosting configuration together.
For Git deployment, put the exported files in a repository and connect it to Netlify. Publish the directory containing these already-built files without adding a Next.js or Framer build step. Source-site changes still require another export and repository update.
See Netlify's deployment instructions for current options. Keep the temporary Netlify hostname until validation is complete.
4. Check the deployed site
| Check | Passing result |
|---|---|
| Entry page | The expected page opens instead of a directory listing or 404. |
| Nested routes | Exported URLs work when pasted directly into a new tab and hard-refreshed. |
| Images and fonts | Important assets load without failed requests and match the intended layout. |
| JavaScript | Required modules return JavaScript, not an HTML error page. |
| Interactions | Menus, links and supported animations work with the required mouse, keyboard and touch input. |
| External requests | Remaining service dependencies are identified before canceling the source hosting. |
| Forms | A test submission reaches an endpoint and inbox you control; success and error states work. |
| Search metadata | Titles, descriptions, canonicals and indexing settings match the final domain and paths. |
A correct homepage does not establish that every route or feature works. CMS pages are snapshots. Accounts, checkout and other backend features need their own services.
Troubleshoot blank pages, routes and assets
| Symptom | First check | Next step |
|---|---|---|
| Blank local page | Is the address file://? | Use an HTTP server. |
| Blank deployed page | Inspect browser errors and failed requests. | Restore missing files or correct paths before changing headers. |
| Module MIME-type error | Check the exact .mjs response body and Content-Type. | If it returns HTML, fix the missing file or routing. A real module needs a JavaScript content type. |
| Nested route shows the homepage | Check redirects and broad single-page-app fallbacks. | Serve the exported page at its actual path; do not conceal missing pages with a catch-all rewrite. |
| Missing icons or fonts | Look for failed requests and source-host URLs. | Restore assets or export with suitable options. A paid plan alone cannot repair an inaccessible resource. |
| Different animation behavior | Compare scripts, console errors and external requests. | Retest dependencies; some components need manual changes or a rebuild. |
| Missing recent edits | Compare the export date with the published version. | Create and deploy a new export. |
Change module headers only when needed
If an existing .mjs file is served with an unsuitable content type, Netlify supports a _headers file in the published directory. For mirrored modules beneath assets/framer/, a targeted rule is:
/assets/framer/*.mjs
Content-Type: application/javascript
Merge it with existing rules, redeploy, and inspect the same request. Adjust the path to your package. This cannot turn a missing module or HTML fallback into JavaScript. See Netlify's header documentation for matching behavior.
Reconnect forms and hosted services
A visible form is not proof that submissions work. Inspect its destination and the form-handling option selected during export.
For Netlify Forms, follow the setup documentation, confirm detection after deployment, and send a test submission to an endpoint you control. JavaScript-rendered forms can need additional static markup. Exporting a page does not migrate its existing Framer submissions.
For another form service, verify the endpoint, spam protection, required fields, delivery and success/error behavior. Check search, analytics, consent tools, authentication and commerce separately.
Move the domain after validation
Add the custom domain in Netlify and use the DNS records it supplies. Change records at your authoritative DNS provider, which may differ from the registrar. Preserve mail records.
Keep page paths where possible. For changed domains or URLs, update canonicals, internal links, sitemaps and redirects. Remove temporary staging-only indexing restrictions when production is ready.
Keep the source hosting and an earlier working deployment available for rollback. Recheck HTTPS, routes, assets and forms on the final domain before retiring the old host.
How this guide was checked
Updated September 17, 2026 against NoCodeExport's export packaging and runtime-mirroring implementation and the linked Netlify documentation. Read the downloaded README and RUN_LOCALLY guide for package-specific details. This is not a claim that every Framer site or interaction passes migration unchanged.
Scan your Framer site to review available pages, or compare the export plans before choosing the scope.
