23 december 2017

Sticky menu en andere sticky elementen.

sticky menu

 

Vandaag zo voor de kerst een korte post hoe je je menu aan de bovenzijde van je website “sticky” kunt maken. Sommige WordPress thema’s hebben deze optie al in huis (of verkopen dit als extra/addon). Maar het is heel eenvoudig en ook toepasbaar op andere elementen op je website die je “sticky” wil maken. Eerst bepaal je welke “class” de container heeft waar je menu in staat. Dit kan je doen door het gebruiken van “inspect element” van je browser. Met je rechtermuisknop klik je op “inspecteren” uit het dropdown venster. Nu kijk je in de broncode van je website en zoek je naar het container element van je menu. Stel dat dit “nav-container” is, dan voeg je de volgende CSS code toe aan je website:

.nav-container {position:fixed;top:0;left:0;width:100%;}

De . staat voor Class. Is dit een id dan zet je er een # voor. De meeste thema’s hebben wel een mogelijkheid tot het toevoegen van Custom CSS. Zoniet dan zijn er plugins die je kunt gebruiken om deze aanvullende CSS code een plek te geven.

Veel succes!