Wil je leren hoe je aangepaste lay-outs maakt in WordPress? Met Beaver Builder kunt u uw eigen lay-outs maken zonder code te schrijven. In deze tutorial bestuderen we Beaver Builder en laten we je zien hoe je aangepaste WordPress-lay-outs kunt maken met deze plug-in.

Beaver Builder lay-outplug-in

Waarom en wanneer u aangepaste lay-outs nodig heeft

Veel WordPress-thema's premium hebben lay-outs voor verschillende delen van een website. Soms voldoet een ingebouwde lay-out echter niet aan uw behoeften.

Je kunt creëren templates Aanpassingen van WordPress-pagina's door een kindthema te maken en vervolgens uw eigen thema toe te voegen templates van pagina's. Maar je hebt kennis van PHP, HTML en CSS nodig om het te laten werken.

Dit is waar Beaver Builder speel het spel mee . Het is een plug-in voor het slepen en neerzetten van pagina's op WordPress. Het helpt u bij het maken van uw eigen aangepaste lay-out zonder code te schrijven.

Beaver Builder Samenvatting

Beaver Builder is heel gemakkelijk te gebruiken en geschikt voor beginners. Tegelijkertijd wordt het geleverd met geweldige functies om pagina's met een professionele uitstraling te maken.

Het werkt met iedereen WordPress-thema's en heeft tonnen modules die u eenvoudig op uw pagina kunt gebruiken (door slepen en neerzetten). U kunt elk type lay-out maken dat u wilt en configureren zoals u wilt.

In deze Beaver Builder-zelfstudie laten we u zien hoe u deze kunt gebruiken om aangepaste lay-outs in WordPress te maken.

Laten we beginnen.

Beaver Builder configureren

U moet eerst de plug-in aanschaffen Beaver Builder. Het is een betaalde plug-in, beginnend bij $ 99 voor onbeperkte sites.

Dan moet je de plug-in installeren en activeren.

Ga na activering naar de pagina Instellingen "Pagina Builder om uw licentiesleutel in te voeren.

Beaver licentie van de WordPress plug-in

Nadat u uw licentiesleutel heeft ingevoerd, bent u nu klaar om uw lay-outs te maken.

Maak uw eerste aangepaste lay-out met Beaver Builder

Maak gewoon een nieuwe pagina in WordPress door verder te gaan Pagina's »Nieuw toevoegen. U ziet een nieuw tabblad 'Pagina Builder' in de WordPress-editor.

WordPress beaver plug-ins pagina-editor

Klik op de 'Pagina Builder'voor het gooien' Beaver Builder". Als dit de eerste keer is dat u Beaver Builder gebruikt, ziet u een welkomstvenster met een rondleiding.

Op dit moment kunt u op de 'Nee Sla de stap over'. Daarna moet u op de knop klikken Sjablonen in het bovenste menu.

Beaver-sjabloon WodPress-plug-in

Beaver Builder biedt professioneel ontworpen sjablonen waarmee u meteen aan de slag kunt.

Maakt u zich geen zorgen, u kunt de sjabloon zo vaak aanpassen als u wilt. Het is gewoon een snelle manier om u op weg te helpen met een lay-out.

Een Beaver WordPress-invoegtoepassing voor invoegtoepassingen kiezen

Wanneer u een lay-out selecteert, laadt Beaver Builder deze in het voorbeeldvenster. Beweeg je muis over een item en Beaver Builder zal het markeren.

U kunt eenvoudig op het moersleutelpictogram op een gemarkeerd item klikken om het te bewerken.

Bewerk een lay-out

Beaver Builder toont een pop-up met verschillende instellingen die u kunt bewerken. U kunt de tekst, kleur, achtergrond, lettertype, marge, enz. Wijzigen.

U kunt ook op een item in het live voorbeeld klikken en het over de pagina slepen.

De lay-outs van Beaver Builder zijn in rijen ontworpen. U kunt slepen en neerzetten om de rijen te herschikken. U kunt ook een nieuwe rij verwijderen of toevoegen.

Klik gewoon op de knop Lay-outs rijen selecteer vervolgens het aantal kolommen dat u in uw rij wilt hebben.

Voeg een WordPress Beaver Plugin Line toe

Beaver Builder voegt de rij toe aan de live preview op uw site.

U kunt items aan uw rijen toevoegen met behulp van basis- of geavanceerde modules en widgets. Met deze modules kunt u de meest gebruikte elementen toevoegen, zoals knoppen, titels, teksten, afbeeldingen, diavoorstellingen, audio, video's, enz.

Selecteer gewoon een item en sleep het naar de rij die u zojuist hebt toegevoegd. Klik op een item om de eigenschappen ervan te bewerken.

U kunt ook een rij of module opslaan om later op andere pagina's opnieuw te gebruiken. Klik op de knop " Opslaan als " bij het wijzigen van een rij of module.

Hoe de module op te slaan

Klik op de knop afgewerkt Wanneer u klaar bent met het bewerken van uw pagina. Beaver Builder toont een pop-up met knoppen voor " publiceren "Of" Sla uw pagina op als een concept".

Dialoogvenster WordPress Beaver Plugin

U kunt ook een volledige lay-out hergebruiken voor andere pagina's op uw WordPress-site. Open gewoon de pagina met de Page Designer en klik vervolgens op de knop Tools in de bovenste balk.

Beaver Builder zal je een pop-up laten zien. U kunt de pagina als sjabloon opslaan of snel een dubbele pagina met dezelfde lay-out maken.

Sla een WordPress Beaver plug-inslay-out op

Beheer lay-outsjablonen op Beaver Builder

Elke Beaver Builder-licentie geeft u het recht om deze op onbeperkte websites te gebruiken. Maar hoe verplaats je je paginasjablonen van de ene WordPress-site naar de andere?

Beaver Builder slaat sjablonen op die door gebruikers zijn gemaakt in een aangepast berichttype, sjablonen genaamd. Het is standaard verborgen, maar u kunt het zichtbaar maken door naar Instellingen »Bouwerpagina en klik op het tabblad Sjablonen.

Vink gewoon het vakje naast de optie 'Schakel Admin-sjablonen in'en klik Sjablooninstellingen opslaan.

sla een Beaver-layout op WordPress dashboard

U zult merken dat er een nieuw menu-item wordt genoemd Sjablonen verschijnt in uw WordPress-dashboard. Alle lay-outs die u als sjablonen opslaat, worden op deze pagina weergegeven.

Omdat dit een aangepast berichttype is, kunt u uw Beaver Builder-sjablonen eenvoudig exporteren met de ingebouwde exportfunctionaliteit van WordPress.

Bezoek de pagina Hulpmiddelen »Exporteren en selecteer Sjablonen. Klik op de knop Download het exportbestand En WordPress verzendt een XML-bestand dat u kunt downloaden.

Exporteer WordPress-sjablonen

Maak nu verbinding met de WordPress-site waar u de sjablonen wilt importeren. Ga door Instellingen »Importeren en klik op WordPress.

U wordt gevraagd om de importeerplug-in te downloaden en te installeren. Daarna kunt u eenvoudig uw bestand templates.xml downloaden en importeren.

Dat is alles! We hopen dat deze tutorial je heeft geholpen bij het maken van aangepaste WordPress-lay-outs met Beaver Builder. Als u opmerkingen of suggesties heeft, laat het ons dan weten in het daarvoor bestemde gedeelte.