We zullen een geheel nieuwe header maken met een logo en een navigatiemenu. We zullen het menu zo opmaken dat de achtergrond van de koptekst gedeeltelijk of volledig transparant is. We optimaliseren de koptekst voor alle apparaten en maken deze plakkerig, zodat wanneer u scrolt, de koptekst bovenaan de pagina blijft plakken.
We zullen sociale pictogrammen toevoegen en deze optimaliseren voor alle apparaten. Dan zal ik je laten zien hoe je de achtergrondkleur, link- en pictogramkleuren en het logo kunt wijzigen wanneer je scrolt, zodat je zoiets als dit krijgt. Ik zal je ook laten zien hoe je de sociale pictogrammen op een mobiel kunt verbergen.
Daarna zullen we een bovenste koptekst maken met sociale pictogrammen en een oproep tot actie en deze zodanig opmaken dat deze niet blijft plakken aan het hoofdgedeelte van de koptekst. We zullen ook de bovenste koptekst optimaliseren door de marge en opvulling pixel voor pixel aan te passen totdat we denken dat deze perfect is!
We bepalen op welke pagina’s deze header moet verschijnen, dupliceren de volledige header en verwijderen de transparantie, zodat we deze kunnen toepassen op de pagina’s die geen transparante achtergrond nodig hebben.
Uiteindelijk zal ik u laten zien hoe u uw mooie koptekst kunt exporteren en importeren naar een andere website, zodat u deze keer op keer kunt gebruiken op uw Elementor Pro-websites of die van uw klanten.
Als je al een header hebt en je wilt direct naar het sticky header-gedeelte gaan, dan kun je dat doen door naar de tijdstempels in de beschrijving te gaan. Wanneer je op het tijdstempel klikt, ga je direct naar dat deel van de tutorial.
Overzicht met tijdstempels
00:00 Intro
00:10 Overzicht van de zelfstudie
01:42 Download Elementor Pro
02:51 Installeren en Elementor Pro
03:19 Active Elementor Pro-licentie
De Elementor Pro-kopsjabloon
03:40 Maak een koptekst
04:51 Voeg een afbeelding toe
05:24 Maak een transparante achtergrond
05:47 Bewerkingshendels toevoegen in Elementor
06:44 Publicatievoorwaarden
07:12 Een navigatiemenu toevoegen
09:28 Het menu-onderbrekingspunt
10:24 Optimaliseer de koptekst voor alle apparaten
12:25 Verander de hoogte van de kop
14:15 Lijn het logo en het menu uit
14:33 De Elementor-navigator
15:21 Gebruik het oog om het resultaat te zien
16:02 Een referentiegebied maken
17:10 Negatieve marges gebruiken
Maak de kop plakkerig
18:18 Maak de kop plakkerig
18:46 Sociale pictogrammen toevoegen
22:59 Verberg sociale pictogrammen op een smartphone
23:36 Stijl het Hamburger Menu
De logo-, achtergrond- en linkkleuren wijzigen
26:10 Wijzig de link- en pictogramkleuren bij scrollen
28:38 Verander de afbeelding bij scrollen
31:15 Een topbalk maken
33:29 Spelen met marge en opvulling
37:32 Maak een dubbele koptekst met zichtbare achtergrond
42:53 Elementor Pro-weergavevoorwaarden
44:45 Kopteksten exporteren en importeren naar een andere website
47:21 Wereldwijde kleuren
48:06 Bedankt
