Landing pages in Elementor

Wat zijn dat nu eigenlijk… ‘landing pages’?

landing pages in elementor

Het maken van landing pages in Elementor is eigenlijk altijd al heel makkelijk geweest. Het enige wat je hoefde te doen was een WordPress pagina te maken, onder de pagina attributen aan te geven, dat het een ‘Elementor Canvas’ was en voila… je kon je landing page bij elkaar draggen en droppen…

Maar wat is nu eigenlijk een landing page?

Een landing page is een pagina die pagina die helemaal op zichzelf staat. De pagina heeft geen enkele (directe) verbinding met de andere pagina’s op je website.

Het idee van een landing page is ook, dat iemand (meestal door een advertentie) op deze pagina arriveert en vervolgens de pagina niet meer af zal gaan tot hij de actie heeft uitgevoerd waar de landing page hem toe aanzet. Meestal een product kopen, of een email adres achterlaten.

Landing pages in Elementor

landing pages in Elementor
Website page template. Web design. Set of web page with icons for different websites in flat style. One page website flat ui and ux kit elements icons

Sinds Elementor 3.1 is een ‘landing page’ echter niet meer gewoon een ‘standaard pagina’ met bijzondere inhoud, maar de landing pages in Elementor zijn nu onder een apart ‘kopje’ komen te staan in het dashboard.

Persoonlijk ben ik hier heel blij mee. Ik maak nogal wat landing pages aan en tussen de ‘gewone pagina’s’ begon dat op een gegeven moment toch een aardig rommeltje te worden. Sommige landings pages hebben namelijk maar een heel beperkte levensduur: Voor ‘Black Friday’, de ‘Zomer collectie’, terwijl andere pagina’s wat langer mogen blijven bestaan. Zoals die cursus die je twee maal per jaar geeft.

Maar vanaf versie 3.1 hebben de landing pages in Elementor dus hun eigen plekje gekregen. Tenminste, wanneer je bij de Experimenten in Elementor het ‘landing page’ experiment aan hebt gezet.

De templates voor landing pages in Elementor

Nu komt Elementor in de gratis versie gelijk met een groot aantal templates om die landing pages ook snel op te kunnen maken. In de template bibliotheek zijn op het moment dat ik dit schrijf zo’n 70 voorbeelden van landingspagina’s te vinden.

Persoonlijk kan ik hier overigens niet echt warm voor lopen. De meeste landingspagina’s zijn wel heel specifiek.

Maar niets let mij natuurlijk om mijn eigen landingspages te maken. Maar hoe moet zo’n pagina er dan uit komen te zien?

Dat is precies waar we in deze blogpost verder naar gaan kijken. Gebruik je geen Elementor of Elementor Pro? Geen enkel probleem. Waar we vooral naar gaan kijken is de opbouw van een goede landingspagina. Per slot van rekening ziet de bezoeker niet welke gereedschappen je hiervoor hebt gebruikt.

Maar toch een klein voordeel

Wanneer je landing pages in Elementor maakt heb je een klein voordeel ten opzichte van bepaalde andere tools voor het maken van landing pages.

Omdat je in Elementor zelf ‘Sectie templates’ kan maken kan je vrij eenvoudig langzaam maar zeker een ‘blokken bibliotheek’ opbouwen met herbruikbare blokken die je in toekomstige landing pages wilt gaan gebruiken. Op deze manier kan je in de toekomst steeds sneller en makkelijker jouw landingspages in Elementor maken.

De bouwstenen van je Landing Page

Een landingspagina bestaat uit een aantal ‘vaste onderdelen’ die overigens niet direct allemaal in een landingspagina voor hoeven te komen. Maar als ze voorkomen, dan is de hieronder beschreven volgorde wel een heel handige.

Navigatie

Zojuist had ik je nog verteld, dat een landingspagina op zichzelf staat, zonder enige verbinding met de rest van de website en nu begin ik ineens over een navigatie?

Inderdaad. Maar we hebben het hier niet over een navigatie naar andere pagina’s toe, maar een navigatie binnen de pagina zelf. Een manier voor de bezoeker om snel en makkelijk naar de verschillende pagina’s van de site te kunnen scrollen.

Dat heeft natuurlijk alleen maar zin, wanneer het een zogenaamd ‘sticky’ menu is. Want een ‘gewoon’ menu zal al snel de pagina afscrollen en daarmee functie verliezen.

In-pagina navigatie in Elementor

Het linken naar deze secties in de pagina is eigenlijk extreem eenvoudig. Het is zaak, dat je in de betreffende sectie een ‘Menu anker’ opneemt. Een min of meer onzichtbare widget (in design mode is het een grijze band met een anker erin, op de site zelf is het onzichtbaar) waar je alleen een naampje in hoeft te vullen.

Bovenaan de pagina heb je een menu, of misschien een iconen lijst en in plaats van een reguliere link vul je hier een hekje en de naam in die je ook bij de sectie hebt ingevuld. Let er overigens op, dat iedere sectie een unieke naam moet krijgen.

In-pagina navigatie in HTML

In HTML wordt het iets lastiger. Ik ga er even vanuit, dat je in ieder geval ‘basis HTML’ spreekt. Een menu item geef je iets wat lijkt op de volgende HTML code:

<a href="#koopnu">Koop nu</a>

Deze code zet een tekst op het scherm. Klik je op de tekst ga je naar een andere plaats in het document toe, waar je het volgende HTML fragment voor laat komen

<a name="koopnu"></a>

De ‘hero’

Wanneer je landing pages in Elementor maakt is het vrij eenvoudig om een zogenaamde ‘hero’ op je pagina te zetten. Maar wat is een ‘Hero’.

Een ‘Hero’ is een grote header op je pagina. Vaak is een Hero schermvullend of bijna schermvullend op een desktop, soms wat kleiner om direct duidelijk te maken, dat er ook nog wat onder zit. ‘Heros’ zijn overigens niet specifiek voor landing pagina’s. Je vindt ze vaak ook op de homepage van een site.

landing pages in Elementor
De ‘hero’ van WordXPression

Wanneer je ‘hero’ pagina vullend is, kan dit behoorlijk indrukwekkend zijn. Er is echter ook een meer dan redelijke kans, dat de bezoeker niet door heeft, dat de pagina nog doorloopt. Het is dus altijd goed om een ‘Lees meer’ knop aan een pagina vullende hero toe te voegen. Wanneer er op die knop wordt geklikt, zal naar de volgende sectie op de pagina worden doorgescrold.

De ‘Hero’ is ook een heel goede plaats om een auto play video neer te zetten. Gebruik je de landing pages in Elementor, dan is het toevoegen van een video eigenlijk een fluitje van een cent.

De voordelen van je product

De volgende sectie moet duidelijk maken op welke wijze het leven van de bezoeker aangenamer maakt. Wat belangrijk is, is dat we een verschil maken tussen de voordelen en de kenmerken van een product. Een voordeel van een video camera kan bijvoorbeeld zijn, dat de opgenomen video’s haarscherp zijn met levensechte kleuren.

Dat de video in 4K resolutie wordt opgenomen is een kenmerk

Deze productvoordelen kunnen als informatie in de hero zijn opgenomen, in dat geval vallen de ‘voordelen’ en de ‘hero’ sectie dus samen.

KOOP NU!

De meeste bezoekers zullen nog niet overtuigd zijn, dat ze het product al willen kopen. Daar staat tegenover dat je niet wilt, dat de mensen die hier wel van overtuigd zijn helemaal tot onder aan de pagina moeten scrollen. En daarom neem je op enkele plaatsen in de pagina een ‘koop nu’ knop. Deze ‘koop nu’ knopt linkt aan een menu anker wat bij de prijs / koop nu informatie staat.

Omdat je deze knop op meerde plekken wilt gebruiken, kan het bij landing pages in Elementor een goed idee zijn om van de knop een ‘global widget’ te maken. Op deze manier hoef je later wanneer je de knop aan zou willen passen, dit maar op één plaats te doen.

Kenmerken

Nu is het tijd om de product kenmerken toe te voegen. Lees nog even het kopje over de voordelen terug om precies het verschil te begrijpen.

Visueel kan je dit mooi doen met een ‘icon list’ of ‘icon boxes’ wanneer je gebruik maakt van landing pages in Elementor.

Social Proof

De volgende sectie is die met social proof. Idealiter is het natuurlijk een aantal reviews / testimonials van mensen die het product gebruiken. Maak je jouw landing pages in Elementor dan heeft Elementor een aantal fraaie widgets die je daarvoor kan gebruiken, inclusief een testimonial slider.

Maar is je product net nieuw, dan is het natuurlijk niet zo eenvoudig om (geloofwaardige) testimonials op je site te zetten. In plaats daarvan kan je iets over je eigen expertise of over de expertise van je bedrijf vertellen.

Wat ook altijd goed werkt is een aantal logo’s van grote, bekende bedrijven waar je voor gewerkt hebt.

De ‘koop’ sectie

Uiteindelijk gaat het er natuurlijk om, om het product te verkopen. En daar hoort een prijs bij. Nu heb ik in het verleden al iets geschreven over A/B testen om een goede prijs te bepalen. Een andere methode om te onderzoeken hoeveel een bezoeker bereidt is te betalen is door een aantal verschillende prijsopties te geven.

Alle eerder aangemaakte ‘koop nu’ knoppen die linken naar deze sectie. Vergeet dus geen menu-anker in de sectie te plaatsen.

Een tijdje terug heb ik iets geschreven over verschillende plugins voor prijstabellen, voor de nabije toekomst zit er nog een blogartikel in de pijplijn voor een wat diepere strategie achter prijstabellen. Want daar kan je nog leuke dingen mee doen.

Gebruik je de landing pages in Elementor Pro, dan kan je natuurlijk gebruik maken van de ‘eigen’ pricing table widget van Elementor pro zelf.

Idealiter kan de hele transactie op één pagina worden afgehandeld. Praktisch gezien is dit echter niet altijd de beste oplossing. Al helemaal niet in Nederland. Voor betalen met credit cards bieden verschillende diensten (waaronder Stripe) de mogelijkheid aan om met een ’embedded form’ te betalen… maar voor iDEAL is zoiets niet eens mogelijk, omdat je altijd een uitstapje naar je eigen bankpagina moet maken.

Bovendien vind ik het zelf best handig om alle betalingen netjes in WooCommerce op te hebben geslagen. Ik gebruik dus het liefst een WooCommerce shop op de achtergrond als betaalprocessor. De plugin van Mollie voor WooCommerce is ideaal om deze koppeling te maken.

Je maakt dan dus even een ‘uitje’ naar het betaalsysteem. Zorg ervoor, dat jouw links overigens niet naar het product in de webshop gaat, maar naar de afreken link.

Is het ID van jouw product bijvoorbeeld 123, en heb jij een standaard Nederlandstalige WooCommerce installatie, dan link je naar

https://deurlvanmijnwebshop.nl/afrekenen/?add-to-cart=123

Let even op het vraagteken en de ‘add-to-cart’ met een T en niet met een D op het einde. In de afgelopen jaren ben ik al heel vaak gevraagd door mensen te kijken waarom zo’n betaallink niet werkte. Bijna zonder uitzondering waren ze of het vraagteken vergeten, of was het woord ‘cart’ verkeerd gespeld.

Contactgegevens

En helemaal onder aan de pagina komen de contactgegevens. Zelfs wanneer er een contactpagina op je website is, is het goed om op iedere landing page ook contactgegevens te hebben. Het is immers niet de bedoeling, dat mensen de pagina moeten verlaten om die gegevens bij de hand te hebben.

Het verkeer naar je landing page

landing pages in Elementor

Zo’n landing page is natuurlijk leuk, maar je wilt hier natuurlijk ook graag verkeer op ontvangen. Wat daar de beste strategie voor is, is sterk afhankelijk van de vraag hoe lang de pagina online zal blijven. Is het bijvoorbeeld de pagina voor een kortlopende actie dan zal SEO niet de beste manier zijn. SEO kost tijd. Is het echter een voor een terugkerend evenement, dan is SEO een goede optie.

Zoekverkeer

Eén manier om verkeer naar je website te krijgen is natuurlijk het organisch zoekverkeer via de zoekmachines. Tenminste, wanneer de pagina lang genoeg online staat.

Persoonlijk vind ik het altijd lastig om een landing page goed te optimaliseren. Je wilt immers de teksten beknopt en relevant voor de lezer houden. Een landing page is geen blogpost, de bezoeker komt niet voor iets wat hij wil lezen maar voor iets wat jij hem aan wilt prijzen.

Eén van de manieren om toch ‘meer relevantie’ voor de zoekmachines te krijgen is door niet alleen je pagina te optimaliseren, maar ook vanuit andere pagina’s op je site(s) met relevante keywords door te verwijzen naar je landing pages.

Betaald verkeer

Een tweede manier om meer verkeer naar je landing page te krijgen is door middel van betaald verkeer. En dat betaald verkeer kan je eigenlijk opsplitsen in twee hoofdgroepen. Verkeer wat op jouw site komt via advertenties van diensten als Google Ads en Facebook Ads of verkeer afkomstig uit een affiliate programma van jezelf.

Wil je meer weten over het zelf runnen van een affiliate programma, dan verwijs ik je graag naar mijn ‘Affiliate Expert Workshop‘.

Mailing lijsten

E-Mail marketing mag tegenwoordig wat meer in de vergetelheid zijn geraakt, maar het is nog steeds een niet te verwaarlozen bron van verkeer. Heb je een kleine lijst? Dan is het mogelijk dat een mailing lijst niet echt veel op zal leveren, maar heb je er wel eens aan gedacht, dat je vanuit een affiliate programma anderen met een grotere lijst kan motiveren om jouw landing page onder de aandacht van een groter publiek te krijgen?

In het verleden heeft een klant van mij een gigantisch succes gehad bij het verkopen van zijn cursus. Hoewel hij zelf slechts een paar honderd mensen op zijn lijst had, had hij contacten met een organisatie met een mailinglijst met meer dan 400.000 mensen. Door contact met deze organisatie te leggen (je zal zelf de eerste stap moeten zetten) en een leuke affiliate vergoeding af te spreken voor die organisatie, mocht hij een kort berichtje op hun website zetten en werd tweemaal zijn landingspagina genoemd. Een speciale korting voor de leden van die organisatie had hij gelijk een leuke start voor zijn online leeromgeving.

Push berichten

Het is al weer een tijdje dat ik gebruik maak van browser push berichten. Door op de rode bel linksonder op de pagina te klikken, en de instructies te volgen, kan jij voortaan bij iedere nieuwe blogpost automatisch een berichtje krijgen in je browser.

En hoewel het aantal malen dat iemand zo’n berichtje klikt stukken later is dan het aantal malen, dat mensen op een link in de email klikken, merkte ik, dat zo’n ‘push’ lijst veel harder groeit dan een mailing lijst.

Wanneer jij vandaag de dag nog geen push berichten gebruikt, dan mis je gewoon bereik! (En ter informatie, in de tijd van een video consult kan ik je stap voor stap uitleggen, hoe je dit kan doen, mocht je er zelf niet uitkomen).

Normaal gesproken, wanneer ik een nieuwe training heb, dan maak ik eerst de pagina’s voor de training, verzend dan het pushbericht en uiteindelijk -soms enkele dagen later- verzend ik het bericht via mijn mailinglijst, dat die training online staat.

Begin 2021 had ik voor een DaVinci Resolve cursus de training binnen twee uur na het verzenden van het push bericht al vol. Ik kon een nieuwe datum inplannen om dezelfde cursus voor mijn nieuwsbrief aan te prijzen!

Wil je echter jouw ‘push lijst’ snel laten groeien, is het vooral belangrijk om je bezoekers regelmatig op de mogelijkheid te wijzen. Wat ik zojuist dus weer opnieuw heb gedaan.

Social media

Los van de eventuele advertenties op Social Media kan je natuurlijk ook social media inzetten om aandacht te vestigen op je landing pages. Denk hierbij niet aan het ‘spammen’ van al je Social Media kanalen, maar verzin iets waardoor mensen gemotiveerd worden om jouw pagina’s te promoten.

Een heel goede mogelijkheid is bijvoorbeeld een extra korting te geven, indien de koper via social media deelt, dat hij zojuist het product gekocht heeft.

Onderzoek je landing pages!

Landing pages in Elementor

Het aardige van landing pages in Elementor is dat je deze heel makkelijk aan kan passen. En zelf gebruik ik Elementor dan ook graag in combinatie met de If-So plugin. Met deze plugin kan ik vrij eenvoudig A/B tests opzetten. Een alternatief voor If-So kan Google Optimize zijn en tijdens de cursus ‘Meer weten door te meten‘ leer ik je onder andere hoe je met deze dienst toch wel heel coole A/B testen uit kan voeren.

Maar wanneer je een landing page wilt ‘onderzoeken’, wat moet je dan onderzoeken?

Laat me je eens een paar tips geven.

De Salesforce blog

Hoewel ik hun software niet gebruik, lees ik graag de Salesforce blog, omdat daar onder andere regelmatig goede informatie te vinden is over A/B testen.

En door de jaren heen heb ik daar toch een aantal heel belangrijke inzichten uit weten te halen. Vooral omdat sommige van die inzichten wat minder voor de hand liggen.

Eén van de belangrijkste inzichten is denk ik wel

Neem niets aan. Onderzoek alles!

De inzichten hieronder zijn allemaal afkomstig uit verschillende blogposts van Salesforce.

En laten we dan maar meteen met de deur in huis vallen en één van de meest hardnekkige misverstanden uit de weg ruimen.

Rood is de kleur van gevaar. Maak nooit een ‘Koop nu’ knop rood!

Dit is dus pertinent niet waar. Of eigenlijk: Je moet van geval tot geval onderzoeken of dit wel of niet waar is. Volgens onderzoek bij een Nederlandse telefonie provider (naam is niet genoemd) nam de conversie 5% toe, toen een knop van Groen ineens Oranje-Rood werd gemaakt

Typografie kan verschil maken!

Zorg bij een landing page in voor duidelijke letters, je tekst moet makkelijk te lezen zijn. Maar zelfs met duidelijke lettertypes, test deze! Vooral de ‘broodtekst’, de tekst die het grootste deel van de pagina zal vormen, is van belang. Juiste grootte, dikte en een goed contrast met de achtergrond.

Maak teksten actie-georienteerd!

Een Duits deodorant bedrijf zag de conversie met 93% toenemen, toen ze teksten ‘actiever’ maakten.

Voel je fris zonder zweetplekken werd Breng die zweetplekken tot een einde

(beide teksten zijn door mij vanuit het Engels vertaald, bovenstaande was dus niet de letterlijke bewoording)

Jij en ik!

Erger jij je ook aan die knoppen met teksten als ‘Ja, ik wil zus en zo doen’… zelf vind ik het een beetje betuttelend. Maar het lijkt wel te werken, want kijk eens naar de twee onderstaande knoppen

Lood om oud ijzer? Echt niet! De tweede knop bleek namelijk tot een 90% betere conversie te leiden.

Ten slotte

Landing pages in Elementor

Landing pages zijn een krachtig hulpmiddel om je marketing te focussen op specifieke evenementen of producten. En wanneer je serieus bezig bent met de marketing van je producten zal je dikwijls zo’n pagina willen maken. Wat mooi is aan de landing pages in Elementor, is dat het een ‘aparte rubriek’ is geworden, waarmee je het overzicht in je pagina’s en landingpagina’s blijft behouden. Bovendien is het aantal uit te voeren handelingen voor het maken van specifiek een landingpage een stuk minder geworden.

Over het aanbod van templates voor landing pages in Elementor ben ik wat minder te spreken. Maar dat is op zich natuurlijk niet zo erg, omdat je toch jouw eigen ‘blokken’ voor jouw landing pages in Elementor gaat ontwikkelen.

En natuurlijk hoef je niet ieder van bovengenoemde elementen iedere keer opnieuw te testen in A/B tests. Zolang je je tot dezelfde doelgroep richt, zal de uitkomst toch grotendeels hetzelfde zijn.

Maar besluit bij iedere landingspagina die je gebruikt, dat je in ieder geval één element gaat testen, om te zien wat de beste variant is.

En zo zal langzaam de voor jouw doelgroep beste landingspagina ontstaan.

Het zou natuurlijk aardig zijn, wanneer je iets van jouw testervaringen wilt delen met de lezers van de blog. En dat kan mooi in het commentaar hieronder.

Wees eens aardig en deel dit met je vrienden
Enkele trefwoorden om vergelijkbare posts te vinden:

Word je website de baas. Neem vandaag nog contact op!

Contact Information

WordXPression 
Imkersdreef 525
7328DG Apeldoorn
06-10449807 (van 9:00 tot 17:00 van ma-vr)

KVK : 75580152 

Social media
Stuur een bericht

Flinke kortingen op cursussen van WordXPression.