Zo exporteer en importeer je Elementor websites (je complete handleiding)

De Elementor tool maakt het makkelijk om prachtige pagina’s, berichten en hele websites te ontwerpen. Maar zelfs met een krachtige paginabuilder zoals Elementor in je arsenaal, kost het maken van een nieuw siteontwerp tijd en moeite.

Dat is waar het import- en exportsysteem van Elementor van pas kan komen. Met deze feature kun je je ontwerp- en ontwikkelingstijd verkorten door herbruikbare templates te maken of externe layouts voor je project te importeren.

Dit bericht gaat dieper in op het flexibele en krachtige import-/exportsysteem van Elementor. We behandelen alles, van sectietemplates tot paginatemplates – en zelfs je hele Elementor website exporteren. Laten we beginnen!

Zo bereid je je site voor op een nieuwe Elementor template (in 2 stappen)

Elementor templates zijn vooraf ontworpen layouts. Deze kunnen onderdeel zijn van afzonderlijke pagina’s of specifieke gebruikersinterface elementen (UI). Hoewel ze op WordPress thema’s lijken, zijn er enkele essentiële verschillen.

WordPress thema’s veranderen het ontwerp van een hele website. Daarentegen beïnvloeden Elementor templates de layout van een enkele webpagina. Omdat ze beperkt zijn tot slechts één pagina, is het mogelijk om meerdere Elementor templates tegelijk te gebruiken. Bovendien werken deze templates met een WordPress thema, of deze nou gratis of premium is.

Het toepassen van een nieuwe Elementor template op je website kan veranderen hoe deze eruitziet of functioneert. Met dit in gedachten zijn er enkele acties die je moet uitvoeren voordat je je template wijzigt.

Stap 1: Maak een backup

Het is verstandig om een ​​backup te maken voordat je je Elementor template wijzigt. Deze stap zorgt ervoor dat je content hebt die je kunt herstellen als je problemen ondervindt met je nieuwe ontwerp.

Met verschillende plugins kun je een websitebackup maken. Denk hierbij aan de UpdraftPlus plugin, die al je bestanden en database-informatie naar de cloud kan kopiëren:

Als je klant bij Kinsta bent, maken we elke dag automatisch een backup van je website. Als je vaker backups nodig hebt, kunnen we je site elke zes uur kopiëren ($50 per site, per maand) of elk uur ($100 per site, per maand).

Als alternatief kun je op elk moment handmatig een backup maken. Log hiervoor in op je MyKinsta dashboard:

Selecteer in het linkermenu Sites en klik op de betreffende website. Kies vervolgens Backups > Manual:

Geef gewoon een klik op de Nu een backup maken knop en wij doen de rest. Als je problemen ondervindt en je meest recente backup wilt herstellen, navigeer je naar het Backups > Handmatig tabblad. Hier toont MyKinsta een lijst van al je backups:

Om een ​​eerdere versie van je site te herstellen, klik je op de bijbehorende Herstellen naar knop. Je kunt er nu voor kiezen om deze backup terug te zetten naar je live site of een testwebsite.

Stap 2: Zet je site in de onderhoudsmodus

Het wijzigen van de template van je site kan onverwachte crashes, bugs of ander vreemd gedrag veroorzaken. Nadat je een nieuw ontwerp hebt toegepast, moet je mogelijk wat tijd besteden aan het testen van je site en het maken van aanpassingen.

Als een bezoeker toegang probeert te krijgen tot je site terwijl je deze wijzigingen aanbrengt, kan dit van invloed zijn op de kwaliteit van hun ervaring. Dit kan ertoe leiden dat je potentiële conversies misloopt.

Voordat je een nieuwe Elementor template toepast, wil je misschien je site in de onderhoudsmodus zetten. Deze stap voorkomt dat bezoekers je site bezoeken terwijl je je nieuwe ontwerp test.

Verschillende plugins kunnen gebruikt worden om een aangepaste onderhoudsmodus maken. De WP Maintenance Mode is een populaire keuze:

Deze plugin heeft veel extra’s, waaronder het toevoegen van een countdown aan je onderhoudspagina. Deze functie kan je helpen wat buzz te genereren rond het herontwerp en de herlancering van je site.

Zodra je site zich in de onderhoudsmodus bevindt, kun je met verschillende templates experimenteren en testen hoe ze op de frontend van je website verschijnen. Als je tevreden bent met de resultaten, kun je je site uit de onderhoudsmodus halen en bezoekers versteld doen laten staan ​​met het herontwerp van je site.

Zo sla je Elementor templates op (2 methoden)

Als een van ’s werelds meest populaire paginabuilders heeft Elementor geen tekort aan kant-en-klare externe templates. Soms wil je echter je templates zelf maken.

Door templates te gebruiken, kun je ontwerpconsistentie voor je hele website bereiken. Het kan je ook tijd besparen, vooral als je dezelfde ontwerpen op meerdere sites gebruikt.

Ontwerp- en ontwikkelingsbureaus voor WordPress kunnen bijvoorbeeld profiteren van het maken van templates met de kernelementen die ze regelmatig op hun klantensites toepassen.

Methode 1: Een pagina opslaan als een Elementor template

Je kunt elke pagina opslaan als een Elementor template. Dit kan je helpen een standaard uiterlijk en gevoel te creëren, klaar om op je website te implementeren.

Je kunt bijvoorbeeld de menu’s van je site maken, plus de header en WordPress footer. Je kunt deze paginatemplate vervolgens toepassen op al je webpagina’s.

Het maken van een template betekent ook dat je niet voor elke webpagina handmatig dezelfde elementen opnieuw hoeft te maken. Dit is uitstekend nieuws voor je productiviteit.

Om de huidige pagina op te slaan als een Elementor template, zoek je de groene Update/Publish knop onder aan de Elementor zijbalk. Klik vervolgens op het bijbehorende pijlpictogram van deze knop:

Je kunt nu op Save as Template klikken. Dit opent een venster waarin je deze template een beschrijvende naam kunt geven:

Klik vervolgens op Save. Je hebt nu op elk moment toegang tot dit ontwerp door de Elementor bibliotheek te starten en het My Templates tabblad te selecteren.

Methode 2: Een sectie opslaan als een Elementor template

Veel websites bevatten terugkerende elementen. Denk hierbij aan formulieren voor het genereren van leads of tekst die je best verkopende producten beschrijft.

Door een sectietemplate te maken, kun je deze met slechts een paar klikken aan elke pagina toevoegen. Je kunt zelfs sectietemplates maken voor verschillende contentcategorieën.

Je kunt bijvoorbeeld een call-to-action (CTA) template maken. Elke keer dat je een CTA nodig hebt, kun je deze template eenvoudig importeren en de berichtgeving aanpassen.

Om een ​​template aan te maken, houd je de Control toets ingedrukt en klik je op de betreffende Sectie. Selecteer vervolgens Save As Template:

Geef deze template in het venster dat verschijnt een beschrijvende naam. Klik vervolgens op Save.

Om deze template op een sectie toe te passen, start je de Elementor templatebibliotheek. Je vindt het ontwerp op je My Templates tabblad.

Een Elementor template maken

Hoewel je elke lopende pagina of sectie als Elementor template kunt opslaan, wil je er soms expliciet een maken voor hergebruik. In dit scenario kun je je ontwerp starten als een gewone Elementor webpagina en deze vervolgens opslaan als template.

Je kunt Elementor echter ook van tevoren laten weten dat je een template aan het maken bent. Deze aanpak geeft je meer flexibiliteit om templates te bouwen voor verschillende delen van je website.

Je kunt bijvoorbeeld een template ontwerpen voor je Error 404 pagina, pagina met zoekresultaten of zelfs een pop-up layout maken. Met deze methode kun je ook een template in je bibliotheek gebruiken als basis voor een nieuw ontwerp.

Om een ​​pagina- of sectietemplate te maken, ga je naar Templates > Saved Templates. Klik vervolgens op de Add New. Open in het volgende venster de Select the type of template… dropdown:

Je kunt nu het soort template opgeven dat je wilt maken. We hebben pagina- en sectietemplates al behandeld, maar dit venster bied je extra opties.

Geef je ontwerp na het selecteren een beschrijvende naam en klik vervolgens op Create Template. Hiermee wordt de Elementor bibliotheek gestart, waar je een reeds bestaande template als basis kunt gebruiken. Als alternatief kun je dit venster verlaten en met een schone lei beginnen.

Je kunt nu je template bouwen met behulp van de standaard Elementor editor. Wanneer je klaar bent om je ontwerp op te slaan, klik je op Publish. Hierdoor wordt het Publish Settings vak geopend:

Hier kun je enkele regels instellen voor het gebruik van deze template. Je kunt bijvoorbeeld op Add Condition klikken en aangeven dat deze layout alleen geschikt is voor enkele pagina’s.

Zo exporteer je Elementor templates

Je kunt Elementor templates exporteren vanuit het WordPress dashboard. Met deze methode kun je ontwerpen delen met je collega’s of ze ter goedkeuring naar klanten sturen. Je kunt zelfs de exportfeature gebruiken om backups van je Elementor ontwerpen te maken.

Het exporteren van templates is een makkelijke manier om je ontwerpen op meerdere domeinen te gebruiken. Deze aanpak is handig voor WordPress ontwerp- en ontwikkelingsbureaus die tal van websites beheren. Als je geld wilt verdienen met je ontwerpen, is het exporteren ervan vaak de eerste stap om ze met de wereld te delen.

Navigeer naar Templates > Saved Templates in het WordPress dashboard om een ​​ontwerp te exporteren. Op dit tabblad worden alle templates weergegeven die in je bibliotheek zijn opgeslagen:

WordPress verdeelt deze sjablonen ook in de Page en Section tabbladen. Zoek eenvoudig de template die je wilt exporteren en plaats de muisaanwijzer erop:

Wanneer de Export Template link verschijnt, klik je erop. Elementor downloadt deze template nu als JSON bestand.

Je kunt je templates ook exporteren vanuit de Elementor bibliotheek. Open in deze bibliotheek het My Template tabblad. Zoek de template die je wilt exporteren en klik op het bijbehorende pictogram met drie stippen:

Klik dan op Export. Elementor downloadt deze template nu als JSON bestand.

Zo importeer je Elementor templates

Soms wil je misschien een template in Elementor importeren. Het kan een ontwerp zijn dat is geëxporteerd vanaf een andere website of is gekocht bij een externe partij.

Als je een template in JSON of ZIP format hebt, kun je deze uploaden naar de Elementor bibliotheek. Ga om te beginnen naar Templates > Saved Templates. Klik bovenaan dit scherm op Import Templates:

Selecteer vervolgens je Elementor importtemplate en klik op Import Now. Deze template verschijnt nu in je bibliotheek.

Om dit ontwerp toe te passen op je websitelayout, open je eenvoudig de betreffende pagina of post met de Elementor editor. Klik vervolgens op het Add Template pictogram, dat wordt weergegeven door een witte map:

Selecteer in het volgende venster het My Templates tabblad. Hier vind je al je door Elementor geïmporteerde templates:

Om te zien hoe dit ontwerp eruit zal zien wanneer het is toegepast op de huidige pagina, klik je op Preview. Als je deze template graag wilt gebruiken, selecteer je de bijbehorende Insert link.

Zo exporteer en importeer je een individuele Elementor pagina

Misschien wil je dezelfde pagina opnieuw gebruiken op meerdere sites. Als je bijvoorbeeld meerdere WordPress websites beheert, kun je een standaard Over ons pagina gebruiken.

In plaats van deze pagina handmatig opnieuw te maken, kun je deze opslaan als een Elementor template en deze exporteren. Je kunt het ontwerp vervolgens importeren in elke website waarop Elementor is geïnstalleerd.

Om een ​​individuele pagina als template op te slaan, klik je op het pijlpictogram naast Publish/Update knop. Je kunt vervolgens Save as Template selecteren:

Geef in de volgende popup deze templatenaam op. Klik vervolgens op Save.

De WordPress templatebibliotheek zou automatisch moeten openen. Je kunt de template vinden die je zojuist hebt gemaakt en op het pictogram met de drie stippen klikken. Selecteer Export wanneer daarom wordt gevraagd:

Je kunt deze template van één pagina ook exporteren door naar Templates > Saved Templates in je WordPress dashboard te gaan. Beweeg vervolgens over de betreffende template en klik op Export.

Zodra de template van één pagina veilig is opgeslagen op je lokale computer, kun je deze naar een andere website importeren. Schakel eenvoudig over naar je nieuwe site en navigeer naar Templates > Saved Templates.

Klik bovenaan dit scherm op Import Templates. Je kunt nu je ontwerp met één pagina importeren.

Zo exporteer en importeer je je hele Elementor website (in 3 stappen)

Hoewel Elementor het makkelijk maakt om templates van één pagina te importeren en exporteren, moet je mogelijk ook een hele website exporteren.

Je wilt bijvoorbeeld een templatekit maken met al je standaard webpagina’s, zoals een contactpagina en homepage. Je kunt deze kit vervolgens gebruiken om je basiswebsites te maken.

Laten we eens kijken hoe je deze kit kunt maken. Hier lees je hoe je je volledige Elementor website in drie eenvoudige stappen kunt exporteren!

Stap 1: Schakel Elementor Export Kit in

Elementor’s Export Kit functie kan je volledige site exporteren, inclusief de content en instellingen.

Deze functie kan handig zijn als je gerelateerde websites maakt en dezelfde branding wilt behouden. Je kunt bijvoorbeeld een microsite maken om een ​​aanstaande productlancering te promoten.

Op het moment van schrijven is Elementor’s Export Kit een experimentele feature. Je moet het inschakelen door naar  Elementor > Settings te gaan. Je kunt vervolgens op het Experiments tabblad klikken:

Scroll naar het Import Export Template Kit gedeelte. Je kunt dan de bijbehorende dropdown openen en Active selecteren:

Vergeet niet naar de onderkant van deze pagina te scrollen en op Save Changes te klikken. Deze experimentele feature is nu klaar voor gebruik.

Stap 2: Exporteer je volledige Elementor website

Navigeer in je WordPress dashboard naar Elementor > Tools. Klik nu op de Import/Export Kit:

Klik op Start Export. Geef desgevraagd de content en gegevens op die je in je download wilt opnemen.

Je kunt er bijvoorbeeld voor kiezen om alleen je templates te exporteren. Je kunt ook al je content exporteren, inclusief pagina’s, berichten en aangepaste berichttypen:

Klik vervolgens om het Kit Information gedeelte uit te vouwen en je bestand een beschrijvende naam te geven. Je kunt ook een optionele beschrijving invoeren:

Als je tevreden bent met je selectie, klik je op Export. Elementor zal nu je kit maken en een samenvatting weergeven van alles in dit bestand:

Elementor zal de gegenereerde kit automatisch naar je computer downloaden. Klik wanneer daarom wordt gevraagd op Back to dashboard.

Stap 3: Importeer je site

Je kunt nu je templatekit importeren in elke website waarop Elementor is geïnstalleerd. Het zal je bestaande content overschrijven, dus we raden je aan een volledige backup te maken voordat je doorgaat.

Zodra je backup is geplaatst, moet je Elementor Experiments inschakelen op de bestemmingswebsite. Navigeer zoals eerder naar  Elementor > Settings > Experiments. Je kunt dan de Import Export Template Kit sectie selecteren en deze feature activeren.

Navigeer vervolgens naar Templates > Kit Library. Klik op Start Import. Selecteer in het volgende scherm het bestand dat je in de vorige stap hebt gedownload:

Als je je kit toepast op een reeds bestaande installatie, zal Elementor alle templates weergeven met dezelfde voorwaarden als degene die je importeert. Je kunt dan kiezen welke templates je wilt vervangen en welke je wilt behouden.

Nadat je je keuze hebt gemaakt, klik je op Next. Elementor importeert nu je sitekit.

Zo los je de “Invalid File” fout van Elementor op

Soms zie je de foutmelding “Invalid File” wanneer je probeert een template te importeren. Dit betekent meestal dat je een template probeert te importeren die is gemaakt met een eerdere versie van Elementor.

Om deze fout op te lossen, moet je tijdelijk overschakelen naar een eerdere release van Elementor. Deze wijziging kan problemen met je site veroorzaken.

Met dit in gedachten raden we aan een volledige backup te maken voordat je doorgaat. Je kunt ook overwegen om je site in de onderhoudsmodus te zetten.

Als je klaar bent om verder te gaan, ga je naar de Elementor plugin listing. Selecteer vervolgens Advanced View:

Gebruik de dropdown onderaan de pagina om een ​​eerdere versie van Elementor te kiezen. Voor de beste resultaten raden we aan de laatste versie van Elementor 1 te downloaden, namelijk 1.9.8:

Als je dit bestand eenmaal hebt, heb je een paar opties. Je kunt je huidige Elementor versie deactiveren en verwijderen. Vervolgens kun je de zojuist gedownloade software uploaden en activeren.

Als alternatief kun je Easy Theme en Plugin Upgrades gebruiken. Na het activeren van deze plugin, kun je een oudere Elementor versie uploaden zonder de meest recente release te deactiveren en te verwijderen.

Na het uploaden van de oudere versie van Elementor, navigeer je naar Plugins > Installed Plugins. WordPress had automatisch moeten overschakelen naar de eerdere softwareversie:

Je zou nu je template zonder problemen moeten kunnen importeren. Zodra het importeren is voltooid, navigeer je terug naar Plugins > Installed plugins, en herstel je de meest recente versie van Elementor. Deze template zou nu in je bibliotheek moeten staan, klaar voor gebruik.

Top 3 Elementor add-ons voor het importeren en exporteren van templates

Zoals we zojuist hebben gezien, heeft Elementor een robuust import- en exportsysteem. Je kunt deze functie kant-en-klaar gebruiken om templates te maken voor afzonderlijke secties, pagina’s en zelfs hele websites.

Het is echter mogelijk dat je deze ingebouwde functionaliteit wilt uitbreiden. Met dat in gedachten zijn hier drie Elementor importtemplate add-ons die beloven het import- en exportproces een boost te geven!

1. Happy Addons Pro

Happy Addons Pro breidt de standaard Elementor ervaring uit door meer dan 20 nieuwe features toe te voegen. Hieronder vallen verschillende features die kunnen worden geïntegreerd in je import- en exportworkflow:

Als je met meerdere sites werkt, wil je misschien de feature voor kopiëren en plakken tussen verschillende domeinen van Happy Addons Pro gebruiken. Hiermee kun je eenvoudig content van de ene site kopiëren en in een geheel ander domein plakken.

Als je democontent van Happy Addons Pro opnieuw wilt gebruiken, kun je deze naar je Elementor editorvenster kopiëren. Bovendien beschikt deze add-on over een op maat gemaakte importfeature. Het biedt alle functionaliteit die je mag verwachten van het ingebouwde import- en exportsysteem van Elementor.

Je kunt met name zoeken naar Happy Addon templates op basis van de namen van secties of filteren op categorie van paginasecties.

Features:

• Kies uit meer dan 70 templates voor bestemmingspagina’s.
• Dupliceer elke pagina of post met de Happy Clone feature.
• Kopieer eenvoudig sectietemplates van de demo content van HappyAddons Pro.
• Kopieer een sectie van een willekeurige website en plak deze in een ander domein.

Prijzen: Jaarlijkse licenties beginnen bij $33.

2. Mighty Addons for Elementor

Mighty Addons for Elementor wordt geleverd met een selectie vooraf ontworpen templatekits. Wanneer je deze kits in je website importeert, krijg je toegang tot alle pagina’s die je nodig hebt om een ​​breed scala aan sites te ontwerpen.

Mighty Addons for Elementor biedt templatekits voor veel verschillende industrieën. Deze omvatten dierenwelzijn, fitness, hotels, advies en zelfs parachutespringen:

Deze add-on heeft ook een feature voor kopiëren en plakken tussen domeinen. Dit kan een krachtige aanvulling zijn op de traditionele import/export Elementor workflow als je meerdere websites beheert. Met deze feature kun je met name elke sectie, rij, kolom of zelfs de inhoud van een hele pagina gebruiken op meerdere door Elementor aangedreven websites.

Features:

• Kopieer eenvoudig afbeeldingen en video’s tussen domeinen.
• Gebruik een breed scala aan kant-en-klare sectietemplates.
• Integreer de tool met de stockfotoservice van Pixabay.

Prijzen: Je kunt de plugin Mighty Addons for Elementor downloaden. Er is ook een pro-versie beschikbaar, met licenties vanaf $29.

3. Envato Elements

Met de plugin Envato Elements kun je door duizenden pagina’s bladeren en templates blokkeren zonder WordPress te verlaten. Zodra je je perfecte template hebt gevonden, kun je deze eenvoudig in je website importeren:

Om je te helpen snel een professioneel ogende site te ontwerpen, biedt Envato Elements ook een breed scala aan templatekits. Bovendien biedt deze plugin eenvoudig toegang tot meer dan een miljoen royaltyvrije afbeeldingen als je stockfoto’s gebruikt.

Features:

• Multifunctionele templates
• Flexibele en volledig aanpasbare content
• Importeren met één klik
• Naadloze integratie met de Elementor UI

Prijzen: je kunt de Envato Elements plugin gratis downloaden. Je hebt echter een Envato Elements abonnement nodig om toegang te krijgen tot de templatecontent en deze te gebruiken. Dit kost $16,50 per maand.

Samenvatting

We gaan niet doen alsof het ontwerpen van een verbluffende website eenvoudig is. Gelukkig hoef je met Elementor’s export- en import templatemogelijkheden niet elk project met een schone lei te beginnen.

Je kunt de vroege stadia van webontwikkeling versnellen door gebruik te maken van kant-en-klare templates. Je kunt ook sectie- en paginatemplates maken, klaar om opnieuw te gebruiken in toekomstige projecten. Als je bijzonder trots bent op een website, kan Elementor zelfs je hele site exporteren. De mogelijkheden zijn eindeloos!

Bij het maken van een WordPress website heb je een krachtige host aan je zijde nodig. Bij Kinsta bieden we een reeks prestatie-geoptimaliseerde hostingabonnementen voor al je Elementor behoeften.