Regelmatig zie je dat het menu van een website één geheel vormt met de afbeelding eronder. Het menu wordt als het ware over de afbeelding heen geplaatst. Wil je dit zelf toepassen in Elementor? Bekijk dan de onderstaande uitleg video.
Transcriptie
Hoi, leuk dat je kijkt naar een video van SiteBundel. Ik ben Marc en vandaag laat ik je zien hoe je een menu over een header plaatst in Elementor. Een voorbeeld daarvan vind je op de website van Tesla en ook op de website van Volkswagen. Ik zal je laten zien hoe je dit maakt en het resultaat ziet er dan zo uit.
Om te beginnen gaan we naar het dashboard van WordPress. Klik op Templates en vervolgens op Theme Builder. Deze kun je alleen gebruiken als je Elementor Pro hebt. Klik op Header -> Nieuwe toevoegen.
Je kunt hier een naam opgeven, maar dat is niet verplicht. Vervolgens klikken we op Template aanmaken.
De bibliotheek van Elementor die verschijnt klikken we weg, die hebben we nu niet nodig.
Dan gaan we naar Pointer. Die zetten we op none. De menutekst moet straks wel leesbaar zijn, dus die maken we wit. Daarvoor klik je op Stijl, vervolgens Text Color en selecteer dan de witte kleur.
Vervolgens klik je op Publiceren, Add Condition en dan op Save & Close.
Eens kijken wat het resultaat is. Ai! Zoals je ziet een witte balk met daarin witte tekst. Om dit in orde te maken moeten we nog één dingetje toepassen.
Daarvoor moeten we de section selecteren, dan gaan we naar Geeavanceerd. Vink de grijze knop uit bij Marge en geef bij onder een marge op van -75. Om dat te doen klik je eerst op het pijltje naar beneden en vervolgens verander je de waarde in 75.
Klik op Bijwerken en kijk eens aan, het menu ziet er nu goed uit!
