Code export - Webflow help
Op betaalde Workspace-plannen kun je de HTML, CSS, JavaScript en assets van je site exporteren om je code te back-uppen, aan je klant te geven of waar je maar wilt te hosten — zonder naamsvermelding.
Hoe je je code exporteert
- Open je site in Webflow
- Ga naar Hoofdmenu > Code export (klik op het "W" logo in de linkerbovenhoek om het Hoofdmenu te openen), of druk op Shift + E
- Klik op Voorbereiden ZIP
- Download het ZIP-bestand
Hoe je geminimaliseerde HTML exporteert
Het minimaliseren van je HTML kan helpen om de laadtijden van pagina's te verbeteren door witruimte, opmerkingen en andere code-elementen te verwijderen die browsers niet nodig hebben om de pagina te laden. Om geminimaliseerde HTML te exporteren:
- Open je site in Webflow
- Ga naar Hoofdmenu > Code export (klik op het "W" logo in de linkerbovenhoek), of druk op Shift + E
- Druk op Command + O (op Mac) of Control + O (op Windows)
- Vink het Minimaliseer HTML selectievakje aan dat verschijnt in het exportvenster
- Klik op Voorbereiden ZIP
- Download het ZIP-bestand
Wat uw geëxporteerde bestanden bevatten
Het gedownloade ZIP-bestand bevat alle pagina's, stijlen, scripts en afbeeldingen van uw site:
- Een CSS-map met alle stijlen van uw site in 3 .css-bestanden: - een CSS-bestand (bijv.
your-site-name.css) dat alle aangepaste stijlen van uw site bevat -webflow.cssdat gemeenschappelijke basisstijlen voor Webflow-layoutcomponenten bevat -normalize.cssdat ervoor zorgt dat browsers alle elementen consistenter weergeven - Een JS-map met alle JavaScript-bestanden voor uw site. Elementen en functies zoals formulieren, navigatiebalken, sliders, tabbladen en interacties zijn afhankelijk van deze bestanden. Als u deze bestanden verwijdert, kan uw pagina er correct uitzien, maar werkt deze niet zoals verwacht.
- Een afbeeldingenmap met alle afbeeldingen die zijn geüpload in het Assetspaneel van uw site
- .html-bestanden voor alle pagina's van uw site (inclusief lege Collection-sjabloonpagina's)
Goed om te weten
Als u een voorbeeld van de code wilt zien die Webflow exporteert, bekijk dan de broncode van de homepage — het is allemaal gebouwd in Webflow!
Wat uw geëxporteerde bestanden niet bevatten
De volgende functies en inhoud zijn niet inbegrepen in geëxporteerde code en zullen niet naar verwachting functioneren op geëxporteerde websites:
- CMS-inhoud en functionaliteit (inclusief Collection-items en Collection-lijsten)
- Gebruikersaccounts-inhoud en functionaliteit (inclusief gebruikers en toegangs groepen)
- Ecommerce-inhoud en functionaliteit (inclusief producten en afrekenen)
- Site- en/of pagina-wachtwoordbeveiliging
- Formulierverwerking
- Bestaande formulierinzendingen (kunnen apart worden geëxporteerd)
- reCAPTCHA-elementen binnen formulieren
- Sitesearch
- Gelokaliseerde inhoud (alleen de pagina's, elementen en inhoud van de primaire taal van uw site zijn inbegrepen)
- Codecomponenten
FAQ en tips voor probleemoplossing
Waarom is er een "w-" voorvoegsel voor klassenamen?
Webflow voorziet component-specifieke klassen van het voorvoegsel "w-" om conflicten met andere codeframeworks te vermijden.
Kan ik ervoor kiezen om slechts een deel van de code van mijn site te exporteren?
Op dit moment kun je niet kiezen wat er geëxporteerd wordt. Elk exporteerbaar deel van je site wordt bij elke export inbegrepen.
Kan ik de code bewerken nadat ik deze heb geëxporteerd?
Je kunt de code na exporteren bewerken. Handmatige wijzigingen aan geëxporteerde bestanden kunnen sommige Webflow-componenten breken.
Kan ik de .html-extensies uit de URL van mijn geëxporteerde pagina's verwijderen?
Als je de .html-extensies van je geëxporteerde pagina's wilt verwijderen, kun je dit doen met een .htaccess-bestand.
Moet ik Webflow vermelden als ik mijn site extern host?
Nee, je hoeft geen vermelding aan Webflow te geven of een Webflow-abonnement te behouden voor je geëxporteerde site om op je eigen server te werken.
Bevat de geëxporteerde code mijn CMS, lidmaatschappen en e-commerce-inhoud?
Nee. CMS, gebruikersaccounts en e-commerce-inhoud (databases) zijn niet inbegrepen in de geëxporteerde code. Collectielijsten tonen de lege staat.
Bevat de geëxporteerde code mijn gelokaliseerde pagina's, elementen en inhoud?
Nee. Gelokaliseerde pagina's, elementen en inhoud zijn niet inbegrepen in de geëxporteerde code. Geëxporteerde code bevat alleen de primaire taal.
Zullen met wachtwoord beveiligde pagina's nog steeds beschermd zijn nadat ik mijn code exporteer?
Nee. Pagina's met wachtwoordbeveiliging op je site zullen niet beschermd zijn na code-export. Je site moet worden gehost met Webflow om wachtwoordbeveiliging te laten werken zoals verwacht.
Zullen alle elementen op mijn site functioneren als ik de code elders host?
CMS, gebruikersaccounts, e-commerce inhoud en functionaliteit, en gelokaliseerde pagina's, elementen en inhoud zijn niet inbegrepen in geëxporteerde code. Deze functies vereisen hosting om te functioneren zoals verwacht. Bovendien zullen sitesearch en formulieren (inclusief bestandsupload en reCAPTCHA) niet werken op geëxporteerde sites om te voldoen aan de GDPR.
Waarom werken mijn Lottie-animaties niet lokaal wanneer ik mijn site exporteer?
Om veiligheidsredenen laden Lottie JSON-bestanden niet vanaf je lokale bestandssysteem, dus Lottie-animaties verschijnen niet wanneer je je site lokaal laadt — ze hebben een webserver nodig om te werken zoals verwacht.