Krimpen van de navigatie uitschakelen

De Divi header heeft een standaard scroll effect dat de navigatie doet “krimpen” naar een compactere versie als je naar beneden scrolt. Als je dit wilt uitschakelen zijn hier 2 manieren voor:

  1. Via de Customizer
  2. Middels jQuery

Het stoppen van het krimpen via de Customizer

Recente versies van het Divi Theme biedt de mogelijkheid om het krimpen van de navigatie uit te schakelen, zonder daarvoor kennis van technische code nodig te hebben. Met behulp van Customizer instellingen kun je gewoon de hoogte van de “primary menubalk” en de hoogte van de “vaste navigatie” op dezelfde hoogte zetten. Dit kan gedaan worden met de volgende Customizer instellingen:

  1. Ga in de WordPress beheeromgeving naar Weergave > Customizer
  2. Ga naar Koptekst & Navigatie > Primary menubalk > Menu Hoogte. Stel deze bijvoorbeeld in op 50
  3. Ga naar Koptekst & Navigatie > Vaste Navigatie instellingen» Vaste Menu Hoogte en stel deze in op dezelfde waarde als in stap 2.
  4. Klik op Opslaan

Stop de Header Krimpen op Scroll met behulp van jQuery

Een andere methode is het gebruik van jQuery. Voeg daarvoor de volgende jQuery code toe aan Divi.

  1. Ga in de WordPress beheeromgeving naar Divi > Thema Opties
  2. Klik het tabbla Integratie aan
  3. Voeg onderstaande jQuery code toe aan het veld “Voeg code toe aan de < head > van uw blog”
  4. Klik op opslaan

<script>
(function(){
// Override the addClass to prevent fixed header class from being added
var addclass = jQuery.fn.addClass;
jQuery.fn.addClass = function(){
var result = addclass.apply(this, arguments);
jQuery('#main-header').removeClass('et-fixed-header');
return result;
}
})();
jQuery(function($){
$('#main-header').removeClass('et-fixed-header');
});
</script>