Brooklyn Header Backround

[heldderberge]

Servus Leute,

ich nutze das Brooklyn Theme und habe einen fixierten Header (scrollt mit runter). Ich benötige ein Hintergrund für meinen Header oder er muss beim runterscrollen automatisch die Schriftfarbe an einen veränderten Hintergrund anpassen. Ich finde leider kein passenden Code zum einfügen, damit ich einen Hintergrund hinzufügen kann. Hat jemand ein passenden Code für mich? 

Liebe Grüße

[Kai · Accepted solution]

Hi heldderberge,

Kai hier von Shopify.

Gerne helfe ich Ihnen bei der Bearbeitung des Headers in Ihrem Brooklyn-Theme.

Für diese Anpassung müssen Sie eine kleine Änderung an einer Stelle des Codes vornehmen. Falls Sie dies nicht selbst tun möchten, können Sie sich an einen Shopify-Experten wenden, der dies gerne für Sie vornehmen wird.

Wenn Sie sich entscheiden, es selbst zu tun, gehen Sie in Ihrem Admin auf Online Store > Themes. Unter Live Theme sehen Sie eine Schaltfläche mit der Aufschrift Aktionen. Klicken Sie darauf und dann auf Code bearbeiten.

Wenn Sie sich im Codeeditor befinden, sehen Sie links einen Abschnitt mit verschiedenen Kategorien.

Klicken Sie auf Assets > Theme.scss.liquid. Damit gelangen Sie zur CSS-Datei des Themes, in die Sie diesen Code unten auf der Seite einfügen können:

.header-wrapper {
  position: fixed;
  z-index: 1;
  background-color: rgba({{ settings.color_body_bg }}, 0.0);
  width: 100%;
}
.header-sticky .header-wrapper {
  background-color: rgba({{ settings.color_body_bg }}, 1);
  @include at-query($min, $medium) {
  .logo img{
    height: 60px;
   }
  }
  .site-nav {
      transition: all .3s ease, height .8s ease;
   -webkit-transition: all .3s ease, height .8s ease;
    -o-transition: all .3s ease, height .8s ease;
    margin-top:0 !important;
  }
}
.header-sticky .header-wrapper {
}

Nachdem Sie den Code eingefügt haben, stellen Sie sicher, dass Sie oben rechts auf Speichern klicken.

Sobald der Code gespeichert ist, sollte die Kopfzeile und das Logo fixiert sein, sobald Sie beginnen, auf der Seite nach unten zu scrollen.

Ich hoffe, dies hat Ihnen geholfen. Wenn Sie weitere Fragen haben, zögern Sie bitte nicht, erneut Kontakt aufzunehmen.

MfG

[heldderberge]

Servus Kai,

erstmal vielen Dank für deine Antwort. Ich habe bereits ein fixierten Header, der sich mit nach unten bewegt. Allerdings ist die Farbe des Textes in meinem Header weis, der Hintergrund meiner Seite ist unter der Slideshow ebenfalls weis, sodass man mein Text im Header nicht mehr sieht. Daher ging es mir darum einen Hintergrund mit einer anderen Farbe meinem Header hinzu zufügen, bzw. dass der Header seine Textfarbe automatisch ändert. 

[Benny97]

Hat sich hier soweit etwas ergeben? Bin gerade am gleichen Problem und würde mich über Hilfe freuen.

Viele Grüße

Benny

[blackleaf]

Welchen Code habt ihr benutzt um die Menüleiste zu fixieren?

[Burhan]

Habe das gleiche Problem, hat sich irgendwas ergeben? Bitte um Hilfe

[Burhan]

Meiner ist auch fixiert aber wenn ich nach unten scrolle will ich eine hintergrundfarbe, wie geht das???????