Class CSS stijlen maken Beaver builder

Na diverse reviews en tests van de page builders (paginabouwers) van WordPress, heb ik ontdekt dat Beaver Builder duidelijk mijn favoriet is. Dit omdat het geschikt is voor webbouwers die het perfect willen doen, zoals ik 🙂

Het Beaver Builder-team heeft het gemakkelijk gemaakt om aangepaste CSS-stijlen toe te voegen aan je Beaver Builder-elementen. Zoals met elk CMS systeem, kun je veel meer doen met Beaver Builder als je CSS goed begrijpt, en de software moedigt dit aan, in plaats van te proberen ervoor te compenseren.

Om Beaver Builder-lay-outs te stylen met uw eigen aangepaste CSS, moet u weten hoe u onderliggende elementen kunt aanspreken, omdat je over het algemeen CSS-klassen toevoegt aan Beaver Builder-modules, niet aan de onderliggende HTML-elementen erin.


Handleiding hoe aangepaste CSS-stijlen aan uw Beaver Builder-elementen toe te voegen

  • Klik op “Page Builder” om de bewerkingsmodus van Beaver Builder in te schakelen en selecteer het Beaver Builder-element (module) waaraan u wilt werken.
  • Voeg op het tabblad ‘Geavanceerd’ van die module een CSS-klasse toe. U heeft geen opening nodig. teken, dus om een moduleklasse my-class te geven, typt u gewoon “my-class” in het veld “Class”.
  • Open vervolgens dezelfde pagina in een nieuw browsertabblad en ga naar “Aanpassen”> “Extra CSS”.
  • Gebruik de Inspector van uw browser om op intelligente wijze de elementen te targeten die u wilt wijzigen. Voor veel Beaver Builder-modules richt u zich in feite op elementen (zoals -tags in het videovoorbeeld) die verschillende lagen diep in de modules met de aangepaste klasse zelf zijn.

En klaar! Geniet van het gemak en de vrijheid van een echt goede paginabuilder, plus de focus en kracht van directe CSS-bewerking. En als je dat nog niet hebt gedaan, probeer dan Beaver Builder – je zult blij zijn dat je dat hebt gedaan.


Class CSS stijlen maken Beaver builder

De onderstaande video legt dit mooi uit en leidt u snel door het efficiĂ«nt toevoegen van CSS-stijlen aan Beaver Builder-elementen – zowel aan Beaver Builder-modules als aan de HTML-elementen in die modules.