Header builder

Om de header van je website aan te passen ga je via het admin gedeelte naar InstellingenThema.

Ga vervolgens via het linkermenu naar onder Algemene opties op Header.

Header builder interface

Onder je pagina verschijnen drie rijen (boven, midden en onder). In deze rijen bouw je je header op.

In het bovenstaande voorbeeld heb ik in de bovenste rij een menu aan de linkerkant en social media iconen en een zoekicoon aan de rechterkant. In de middelste rij heb ik aan de linkerkant een logo en aan de rechterkant nog een menu en een button.

In de onderste staan geen elementen, De rij is daarom op dit moment ook geen onderdeel van de header.

Alle elementen waarmee je de header kunt bouwen vindt je aan de linkerkant.

Heeft een element een grijze kleur, een gestreepte rand en een pijltje naar rechts? Dan wordt deze gebruikt in de header.

Je kunt de instellingen van een element aanpassen door op het element te klikken.

Een header opbouwen

In de onderstaande video zijn er nog geen elementen in de rijen geplaatst. Hierdoor is er ook geen header in de live weergave te zien. Zodra een rij geen elementen bevat verdwijnt de rij namelijk uit de header.

Als eerst ga ik een logo plaatsen. Ik klik op het logo-element en sleep deze naar de middelste rij. Je kunt elementen plaatsen op de plaatsen waar je een bolletje zien.

Het is daarnaast ook mogelijk om meerdere elementen naast elkaar te zetten.

Uiterlijk van de header aanpassen

Behalve dat je volledig zelf in de hand hebt welke elementen waar in de header staan, kun je ook het uiterlijk van de rijen volledig naar wens aanpassen.

Als je met je muis over een rij beweegt verschijnt er een blauwe box (bijvoorbeeld met de tekst MAIN ROW). Klik je op deze box, dan verschijnt er in het linker venster een instellingen-scherm met twee tabbladen (Algemeen en Ontwerp).

Tabblad Algmeen

Onder het tabblad Algemeen is het mogelijk om:

  • De containerbreedte in te stellen: Standaard (1290px) of Volledige breedte.
  • De hoogte van de rij te bepalen (in pixels)
  • In te stellen of de header krimpt als iemand naar beneden scrolt.

Tabblad Ontwerp

Onder het tabblad Ontwerp is het mogelijk om:

  • De kleur van de rij te bepalen. Je kunt er ook voor kiezen om de rij een andere kleur te geven zodra deze sticky is.
  • Een boven- en of onderrand toe te voegen.
  • Schaduw toe te voegen.

Tip! Wil je een Material effect creëeren? Voeg dan een schaduw toe aan de sticky header.