Een mooi ontworpen website kan een geweldige eerste indruk maken. Het bouwen van een eersteklas site is echter niet altijd makkelijk, vooral als je geen eerdere ontwerp- of ontwikkelingservaring hebt.

Dat is waar de WordPress Elementor websitebuilder om de hoek komt kijken. Door te kiezen voor deze moderne, gebruiksvriendelijke plugin, kun je een verbluffende website maken zonder een enkele regel code te schrijven.

Dit artikel behandelt alles wat je moet weten over deze enorm populaire WordPress paginabuilder. We laten je vervolgens zien hoe je door enkele van de meest essentiële taken van Elementor navigeert, zoals het maken van lay-outs, pagina’s en zelfs aangepaste Elementor templates. Laten we beginnen!

Een introductie tot WordPress Elementor

In de begindagen van internet vereiste het maken van een website geavanceerde vaardigheden op het gebied van webontwikkeling en ontwerp, of het hebben een gespecialiseerd team. Dit betekende dat het bouwen van een website tijdrovend, vaak frustrerend en mogelijk duur was.

Dankzij moderne paginabuilders kun je nu een professioneel ontworpen, goed presterende website maken zonder specialistische vaardigheden. Zodra je site in de lucht is, kun je op elk gewenst moment snel en eenvoudig content toevoegen of de lay-out wijzigen, zelfs als je geen programmeur bent.

Er zijn verschillende WordPress paginabuilders, maar met meer dan vijf miljoen actieve installaties is de Elementor plugin een van de meest populaire. Met Elementor kun je alles maken, van hele websites tot losse landingspagina’s via een intuïtieve drag-and-drop editor.

Elementor paginabuilder
Elementor paginabuilder

Met Elementor kun je alle aspecten van het ontwerp van je site beheren via één enkel platform. Zo kan je website je branding perfect weerspiegelen.

De intuïtieve, codevrije editor van Elementor is vooral populair bij website-eigenaren die geen ervaring hebben met ontwerpen en ontwikkelen. Het is ook zeer geschikt voor ondernemers en kleine bedrijven met een goed idee voor een online onderneming, maar niet per se het geld hebben om een ​​speciaal ontwerp- of ontwikkelingsteam in te huren.

Zelfs als je een ervaren professional bent, zijn er genoeg redenen om Elementor te gebruiken. Alleen omdat je codeervaardigheden hebt, wil nog niet zeggen dat het verstandig is om altijd alles helemaal opnieuw te maken.

Elementor heeft tal van features om je te helpen strakke websites in minder tijd te bouwen. Je vindt er bovendien meer dan 90 kant-en-klare widgets en professioneel ontworpen webtemplates.

Startpagina van de Elementor website
Startpagina van de Elementor website

Op deze manier kan Elementor je productiviteit en je winst verhogen. Deze tijdbesparende features kunnen bijzonder lucratief zijn als je regelmatig WordPress websites bouwt (d.w.z. voor freelance ontwikkelaars en WordPress bureaus).

Elementor Free versus Elementor Pro

Elementor is “freemium” software. Je kunt de kern Elementor plugin gratis downloaden of een Elementor Pro licentie aanschaffen.

Prijsopties voor Elementor pro
Prijsopties voor Elementor pro

De gratis WordPress plugin wordt geleverd met alles wat je nodig hebt om visueel aantrekkelijke verkooppagina’s, productvermeldingen, zakelijke websites en meer te bouwen. Het bevat meer dan 40 widgets, 100 templates en 300+ blokken. Blokken zijn vooraf ontworpen sectietemplates die je kunt mixen en matchen om unieke ontwerpen te maken.

Elementor blokkenbibliotheek
Elementor blokkenbibliotheek

Als je meer geavanceerde functionaliteit wilt, kun je Elementor Pro aanschaffen. Dit ontgrendelt een aantal extra widgets, samen met Elementor’s Theme Builder.

Elementor Theme Builder
Elementor Theme Builder

Met de Theme Builder kun je bijna elk site-element bewerken, inclusief de header en footer. Je kunt ook aangepaste ontwerpen voor post- en archiefpagina’s maken.

Als je een online winkel ontwikkelt, bevat Elementor Pro ook een WooCommerce Builder. Je kunt dit gebruiken om de WooCommerce content van je site aan te passen, inclusief de productpagina, het productarchief en de afrekenpagina. Je krijgt ook toegang tot widgets die expliciet zijn ontworpen om conversies te stimuleren, zoals Custom Add To Cart, Upsells en Product Related.

Elementor WooCommerce Builder
Elementor WooCommerce Builder

Elementor Pro wordt ook geleverd met een Popup Builder en een Form Builder. Hoewel er afzonderlijke plugins zijn waarmee je formulieren en popups kunt maken, kun je door te kiezen voor Elementor, het aantal plugins dat je moet installeren en onderhouden, minimaliseren.

Het gebruik van te veel plugins kan je site kwetsbaarder maken voor hackers. Het kan zelfs van invloed zijn op de prestaties van je website. Het is dus een best practice om het aantal dat je hebt geïnstalleerd te minimaliseren. Aangezien je alle elementen van je site met hetzelfde platform ontwerpt, zou het bovendien makkelijker moeten zijn om een ​​consistent uiterlijk te krijgen.

De Elementor Pro licenties omvatten toegang tot meer dan 60 pro-websitekits. Dit zijn bundels van templates, pagina’s, popups en andere componenten die je kunnen helpen bij het maken van een complete website. Als je een Expert licentie of hoger aanschaft, krijg je ook toegang tot 20 expert websitekits.

Bovendien bevat elke Pro licentie premium ondersteuning. Doorgaans ontvang je binnen één dag antwoord van het gespecialiseerde ondersteuningsteam van Elementor. Als je echter kiest voor Elementor Pro Studio of hoger, word je geüpgraded naar VIP ondersteuning. Hiermee kun je deelnemen aan livechats met het VIP ondersteuningsteam van Elementor. Je krijgt daarnaast prioriteitsreacties op je tickets, die meestal binnen 30 minuten aankomen.

Als je een bureau, ontwikkelaar of ontwerper bent, ben je wellicht geïnteresseerd in een Experts Network profiel. Daar kun je je werk laten zien en de aandacht trekken van potentiële klanten.

Elementor Experts Netwerk
Elementor Experts Netwerk

En als je geïnteresseerd bent in adverteren via het Experts Network, heb je wellicht ook interesse in de Expert, Studio of Agency licenties van Elementor Pro. Deze licenties geven je het recht om een ​​profiel aan te maken op deze populaire marktplaats.

Elementor Pro abonnementen variëren van $49 tot $999 per jaar. Het bedrijf biedt ook een geld-terug-garantie van 30 dagen, zodat je het kunt proberen voordat je het koopt.

Zo installeer je Elementor

Omdat het een WordPress plugin is, is het installeren van Elementor snel en eenvoudig. Je kunt de gratis plugin rechtstreeks downloaden vanaf je WordPress dashboard.

Om de gratis versie te downloaden, ga je naar Plugins > Add New. Typ Elementor in het zoekveld. Wanneer de plugin verschijnt, klik je op Install Now.

Klik wanneer gevraagd op Activate. De plugin voegt een Elementor optie toe aan je WordPress zijbalk.

Elementor in het WordPress dashboard
Elementor in het WordPress dashboard

Je bent nu klaar om Elementor te gebruiken! Om aan de slag te gaan, klik je eenvoudig op de Elementor optie in de zijbalk.

Als alternatief kun je de Elementor plugin rechtstreeks downloaden vanuit de WordPress repository. Log vervolgens in op je WordPress dashboard en navigeer naar Plugins > Add New > Upload Plugin. Je kunt vervolgens op Choose File klikken en het Elementor .zip bestand selecteren dat je zojuist hebt gedownload.

Zo verbind je Elementor Pro met WordPress

Er zijn twee manieren om Elementor Pro met WordPress te verbinden. Als je nog geen Elementor Pro licentie hebt gekocht, moet je naar de officiële website gaan en Get Started selecteren.

Je kunt dan de instructies op het scherm volgen om een ​​Elementor account aan te maken. Voer wanneer gevraagd wat informatie in over het soort website dat je wilt maken.

 Maak een Elementor account aan
Maak een Elementor account aan

Kies vervolgens het abonnement dat je wilt kopen. Omdat Elementor een actieve WordPress website vereist, moet je het domein van je site invoeren. Elementor voert vervolgens een controle uit om te verifiëren dat je site het WordPress platform gebruikt.

Ervan uitgaande dat je een actieve WordPress website hebt, is de volgende stap het klikken op Install Elementor. Je wordt automatisch doorgestuurd naar de Elementor pluginpagina als je momenteel bent ingelogd op je site.

Wanneer gevraagd, klik op Install Now > Activate. Elementor zal dan de paginabuilderplugin aan je site toevoegen.

Als je al een Elementor Pro licentie hebt gekocht, kun je ook naar de officiële website gaan en inloggen met de gegevens die je in je bevestigingsmail hebt ontvangen.

Selecteer in je Elementor account  Subscriptions in het menu aan de linkerkant. Je kunt dan klikken op Download Zip.

Download Zip
Download Zip

Log vervolgens in op je WordPress dashboard en navigeer naar Plugins > Add New. Je kunt dan het Elementor Pro .zip bestand uploaden dat je zojuist hebt gedownload.

Na het installeren en activeren van Elementor Pro, zou WordPress je moeten vragen om je licentiesleutel in te voeren. Als alternatief kun je navigeren naar Elementor > License > Connect & Activate.

WordPress zou je licentie automatisch moeten verifiëren als je momenteel bent ingelogd op je Elementor account. Als dat niet het geval is, voer je je Elementor gebruikersnaam en wachtwoord in wanneer het wordt gevraagd om je licentie te activeren.

Elementor gebruiken: 4 essentiële taken om te beheersen

Met Elementor kun je unieke websites ontwerpen zonder speciale ontwerp- of ontwikkelingsvaardigheden. Het helpt echter om jezelf vertrouwd te maken met de basisprincipes voordat je een volledige website bouwt. Hier is een korte introductie tot de Elementor workflow met dat in gedachten.

1. Start de Elementor Page Builder

Om een ​​nieuwe pagina of bericht in de Elementor paginabuilder te ontwerpen, navigeer je naar Pages/Posts > Add New. Je kunt de Elementor editor starten door op Edit with Elementor te klikken.

Edit with Elementor optie in de editor
Edit with Elementor optie in de editor

Als alternatief kun je een bestaande pagina hebben die baat kan hebben bij een make-over. Navigeer eenvoudig naar de betreffende pagina en open deze voor bewerking in dit scenario. Je kunt vervolgens op de Edit with Elementor knop klikken.

Elementor editor geopend
Elementor editor geopend

Aan de linkerkant van het scherm zie je de Elementor zijbalk. Hier vind je alle elementen die je aan je ontwerpen kunt toevoegen, zoals knoppen en koppen.

De Elementor zijbalk bevat ook een sectie Global Widgets. Als je van plan bent dezelfde widget voor meerdere ontwerpen opnieuw te gebruiken, kun je deze opslaan als een algemene widget. Hierdoor is je custom element op elk moment makkelijk toegankelijk. Het biedt ook een centrale locatie waar je je  widget één keer kunt bewerken om universele wijzigingen aan te brengen. Elementor repliceert deze wijzigingen vervolgens op je hele website.

Aan de rechterkant is het live preview canvas, waar je je ontwerp kunt maken. Elementor wordt automatisch bijgewerkt om je wijzigingen in realtime weer te geven terwijl je je bewerkingen maakt.

2. Secties, kolommen en widgets toevoegen

De Elementor editor biedt toegang tot drie hoofdbouwstenen: secties, kolommen en widgets. We hebben de kant-en-klare widgets van Elementor al besproken, dus laten we eens kijken hoe je ze aan je ontwerpen kunt toevoegen.

Meestal begin je met het maken van een sectie door op het + pictogram in het hoofdvenster te klikken. Elementor zal je dan vragen om Select Your Structure.

Voeg een sectie toe in Elementor
Voeg een sectie toe in Elementor

Structuuropties bestaan ​​uit een of meer kolommen. Uiteindelijk plaats je je widget in deze kolommen. Ze spelen een belangrijke rol bij het creëren van meer georganiseerde lay-outs.

Selecteer je kolomstructuur
Selecteer je kolomstructuur

Nadat je je beslissing hebt genomen, zal Elementor deze sectie aan je lay-out toevoegen. Om deze sectie naar een nieuwe locatie te verplaatsen, klik je erop en pak je de gestippelde blauwe hendel die verschijnt.

Om een ​​sectie te bewerken, klik je gewoon met de Control-klik ingedrukt op deze gestippelde blauwe hendel. Hierdoor wordt een contextmenu geopend waarin je eenvoudige wijzigingen kunt aanbrengen, zoals het kopiëren of verwijderen van de geselecteerde sectie.

Voeg op elk gewenst moment meer secties toe
Voeg op elk gewenst moment meer secties toe

Stel dat je complexere bewerkingen wilt maken, Control-klik op de blauwe hendel en selecteer Edit Section. De zijbalk van Elementor wordt nu bijgewerkt om alle aanvullende wijzigingen weer te geven die je in deze sectie kunt aanbrengen.

Er zijn aanvullende, complexere bewerkingen beschikbaar
Er zijn aanvullende, complexere bewerkingen beschikbaar

Je kunt ook widgets aan deze sectie toevoegen. Zoek in de zijbalk van Elementor de widget die je wilt gebruiken en sleep deze naar het hoofdvenster.

Terwijl je de widget sleept, markeert Elementor alle verschillende secties en kolommen waar je dit item kunt neerzetten. Als je klaar bent, laat je gewoon je muis los. Elementor zal deze widget nu toevoegen aan de door jou gekozen sectie.

3. Bewerk je site-instellingen

Je kunt Elementor gebruiken om je site-brede instellingen te bewerken. Dit omvat het wijzigen van het standaardlettertype en de HTML kleuren. Je kunt ook de randen en schaduwen wijzigen die WordPress toevoegt aan elementen, zoals de afbeeldingen van je site.

Door deze instellingen op siteniveau aan te passen, kun je zorgen voor een consistent uiterlijk op je hele WordPress website. Dit proces is ook aanzienlijk sneller en makkelijker dan deze wijzigingen pagina voor pagina toe te passen. Om de beschikbare site-instellingen te bekijken, klik je op het hamburgermenu in de Elementor zijbalk.

Instellingen voor de hele site configureren
Instellingen voor de hele site configureren

Je kunt nu je opties verkennen en de nodige wijzigingen aanbrengen. Wanneer je klaar bent om je nieuwe site-instellingen te publiceren, klik je op de knop Update helemaal onderaan de Elementor zijbalk.

4. Controleer je revisiegeschiedenis

Terwijl je je ontwerpen aan het bewerken bent, neemt Elementor stilletjes je wijzigingen op. Je kunt je bewerkingen makkelijk terugtrekken, wat je leven kan redden als je je realiseert dat je een fout hebt gemaakt.

Het geschiedenislogboek van Elementor geeft je ook de vrijheid om te experimenteren. Je kunt verschillende wijzigingen uitproberen en deze vervolgens snel verwijderen. Door je aan te moedigen om te experimenteren, kan Elementor de kwaliteit van je voltooide ontwerpen verbeteren.

Om het logboek van Elementor te bekijken, klik je op het  History pictogram onder aan de zijbalk. Het Actions tabblad registreert elke wijziging die je in Elementor aanbrengt. Dit kan van alles zijn, van het maken van een nieuwe sectie tot het bewerken van bestaande tekst:

Het Elementor logboek bekijken
Het Elementor logboek bekijken

Elke keer dat je op Save drukt, neemt Elementor de huidige versie van je pagina op als een nieuwe revisie. Je kunt al deze snapshots bekijken op het Revisions tabblad. Als je naar een eerdere opslag wilt terugkeren, zoek je deze eenvoudig op in de Revisions lijst en klik je erop.

Zo bouw je een pagina in Elementor (2 methoden)

Nu je bekend bent met de essentiële Elementor workflow, gaan we kijken hoe je deze knowhow kunt gebruiken om nieuwe pagina’s te ontwerpen. Eerst bespreken we het maken van een standaard WordPress pagina met behulp van de gratis Elementor plugin. Vervolgens bekijken we hoe je een hoog converterende productpagina kunt ontwikkelen met WooCommerce en Elementor Pro.

1. Zo maak je een standaard WordPress pagina aan

Elke webpagina is anders. Er zijn echter enkele gemeenschappelijke elementen die je op verschillende sites zult aantreffen. Denk hierbij aan headers, hoofdtekst en media zoals afbeeldingen. Laten we eens kijken hoe je een pagina kunt maken met deze essentiële componenten.

Maak om te beginnen een nieuwe pagina door te navigeren naar  Pages > Add New > Edit with Elementor. Voeg vervolgens een sectie toe aan je ontwerp door op het + pictogram te klikken. We beginnen met onze kop, dus we willen kiezen voor een lay-out met één kolom.

Maak een nieuwe Elementor pagina
Maak een nieuwe Elementor pagina

Zoek in de Elementor zijbalk de Heading widget. Sleep deze widget nu naar je nieuwe sectie. Je kunt vervolgens je headertekst in de Elementor zijbalk typen en verschillende instellingen gebruiken om je titel op te maken.

 Stijl je headertitel
Stijl je headertitel

Klik vervolgens op het + pictogram om een ​​tweede sectie toe te voegen. We gaan een afbeelding insluiten en vervolgens wat ondersteunende tekst geven, dus nu kiezen we voor een lay-out met meerdere kolommen.

Voeg een sectie toe en selecteer kolommen
Voeg een sectie toe en selecteer kolommen

Sleep vervolgens de widget Tekst Editor uit de zijbalk van Elementor en zet deze neer in deze nieuwe sectie. Je kunt vervolgens je tekst toevoegen en opmaken met behulp van de zijbalkinstellingen.

Als je tevreden bent met je tekst, zoek je de afbeeldingswidget. Gebruik nogmaals drag and drop om deze widget aan je sectie toe te voegen.

Drag and drop een tekstwidget
Drag and drop een tekstwidget

Klik in de zijbalk op de preview thumbnail. Je kunt nu de WordPress Media Library gebruiken om een ​​nieuwe afbeelding te uploaden of een eerder geüploade afbeelding te kiezen.

Om je ontwerp in actie te zien, klik je op het oogpictogram onder aan de Elementor zijbalk. Hiermee wordt een preview van je paginalay-out weergegeven op een nieuw tabblad.

Preview van je Elementor pagina
Preview van je Elementor pagina

Als je tevreden bent met je ontwerp, klik je op de Publish knop . Merk op dat als je pagina al live is, deze knop je  in plaats daarvan zal vragen om bij te werken.

2. Zo maak je een WooCommerce productpagina aan

Als je een WooCommerce winkel hebt, kun je Elementor Pro gebruiken om een ​​aangepaste productpagina te maken. Dit kan inhouden dat de voorraad WooCommerce pagina moet worden aangepast om de branding van je site beter weer te geven. Je kunt ook proberen je pagina te optimaliseren om meer conversies te genereren.

Om een ​​aangepaste WooCommerce productpagina te ontwerpen, selecteer je Templates in het WordPress dashboard. Klik vervolgens op de Add New knop. Open in het volgende venster het eerste dropdownmenu en selecteer Single Product.

WooCommerce ingesteld voor een enkel product
WooCommerce ingesteld voor een enkel product

Geef je nieuwe template een beschrijvende naam en klik op Create Template. Hiermee wordt de Elementor bibliotheek gestart met alle beschikbare ontwerpen voor één product.

Beschikbare enkelvoudige productontwerpen in WooCommerce
Beschikbare enkelvoudige productontwerpen in WooCommerce

Om een ​​template van dichterbij te bekijken, plaats je de muisaanwijzer erop en klik je op het vergrootglaspictogram wanneer het verschijnt. Als je dit ontwerp wilt toepassen op je winkel, klik je op Insert.

Beweeg de muisaanwijzer over de template om het van dichterbij te
Beweeg de muisaanwijzer over de template om het van dichterbij te bekijken

De templates van Elementor bevatten een reeks kant-en-klare componenten. Om een ​​van deze elementen te bewerken, klik je erop. De Elementor zijbalk wordt bijgewerkt om alle instellingen voor dat specifieke item weer te geven.

Kant-en-klare componenten
Kant-en-klare componenten

Elementor Pro biedt een reeks WooCommerce widgets die je aan je ontwerpen kunt toevoegen. Scroll naar de WooCommerce of Product secties in de Elementor zijbalk om te zien wat er beschikbaar is.

Beschikbare WooCommerce widgets in de zijbalk
Beschikbare WooCommerce widgets in de zijbalk

Deze secties bevatten widgets met geavanceerde ingebouwde functionaliteit, zoals WooCommerce Breadcrumbs, Cart en Checkout. Om deze elementen aan je ontwerp toe te voegen, sleep je ze eenvoudig naar het Elementor canvas en laat je ze los. Je kunt de widget vervolgens neerzetten in de sectie waar je deze content wilt weergeven.

Versleep WooCommerce widgets
Versleep WooCommerce widgets

Als je tevreden bent met je ontwerp, klik je op Publish. Je kunt vervolgens Add Condition selecteren en de gebieden specificeren waar je dit ontwerp wilt gebruiken. Je kunt deze template bijvoorbeeld toepassen op een specifieke productcategorie of deze in je hele winkel gebruiken.

Zo vind en installeer je vooraf gemaakte Elementor templates

Elementor templates zijn vooraf ontworpen pagina’s en blokken die het maken van websites vereenvoudigen. Pagina’s zijn lay-outs met volledige content, terwijl blokken secties zijn die vooraf gemaakte widgets bevatten. Enkele populaire voorbeelden van blokken zijn headers en footers, recensies en getuigenissen, en veelgestelde vragen (FAQ’s).

Elementor bibliotheek
Elementor bibliotheek

De gratis Elementor plugin wordt geleverd met meer dan 100 paginagrote templates en meer dan 300 blokken. Als je een upgrade naar Elementor Pro uitvoert, krijg je toegang tot enkele extra opties.

Klik op het Add Template pictogram om een ​​template toe te passen op je huidige ontwerp. Deze knop zou moeten verschijnen als onderdeel van elk sectieblok en wordt weergegeven door een witte map. Hiermee wordt de Elementor bibliotheek gestart.

Een template toevoegen uit de Elementor bibliotheek
Een template toevoegen uit de Elementor bibliotheek

Hier vind je  alle blok- en paginatemplates die je op je pagina kunt toepassen. Je kunt een preview van een template bekijken door erover te bewegen en op het vergrootglaspictogram te klikken.

Beweeg over de template om deze van dichtbij te bekijken
Beweeg over de template om deze van dichtbij te bekijken

Wanneer je een template vindt dat je wilt gebruiken, klik je op Insert. Als je nog niet eerder verbinding hebt gemaakt met de templatebibliotheek van Elementor, zal de pop-up je vragen om die stap te voltooien.

Maak verbinding met de templatebibliotheek
Maak verbinding met de templatebibliotheek

Nadat je deze verbinding tot stand hebt gebracht, zal Elementor je gekozen template invoegen. Je kunt het nu aanpassen. Je kunt bijvoorbeeld meer widgets toevoegen of tijdelijke content verwijderen.

Zo bouw je templates met Elementor

Elementor wordt geleverd met een brede selectie kant-en-klare templates. Soms heb je echter een bepaalde look in gedachten. In dat scenario geef je er misschien de voorkeur aan je templates zelf te ontwerpen.

Door je ontwerpen te maken, kun je zorgen voor consistentie op je hele site. Je kunt zelfs templates gebruiken om het ontwerp en de ontwikkeling te versnellen als je een WordPress bureau bent. Je kunt bijvoorbeeld een bibliotheek met templates bouwen die alle content en instellingen bevat die je gewoonlijk op de sites van je klanten toepast. Je kunt deze templates vervolgens gebruiken als uitgangspunt voor alle toekomstige projecten.

Selecteer Templates in het WordPress dashboard om aan de slag te gaan. Klik vervolgens op de Add New.

Voeg een nieuw template toe.
Voeg een nieuw template toe.

Open in de volgende pop-up het eerste drowndownmenu en kies het soort template dat je wilt maken. Je opties zijn PageSection, of Landing Page.

Kies het type template
Kies het type template

Geef dit ontwerp vervolgens een beschrijvende naam en klik op Create Template. Hiermee wordt de standaard Elementor paginabuilder gestart. Je kunt nu je template op dezelfde manier bouwen als een gewone pagina. Voeg eenvoudig secties, kolommen en widgets toe totdat je tevreden bent met je lay-out.

Om dit ontwerp als template op te slaan, klik je op de pijl die naast de knop  Update/Publish verschijnt. Je kunt vervolgens Save as Template selecteren.

Save as template
Save as template

Dit ontwerp wordt nu opgeslagen in de Elementor bibliotheek. Je kunt het openen door de bibliotheek te starten en het My Templates tabblad te selecteren.

Zoek je template in de bibliotheek in het tabblad “My Templates”
Zoek je template in de bibliotheek in het tabblad “My Templates”

Je kunt ook toegang krijgen tot je aangepaste sjablonen door naar Templates > Saved Templates in het WordPress dashboard te gaan. Je kunt ook al je ontwerpen openen en de nodige wijzigingen aanbrengen.

Tips en trucs om aan de slag te gaan met Elementor

Elementor kan je helpen om snel een WordPress website te ontwerpen en te bouwen. Sommige tijdbesparende trucs kunnen je  productiviteit echter nog verder verhogen.

Soms kun je een sectie maken die je binnen dezelfde pagina opnieuw wilt gebruiken. In plaats van deze sectie handmatig opnieuw te maken, kun je een kopie maken. Klik gewoon om de betreffende sectie te selecteren en houd Control ingedrukt terwijl je  op de gestippelde greep klikt die verschijnt.

Selecteer vervolgens Duplicate. Dit creëert een duplicaatsectie direct onder het origineel.

Als alternatief wil je soms dezelfde sectie opnieuw gebruiken op meerdere pagina’s of zelfs op verschillende websites. Je kunt elke sectie opslaan als een bloktemplate. Hiermee wordt je ontwerp toegevoegd aan de Elementor bibliotheek, zodat het altijd binnen handbereik is.

Om van een blok een herbruikbare template te maken, klik je met de Control toets ingedrukt op het gestippelde pictogram. Selecteer vervolgens Save as Template.

Een blok veranderen in een herbruikbare template
Een blok veranderen in een herbruikbare template

Je kunt elke widget bewerken door deze op je canvas te selecteren en vervolgens de bedieningselementen in de Elementor zijbalk te gebruiken. Navigeren tussen verschillende widgets kan echter lastig worden als je veel andere widgets hebt. Dit geldt met name voor overlappende widgets of wanneer je veel elementen binnen een kleine ruimte hebt toegevoegd.

Elementor’s Navigator biedt een lijstweergave van alle widgets van je pagina, georganiseerd in de bijbehorende secties en kolommen. Je kunt makkelijk tussen je widgets navigeren door ze te selecteren in dit “boomvenster”. De zijbalk van Elementor wordt vervolgens bijgewerkt om alle opties voor de momenteel geselecteerde widget weer te geven.

Weergaveopties voor de geselecteerde widget
Weergaveopties voor de geselecteerde widget

Sneltoetsen zijn de ultieme tijdbesparing en Elementor wordt geleverd met verschillende ingebouwde sneltoetsen. Druk Cmd/Ctrl + ? op jetoetsenbord om deze snelkoppelingen te bekijken.

Elementor sneltoetsen
Elementor sneltoetsen

Dit opent een venster met alle beschikbare sneltoetsen. Je kunt je webdesign en -ontwikkeling een boost geven door jezelf vertrouwd te maken met enkele of al deze sneltoetsen.

Samenvatting

Het maken van een WordPress site is niet altijd eenvoudig, vooral als je geen ervaren webdesigner of -ontwikkelaar bent. Gelukkig kan de Elementor paginabuilder de pijn en complexiteit wegnemen bij het bouwen van je site.

Ongeacht of je kiest voor de gratis of premium plugin, je kunt Elementor gebruiken om elk type bericht of pagina te ontwerpen en te bouwen dat je nodig hebt. Deze builder wordt ook geleverd met een selectie van kant-en-klare templates. Als alternatief kun je je templates maken en ze opnieuw gebruiken op meerdere pagina’s of op verschillende websites.

Heb je vragen over het gebruik van de WordPress Elementor plugin? Laat het ons weten in de comments hieronder!

Jeremy Holcombe Kinsta

Content & Marketing Editor at Kinsta, WordPress Web Developer, and Content Writer. Outside of all things WordPress, I enjoy the beach, golf, and movies. I also have tall people problems ;).