Header Menu sticky machen

Shopware 5 Plugins
1

Hallo, direkt vorweg, ich habe von Programmieren usw. so gut wie keine Ahnung.
Wir hatten bis vor kurzem ein Plugin, welches die obere Menuleiste Sticky gemacht hat. Also dass diese beim runterscrollen immer oben im Browser sichtbar geblieben und quasi mitgescrollt ist.

Dieses Plugin ist veraltet, wird nicht mehr im Shop angeboten und verursacht nun einen Error im Backend, daher habe ich es deaktiviert und wird gelöscht.

Bevor ich nun nach einem neuen Plugin suche und hier vllt. wieder das Problem haben werde. Kann man die Menuleiste nicht irgendwie im Template auf einfache Weise fixieren? Das würde mir das Risiko ersparen, wieder mit abgelaufenen Plugins zu arbeiten…

Wenn es zu umständlich ist, werde ich wieder ein Plugin nehmen, aber ich denke mir, so eine Änderung am Template kann doch kein allzu großer Aufwand sein… Vllt. könnt ihr mir hier helfen.

Danke!

2

man kann es umsetzen mit css und position:sticky

3

Aufwand/Schwierigkeit? Schaff ich das alleine, wenn ihr mich anleitet? :smiley:
Würde so eine Kleinigkeit (denke ich mal) ungern extra an eine Agentur geben…

4

Na du bist lustig, woher sollen wir deinen Kenntnisstand in Sachen SW Theme, CSS und JavaScript wissen? Was für einen eine Sache von 5 Minuten ist, kann für einen anderen 3 Stunden bedeuten.

Ansonsten Feuer frei:

// CSS

.navigation-main.navi--is--fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

// JavaScript


$(function() {

  function NaviFix() {
    var h = window.innerHeight;
    if ($(this).scrollTop() > 140) {
      $(".navigation-main").addClass("navi--is--fixed");
    } else {
      $(".navigation-main").removeClass("navi--is--fixed");
    }
    $(".navigation-main.navi--is--fixed .advanced-menu").css('max-height', h-100 + 'px' );
  }
  $(window).scroll(function(){
    NaviFix();
  });

  NaviFix();

});

Jetzt kannst du dir deine Fragen selber beantworten :slight_smile: