FROM CACHE - de_header

Hintergrund der Navigationsleiste anpassen

Gelöst
rk_wmx
Tourist
4 0 1

Hallo zusammen,

 

ich möchte gerne den Hintergrund der Navigationsleiste so anpassen, dass er farbig wird und die Menüleiste mittig davon sitzt.

Ersteres habe ich hinbekommen aber an Letzterem scheitere ich.

Kann mir hier jemand weiterhelfen?

Bildschirmfoto 2021-04-14 um 22.04.38.png

Außerdem würde ich gerne die ganze Menüleiste (also den farbigen Bereich) so begrenzen, dass sie nicht breiter ist als die Artikelauswahl. Geht das?

 

Vielen Dank schonmal für eure Hilfe.

 

Gruß

Robin

1 AKZEPTIERTE LÖSUNG

Anerkannte Lösungen
r8r
Shopify Expert
2467 317 878

Erfolg.

@rk_wmx 

ad 1.) Vertikal zentriert darstellen: ergänze folgendes am Ende der Datei assets/theme.css

ul#SiteNav {
  padding: 1rem 0;
}

ad 2.) Desktop-Navigation auf Contentbreite beschränken: öffne die Datei sections/header.liquid und ergänze die Klasse page-width beim nav-Element mit der ID AccessibleNav und mit der Klasse small--hide – beim aktuellen Debut ist das in Zeile 250 und das Ergebnis ist dann folgendes …

  <nav class="small--hide border-bottom page-width" id="AccessibleNav" role="navigation">

Resultat:

Screenshot 2021-04-15 at 15.55.16.jpg

LG, Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte

Lösung in ursprünglichem Beitrag anzeigen

4 ANTWORTEN 4
r8r
Shopify Expert
2467 317 878

@rk_wmx Robin …

und die Menüleiste mittig davon sitzt.

Du meinst vertikal zentriert?

Ja, aber darüber hinaus beantworten kann man das nur ordentlich, wenn Du uns einen Link zum Store gibst. Und idealerweise gleich die Info dazu, welches Theme Du verwendest.

LG, Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
rk_wmx
Tourist
4 0 1

Hi Mario,

 

vielen Dank für deine Antwort.

Link zum Shop ist https://wiewowasistgut.myshopify.com/

PW: www2021

Theme: Debut

 

LG Robin

r8r
Shopify Expert
2467 317 878

Erfolg.

@rk_wmx 

ad 1.) Vertikal zentriert darstellen: ergänze folgendes am Ende der Datei assets/theme.css

ul#SiteNav {
  padding: 1rem 0;
}

ad 2.) Desktop-Navigation auf Contentbreite beschränken: öffne die Datei sections/header.liquid und ergänze die Klasse page-width beim nav-Element mit der ID AccessibleNav und mit der Klasse small--hide – beim aktuellen Debut ist das in Zeile 250 und das Ergebnis ist dann folgendes …

  <nav class="small--hide border-bottom page-width" id="AccessibleNav" role="navigation">

Resultat:

Screenshot 2021-04-15 at 15.55.16.jpg

LG, Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
rk_wmx
Tourist
4 0 1

@r8r 

Vielen Dank. Funktioniert super.