Hoe u een transparante koptekst maakt met de Elementor-sjabloon

Als u overweegt om de koptekst van uw thema aan te passen of er gewoon een te maken volgens uw voorkeur, stop dan met dat soort gedachten! Met de Elementor-  paginabuilder is het maken van aangepaste headers nog nooit zo eenvoudig geweest! Geen opgeblazen CSS of andere onnodige aangepaste methoden meer om zo simpel als dit te bereiken. In deze Elementor-zelfstudie is het maken van dit net zo eenvoudig als slepen en plakken!

Volg onderstaande stappen om aan de slag te gaan: 
Stap 1
Ga naar het dashboard van uw website. Ga verder naar “Elementor” en klik op “Mijn sjablonen”.

Stap 2
Klik op ‘Nieuw toevoegen’. Daarna wordt een paneel geopend waarin u het sjabloontype kunt selecteren dat u wilt maken. Kies in dit geval ‘Header’ in de vervolgkeuzelijst en noem deze ‘Custom Header’ (in het belang van deze tutorial) of een andere naam naar keuze.

Stap 3
Bij het aanmaken verschijnt een ander paneel met verschillende vooraf gemaakte sjablonen die u kunt bewerken. Sluit dit paneel voorlopig, want we zullen er zelf een maken. Net als bij het maken van pagina’s met Elementor, zullen we de koptekst bouwen met Elementor Builder.

Stap 4
Het is aan jou of je de header in een boxcontainer of vol wilt laten zien. Voor dit voorbeeld heb ik de koptekst ingesteld op de inhoudsbreedte ‘Volledig’. Vul daarna de gewenste inhoud voor de koptekst in.

Stap 5
Ervan uitgaande dat u de koptekst al hebt gemaakt, is de volgende stap om de achtergrond van de sectie transparant te maken. (OPMERKING : het kan zijn dat u de achtergrond in zwart moet veranderen als de teksten wit zijn wanneer u de inhoud van de koptekst wilt bewerken. U hoeft deze alleen direct daarna transparant te maken.)

Stap 6
Voeg een klasse toe aan de koptekst en voeg de volgende CSS toe. Dit is zodat de koptekst overlapt met uw pagina-inhoud en er geen spatie achter blijft. (OPMERKING: mogelijk moet u de opvulling van het eerste gedeelte van de pagina aanpassen om plaats te maken voor de transparante koptekst. )

De koptekst komt nu bovenaan de pagina te staan ​​en is transparant! Houd er rekening mee dat de opvulling die ik hier heb gebruikt naar uw voorkeur kan worden gewijzigd – dit is alleen om ervoor te zorgen dat de inhoud voldoende ruimte heeft ten opzichte van de transparante koptekst.