Blog < Growth marketing< Webflow

Webflow site bouwen

Hoe je een blog bouwt in Webflow binnen 1 dag.

Growth marketing
4/2/2021

Blog maken in 2 uur met Webflow

Webflow is de beste optie om een website te maken. Het is uitgebreider dan Wix of Squarespace, dus later uitbreiden is mogelijk. Het is één hosted pakket, dus geen gedoe met veiligheidsupdates. Lees mijn Webflow review hier.


Maak een account aan voor Webflow. Het is gratis om een account te maken, pas bij livegang ga je betalen. Bekijk ook de Webflow tutorial video’s. Leerzaam en hilarisch.


Wordpress heeft veiligheidsissues en veel development werk nodig. Kies dus voor Webflow. Webflow heeft een steile leercurve. Met dit artikel loods ik je hier doorheen.

Maak een eerste versie - ga niet voor perfect

Probeer de site niet bij de eerste poging perfect te maken. Ik heb 6 maanden gewerkt aan deze website in allerlei versies.


Dit is de eerste versie uit maart 2020.


Als je meer dan een weekend bezig bent met ontwerpen en ermee aan de slag gaat, ben je te lang bezig geweest. 


De eerste maand gaat bijna niemand je website zien, dus het is oké als je navigatiebalk niet 100% perfect is. Je gaat de website toch weer aanpassen. Bouw de eerste versie, zodat je met content aan de slag kunt.


Gedurende de komende weken blijf je kleine wijzigingen doorvoeren. De perfecte versie komt uit die iteraties voort en is niet ineens te bedenken.


Als je Squarespace, Medium, WIX of iets anders gebruikt, schakel dan over. Hun SEO is niet geweldig, en je zult uiteindelijk de beperkingen van het platform tegenkomen. Later meer over SEO.

Mijn grootste fout is het designen van de perfecte website en alles willen weten van Webflow. Dat was onderdeel van het experiment om te leren een website te bouwen. Als je doel is om een personal brand website op te bouwen, zorg dat je in 4 uur versie 1.0 maakt.


Veel mensen lanceren nooit, omdat de website perfect moet zijn. Die perfectie is gebaseerd op angst. Angst om beoordeeld te worden door anderen, angst om te publiceren, angst om wat je vrienden ervan vinden. Overwin de angst door versie 1 live te zetten. Er gaan echt maar heel weinig mensen deze versie zien, dus chill.


1. Kies een gratis template

Maak een account aan als je dat nog niet hebt gedaan. Het is gratis om een account te maken, pas bij livegang ga je betalen.


Kies één van deze gratis templates:

Gratis Webflow thema "Lamar"

Gratis Webflow thema "Milton"

Gratis Webflow thema "Evermore"

Gratis Webflow thema "Moon"

Gratis Webflow thema "Denali"

Gratis Webflow thema "Tokyo"

Gratis Webflow thema "Escape"

De betaalde templates staan bovenaan, dus scroll helemaal naar beneden. Je kunt ook naar deze pagina gaan: https://webflow.com/blog-websites

Kies in ieder geval een thema dat CMS als optie heeft (alle bovenstaande templates hebben dat). Ik heb gekozen voor het thema "Espace", omdat ik de structuur vind passen bij wat ik wil gaan bouwen.

Ik kies hier een gratis template uit, scroll naar beneden naar de 'Free Templates' of 'View all' (of ga naar https://webflow.com/free-website-templates)

2. Pas de teksten op je homepage aan

Om meteen lekker visueel te beginnen, raad ik je aan om bij de homepage te beginnen. In het voorbeeld gebruik ik het thema Escape. 

Als je een ander thema gebruik, dan raad ik je aan om eerst wat filmpjes te kijken van de Webflow University

Gebruik je dit thema, dan kun je deze stappen precies doorlopen. Onder iedere afbeelding staat uitleg.

Klik op het linker icoontje dat staat voor 'Pages' en klik vervolgens op Home.

In het midden van het scherm zie je de website template. Pas de teksten aan naar eigen smaak. Doe dat voor de titel en de sub-titel en de oranje knop. Je kunt op elementen klikken en beginnen met typen.

Klik op 'Publish' (zie hieronder) en daarna op 'Publish to selected domains' om je wijzigingen op te slaan en te zien op de testomgeving. 

Klik op 'Publish' en vervolgens op het icoontje rechts van de bovenste URL (hier: ewoudsblog.webflow.io). Open de URL om te zien hoe dit er op een website uitziet.

Gefeliciteerd, je homepage header is af! De volgende stap is het aanmaken van categorieën.

3. Richt de categorieën in.

Je artikelen hebben een structuur nodig, zodat het overzichtelijk is voor de lezer. Om dat voor elkaar te krijgen, werken we met 'collections' in Webflow.

De woorden 'Nature' tot en met Adventure zijn categorieën en die gaan we aanpassen naar jouw eigen indeling.

Bekijk deze video om te leren hoe Collections werken:

De volgende stap is om de Collection 'Categories' aan te passen. Open de Collection 'Categories', zie de afbeelding hierboven.

Klik op de bovenste categorie, hier dus 'Productiviteit' en je ziet een tweede scherm.

Verander de naam (deze ziet de lezer)

Verander de slug, deze komt in de URL.

De kleuren en afbeeldingen laat ik voor nu gewoon hetzelfde. Dat komt in het design mooi van pas en kan je later altijd aanpassen.

Doorloop deze stappen voor iedere categorie in je Categorie Collection. Verwijder de overgebleven categorieën als het er te veel zijn.

Actie-stap: de namen en slugs van de categorieën moeten nu correct zijn.

Als je de categorieën hebt aangepast, ga je terug naar de Home pagina (onder icoontje met het papiertje links in beeld).

Klik op 'Publish' om te zien dat de categorieën inderdaad aangepast zijn. De volgorde kun je later aanpassen.

4. Voeg jezelf als auteur toe

In deze template (Escape) zit ook een collection met auteurs. Sommige templates hebben dat niet. Sla deze stap dan over.

Open de collection 'Authors' en selecteer de auteur 'William Wong'.

Maak van dit profiel je eigen profiel. Vul alle data in het rode veld hierboven in naar je eigen gegevens of laat ze leeg.

5. Schrijf je eerste blog artikel

Je bent er bijna. De volgende stap is dat we een blog-artikel dat als voorbeeld in je backend staat gaat aanpassen.

Klik op de collection 'Blog Posts' en open het bovenste artikel (Hoe je een blog opzet in Webflow in het voorbeeld).

Pas de Name, slug, Blog Post en Post Description in. Je kunt hier ook wat test copy inschrijven.

Nu gaan we deze blog een Auteur en een Category meegeven. Selecter hier dus jezelf én de categorie waar je het artikel in wilt laten belanden.

Klik op 'Save' rechts bovenin.

Ga nu naar de pagina 'Home' en je ziet je nieuwe artikel hier tevoorschijn komen! Je kunt dit herhalen voor alle andere dummy-artikelen die nog in de template zitten. Heb je nog geen andere artikelen? Verwijder dan de dummy-artikelen binnen de Collection 'Blog Posts'

Als je die nu nog niet hebt, kun je de dummy-artikelen verwijderen.

Website opzetten en inrichten

  1. CMS systeem kiezen
  2. Mini-funnel bouwen
  3. Analytics instellen
  4. Google webmaster tools instellen
  5. Zapier koppelen
  6. Autopilot koppelen
  7. Formulieren bouwen
  8. Webflow koppelingen maken
  9. Categories inrichten

Bevestig je aanmelding in je e-mail.
Sorry, something went wrong!

Andere artikelen

alle artikelen
Interview met growth hacking coach Ward van Gasteren

Interview met growth hacking coach Ward van Gasteren

Growth hacker Ward van Gasteren heeft een boek geschreven en een groei-model ontwikkeld. Een interview of groeimodellen, de verandering van werk en wat growth hacking betekent.

Growth marketing
Interview met venture capitalist Arthur Nobel

Interview met venture capitalist Arthur Nobel

Interview over schaalbaar groeien met investeerder Arthur Nobel van Knight VC

Ondernemen
Interview met growth hacker Davy Fung-A-Lo

Interview met growth hacker Davy Fung-A-Lo

Growth hacker Davy Fung-A-Lo over zijn transitie naar developer als volgende fase van growth marketing, zelf experimenten kunnen bouwen en de toekomst van advertising.

Growth marketing