WordPress is het meest gebruikte Content Management Systeem (CMS) voor het maken van een website of webshop. In combinatie met een pagebuilder ontwerpt u vervolgens super gemakkelijk de mooiste berichten en pagina’s. Het WordPress thema Divi van Elegant Themes is zowel een thema als een pagebuilder. U kunt dan ook gemakkelijk via de optie themabouwer een eigen header met menu maken. Ook kunt u zo een eigen footer onderaan uw pagina’s en berichten maken.
Hoe kunt u een Divi header en footer template (json bestanden) uploaden in WordPress?
Via de volgende stappen kunt u een Divi template (json bestand) uploaden in WordPress:
- Ga in het WordPress admin menu naar Divi
- Vervolgens klikt u op de optie “Themabouwer”
U gaat vervolgens naar de pijlen rechtsboven in het scherm. Hier klikt u op.
U krijgt vervolgens een pop-up scherm. Hier klikt u op het tabblad “Importeren”. Daarna selecteert u het bestand, dat u van mijn website heeft gedownload. Vervolgens klik u op “Divi Theme Builder-sjablonen importeren”.
Zodra het bestand klaar is met uploaden, ziet u twee lichtgroene blokken, namelijk één voor een header en één voor uw footer. U klikt vervolgens op de knop “Wijzigingen opslaan”.
U kunt zowel de header als footer nog aanpassen door op het pennetje te klikken.
Als u dit heeft gedaan, moet u niet vergeten om nogmaals op de groen knop “Wijzigingen opslaan” te klikken.
Download gratis WordPress Header en Footer layouts
Hieronder kunt u gratis header & footer templates (json bestanden) downloaden. Vervolgens kunt u het bestand uploaden, zoals hiervoor beschreven.
Gratis WordPress Divi header, menu en footer layout 01 - Acupunctuur
wordpress divi header menu footer layout pack 01 acupuncture
Download gratis WordPress Divi header, menu en footer layout 01 – Acupunctuur (json bestand)
Gratis WordPress Divi header, menu en footer layout 02 - Astrologie
wordpress divi header menu footer layout pack 02 astrologer
Download gratis WordPress Divi header, menu en footer layout 02 – Astrologie (json bestand)
Gratis WordPress Divi header, menu en footer layout 03 - Cosmetica
wordpress divi header menu footer layout pack 03 beauty product
Download gratis WordPress Divi header, menu en footer layout 03 – Cosmetica (json bestand)
Gratis WordPress Divi header, menu en footer layout 04 - Fietsenmaker
wordpress divi header menu footer layout pack 04 bike repair
Download gratis WordPress Divi header, menu en footer layout 04 – Fietsenmaker (json bestand)
Gratis WordPress Divi header, menu en footer layout 05 - Bistro
wordpress divi header menu footer layout pack 05 bistro
Download gratis WordPress Divi header, menu en footer layout 05 – Bistro (json bestand)
Gratis WordPress Divi header, menu en footer layout 06 - Kooklessen
wordpress divi header menu footer layout pack 06 cooking school
Download gratis WordPress Divi header, menu en footer layout 06 – Kooklessen (json bestand)
Gratis WordPress Divi header, menu en footer layout 07 - Black Friday
wordpress divi header menu footer layout pack 07 black friday
Download gratis WordPress Divi header, menu en footer layout 07 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 08 - Black Friday
wordpress divi header menu footer layout pack 08 black friday
Download gratis WordPress Divi header, menu en footer layout 08 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 09 - Black Friday
wordpress divi header menu footer layout pack 09 black friday
Download gratis WordPress Divi header, menu en footer layout 09 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 10 - Black Friday
wordpress divi header menu footer layout pack 10 black friday
Download gratis WordPress Divi header, menu en footer layout 10 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 11 - Black Friday
wordpress divi header menu footer layout pack 11 black friday
Download gratis WordPress Divi header, menu en footer layout 11 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 12 - Black Friday
wordpress divi header menu footer layout pack 12 black friday
Download gratis WordPress Divi header, menu en footer layout 12 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 13 - Black Friday
wordpress divi header menu footer layout pack 13 black friday
Download gratis WordPress Divi header, menu en footer layout 13 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 14 - Black Friday
wordpress divi header menu footer layout pack 14 black friday
Download gratis WordPress Divi header, menu en footer layout 14 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 15 - Black Friday
wordpress divi header menu footer layout pack 15 black friday
Download gratis WordPress Divi header, menu en footer layout 15 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 16 - Black Friday
wordpress divi header menu footer layout pack 16 black friday
Download gratis WordPress Divi header, menu en footer layout 16 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 17 - Black Friday
wordpress divi header menu footer layout pack 17 black friday
Download gratis WordPress Divi header, menu en footer layout 17 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 18 - Black Friday
wordpress divi header menu footer layout pack 18 black friday
Download gratis WordPress Divi header, menu en footer layout 18 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 19 - Black Friday
wordpress divi header menu footer layout pack 19 black friday
Download gratis WordPress Divi header, menu en footer layout 19 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 20 - Black Friday
wordpress divi header menu footer layout pack 20 black friday
Download gratis WordPress Divi header, menu en footer layout 20 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 21 - Black Friday
wordpress divi header menu footer layout pack 21 black friday
Download gratis WordPress Divi header, menu en footer layout 21 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 22 - Black Friday
wordpress divi header menu footer layout pack 22 black friday
Download gratis WordPress Divi header, menu en footer layout 22 – Black Friday (json bestand)
Gratis WordPress Divi header, menu en footer layout 23 - Medisch centrum
wordpress divi header menu footer layout pack 23 womens health center
Download gratis WordPress Divi header, menu en footer layout 23 – Medisch centrum (json bestand)
Gratis WordPress Divi header, menu en footer layout 24 - Ramenwasser
wordpress divi header menu footer layout pack 24 window cleaning
Download gratis WordPress Divi header, menu en footer layout 24 – Ramenwasser (json bestand)
Gratis WordPress Divi header, menu en footer layout 25 - Huwelijksfotograaf
wordpress divi header menu footer layout pack 25 wedding photographer
Download gratis WordPress Divi header, menu en footer layout 25 – Huwelijksfotograaf (json bestand)
Gratis WordPress Divi header, menu en footer layout 26 - Online fitness
wordpress divi header menu footer layout pack 26 virtual fitness
Download gratis WordPress Divi header, menu en footer layout 26 – Online Fitness (json bestand)
Gratis WordPress Divi header, menu en footer layout 27 - Online Assistent
wordpress divi header menu footer layout pack 27 virtual assistant
Download gratis WordPress Divi header, menu en footer layout 27 – Online Assistent (json bestand)
Gratis WordPress Divi header, menu en footer layout 28 - Stoffeerbedrijf
wordpress divi header menu footer layout pack 28 upholstery
Download gratis WordPress Divi header, menu en footer layout 28 – Stoffeerbedrijf (json bestand)
Gratis WordPress Divi header, menu en footer layout 29 - Medische helpdesk
wordpress divi header menu footer layout pack 29 telehealth
Download gratis WordPress Divi header, menu en footer layout 29 – Medische helpdesk (json bestand)
Gratis WordPress Divi header, menu en footer layout 30 - Tarot kaartleggingdesk
wordpress divi header menu footer layout pack 30 tarot
Download gratis WordPress Divi header, menu en footer layout 30 – Tarot kaartlegging (json bestand)
Gratis WordPress Divi header, menu en footer layout 31 - Sushi restaurant
wordpress divi header menu footer layout pack 31 sushi restaurant
Download gratis WordPress Divi header, menu en footer layout 31 – Sushi restaurant (json bestand)
Gratis WordPress Divi header, menu en footer layout 32 - Kruidenwinkelt
wordpress divi header menu footer layout pack 32 spice shop
Download gratis WordPress Divi header, menu en footer layout 32 – Kruidenwinkel (json bestand)
Gratis WordPress Divi header, menu en footer layout 33 - Schoenmakerij
wordpress divi header menu footer layout pack 33 shoe repair
Download gratis WordPress Divi header, menu en footer layout 33 – Schoenmakerij (json bestand)
Gratis WordPress Divi header, menu en footer layout 34 - Robotica
wordpress divi header menu footer layout pack 34 robotics
Download gratis WordPress Divi header, menu en footer layout 34 – Robotica (json bestand)
Gratis WordPress Divi header, menu en footer layout 35 - Renovatie
wordpress divi header menu footer layout pack 35 renovation
Download gratis WordPress Divi header, menu en footer layout 35 – Renovatie (json bestand)
Gratis WordPress Divi header, menu en footer layout 36 - Makelaar
wordpress divi header menu footer layout pack 36 realtor
Download gratis WordPress Divi header, menu en footer layout 36 – Makelaar (json bestand)
Gratis WordPress Divi header, menu en footer layout 37 - Reclamebureau
wordpress divi header menu footer layout pack 37 pr firm
Download gratis WordPress Divi header, menu en footer layout 37 – Reclamebureau (json bestand)
Gratis WordPress Divi header, menu en footer layout 38 - Pizzeria
wordpress divi header menu footer layout pack 38 pizzeria
Download gratis WordPress Divi header, menu en footer layout 38 – Pizzeria (json bestand)
Gratis WordPress Divi header, menu en footer layout 39 - Dierenwinkel
wordpress divi header menu footer layout pack 39 pet supply
Download gratis WordPress Divi header, menu en footer layout 39 – Dierenwinkel (json bestand)
Gratis WordPress Divi header, menu en footer layout 40 - Parfumerie
wordpress divi header menu footer layout pack 40 perfumery
Download gratis WordPress Divi header, menu en footer layout 40 – Parfumerie (json bestand)
Gratis WordPress Divi header, menu en footer layout 41 - Schilder
wordpress divi header menu footer layout pack 41 painter
Download gratis WordPress Divi header, menu en footer layout 41 – Schilder (json bestand)
Gratis WordPress Divi header, menu en footer layout 42 - Nagelstudio
wordpress divi header menu footer layout pack 42 nail salon
Download gratis WordPress Divi header, menu en footer layout 42 – Nagelstudio (json bestand)
Gratis WordPress Divi header, menu en footer layout 43 - Meditatie
wordpress divi header menu footer layout pack 43 meditation
Download gratis WordPress Divi header, menu en footer layout 43 – Mediatie (json bestand)
Gratis WordPress Divi header, menu en footer layout 44 - Leerbewerking
wordpress divi header menu footer layout pack 44 leather company
Download gratis WordPress Divi header, menu en footer layout 44 – Leerbewerking (json bestand)
Gratis WordPress Divi header, menu en footer layout 45 - Italiaans restaurant
wordpress divi header menu footer layout pack 45 italian restaurant
Gratis WordPress Divi header, menu en footer layout 46 - Tolk
wordpress divi header menu footer layout pack 46 interpreter
Download gratis WordPress Divi header, menu en footer layout 46 – Tolk (json bestand)
Gratis WordPress Divi header, menu en footer layout 47 - Influencer
wordpress divi header menu footer layout pack 47 influencer
Download gratis WordPress Divi header, menu en footer layout 47 – Influencer (json bestand)
Gratis WordPress Divi header, menu en footer layout 48 - Holistische therapie
wordpress divi header menu footer layout pack 48 holistic healer
Gratis WordPress Divi header, menu en footer layout 49 - Kruidenremedie
wordpress divi header menu footer layout pack 49 herbal remedy
Download gratis WordPress Divi header, menu en footer layout 49 – Kruidenremedie (json bestand)
Gratis WordPress Divi header, menu en footer layout 50 - Freelance schrijver
wordpress divi header menu footer layout pack 50 freelance writer
Download gratis WordPress Divi header, menu en footer layout 50 Freelance schrijver (json bestand)
Gratis WordPress Divi header, menu en footer layout 51 - Fitness coach
wordpress divi header menu footer layout pack 51 fitness coach
Download gratis WordPress Divi header, menu en footer layout 51 Fitness coach (json bestand)
Gratis WordPress Divi header, menu en footer layout 52 - Financieel adviseur
wordpress divi header menu footer layout pack 52 financial advisor
Download gratis WordPress Divi header, menu en footer layout 52 Financieel adviseur (json bestand)
Gratis WordPress Divi header, menu en footer layout 53 - Huisarts
wordpress divi header menu footer layout pack 53 family doctor
Download gratis WordPress Divi header, menu en footer layout 53 Huisarts (json bestand)
Gratis WordPress Divi header, menu en footer layout 54 - Ingenieursbureau
wordpress divi header menu footer layout pack 54 engineering firm
Download gratis WordPress Divi header, menu en footer layout 54 Ingenieursbureau (json bestand)
Gratis WordPress Divi header, menu en footer layout 55 - Diëtist
wordpress divi header menu footer layout pack 55 dietitian
Download gratis WordPress Divi header, menu en footer layout 55 Diëtist (json bestand)
Gratis WordPress Divi header, menu en footer layout 56 - Online samenwerkingsplatform
wordpress divi header menu footer layout pack 56 coworking space
Gratis WordPress Divi header, menu en footer layout 57 - Effectenkantoor
wordpress divi header menu footer layout pack 57 brokerage firm
Download gratis WordPress Divi header, menu en footer layout 57 Effectenkantoor (json bestand)
Gratis WordPress Divi header, menu en footer layout 58 - Fixed header with divi's position options
wordpress divi header menu footer layout pack 58 position options desktop
wordpress divi header menu footer layout pack 58 position options mobile
Gratis WordPress Divi header, menu en footer layout 59 - Global sticky header
wordpress divi header menu footer layout pack 59 global sticky desktop preview
wordpress divi header menu footer layout pack 59 global sticky mobile preview
Download gratis WordPress Divi header, menu en footer layout 59 Global sticky header (json bestand)
Gratis WordPress Divi header, menu en footer layout 60 - Responsive slide-in menu
wordpress divi header menu footer layout pack 60 yoga desktop preview
wordpress divi header menu footer layout pack 60 yoga mobile preview
Gratis WordPress Divi header, menu en footer layout 61 - Slide down push menu
Gratis WordPress Divi header, menu en footer layout 61 - Header en menu verticaal
Gratis WordPress Divi header, menu en footer layout 62 - Global floating menu bar
wordpress divi header menu footer layout pack 63 global floating desktop
Gratis WordPress Divi header, menu en footer layout 64 - Transparant header sticky on scroll
wordpress divi header menu footer layout pack 64 transparant sticky desktop preview
Gratis WordPress Divi header, menu en footer layout 65 - Header en menu verticaal en gedraaid
wordpress divi header menu footer layout 65 rotated desktop preview
Gratis WordPress Divi header, menu en footer layout 66 - Uitklapbaar mobiel menu
wordpress divi header menu footer layout 66 mobile nested mobile preview
Als u dit Json bestand wilt gebruiken om voor mobiele weergave een uitklapbaar mobiel menu te tonen, dan dient u nog enkele aanpassingen te doen bij uw menu instellingen. Uitleg hierover vindt u in deze blog van Elegant Themes. U hoeft enkel de CSS class aan te geven van het eerste en tweede niveau van uw menu. Alle overige instellingen zitten al in het Json bestand.
Gratis WordPress Divi header, menu en footer layout 67 - Animatie binnen uw header
wordpress divi header menu footer layout pack 67 animation desktop preview
Gratis WordPress Divi header, menu en footer layout 68 - Animatie binnen uw header
wordpress divi header menu footer layout pack 68 animation desktop preview
Gratis WordPress Divi header, menu en footer layout 69 - Inline login formulier in uw header
wordpress divi header menu footer layout pack 69 inline login form
Gratis WordPress Divi header, menu en footer layout 70 - Menu met 2 aansluitende knoppen
wordpress divi header menu footer layout pack 2 button desktop
Gratis WordPress Divi header, menu en footer layout 71 - Dropdown contact formulier in uw header
wordpress divi header menu footer layout pack 71 dropdown contact form desktop preview
Gratis WordPress Divi header, menu en footer layout 73 - Label toevoegen aan menu items
wordpress divi header menu footer layout pack 73 corner label preview desktop
Gratis WordPress Divi header, menu en footer layout 74 - Het plaatsen van een verdeler (divider) tussen header en body
wordpress divi header menu footer layout pack 74 section divider desktop
Gratis WordPress Divi header, menu en footer layout 75 - Website titel en ondertitel in uw header
wordpress divi header menu footer layout pack 75 dynamic site title
De website titel en ondertitel voert u in via het WordPress admin menu bij het onderdeel “Algemeen”.
Gratis WordPress Divi header, menu en footer layout 76 - Een audio afspeellijst aan uw header toevoegen
wordpress divi header menu footer layout pack 76 audio bar desktop preview
U moet nog wel een audio bestand uploaden in uw media bibliotheek en de url hiervan plakken bij de instellingen van de audio module die in deze header is verwerkt.
Gratis WordPress Divi header, menu en footer layout 77 - Bij een sticky header wisselen in logo bij scrollen
wordpress divi header menu footer layout pack 77 change logo on scroll
Hoe maakt u een global header met de Divi themabouwer?
U kunt er natuurlijk ook voor kiezen om zelf een header met menu te maken. Als u éénmaal ervaring heeft opgedaan met de Divi themabouwer, dan is het niet meer zo moeilijk om zelf een header te maken. Mocht u dit toch nog moeilijk vinden, dan kunt u beter nog even de volgende video bekijken. Hierin wordt stap-voor-stap uitgelegd hoe u in de themabouwer een eigen header met menu maakt.
Hoe maakt u een global footer met de Divi themabouwer?
Heeft u hiervoor de bovenstaande video bekeken en een eigen global header gemaakt? Bekijk dan ook onderstaande video en maak ook uw eigen global footer in de Divi themabouwer