FROM CACHE - de_header
Diese Community hat auf Peer-to-Peer-Support umgestellt. Der Shopify Support wird diese Community nicht mehr betreuen. Wir empfehlen dir, dich mit anderen Händler:innen und Partner:innen in Verbindung zu setzen, um Unterstützung zu erhalten und Erfahrungen auszutauschen. Bitte melde weiterhin alles, was gegen unseren Verhaltenskodex verstößt, oder Inhalte, die deiner Meinung nach entfernt werden sollten.

Betreff: Header verschiebt sich nach unten

Header verschiebt sich nach unten

Kuelah
Entdecker
26 0 6

Hallo zusammen,

 

Ich habe ein Problem mit der Kopfzeile auf meiner Website. Das Problem ist, dass, wenn Benutzer auf der Seite herauszoomen (oder einen größeren Bildschirm haben) die Kopfzeile nach unten von seiner vorgesehenen Position verschiebt:

 

Kuelah_0-1697606650679.png

Auf einigen anderen Seiten tritt das Problem sogar bei normalen 100 % Bildschirmzoom auf:

Kuelah_1-1697606686258.png

 

Weiß jemand, woran dieses Problem liegen könnte?

 

Vielen Dank im Voraus!

4 ANTWORTEN 4

HansimGlück
Shopify Partner
28 3 11

Hey,

anhand deiner Bilder sieht es wirklich so aus, als ob deine Kopfzeile etwas durcheinandergeraten ist. Lass uns das gemeinsam angehen:

  1. CSS-Stile: Schau mal nach den CSS-Eigenschaften position, top und left für die Kopfzeile. Stell sicher, dass sie richtig positioniert ist und nicht herumrutscht, wenn du die Größe änderst.

  2. Responsive Design: Falls du Media Queries benutzt, check mal, ob die richtig eingestellt sind. Manchmal können hier kleine Fehler schon für große Probleme sorgen.

  3. Überlappung: Es könnte sein, dass ein anderes Element deine Kopfzeile stört. Nutze die Entwicklertools deines Browsers (meist mit F12 zu öffnen), um zu schauen, was da los ist.

  4. JavaScript/JQuery: Falls du Scripts nutzt, um das Verhalten der Kopfzeile zu beeinflussen, schau mal, ob da alles glatt läuft.

  5. Browser: Teste deine Seite in verschiedenen Browsern. Manchmal spielt ein Browser nicht so mit, wie man es gern hätte.

Wenn du das alles gecheckt hast und das Problem bleibt, wäre es super, wenn du mir mehr Infos gibst, z.B. den genauen Code. Aber probier erstmal die obigen Schritte aus. Hoffentlich klappt's dann schon besser! 🙂

If I solved your problem, please hit the solution button
Kuelah
Entdecker
26 0 6

Hi @HansimGlück 

 

vielen Dank für deine Rückmeldung und die Tipps, die du zur Verfügung gestellt hast 😊.


Ich bin alle Optionen durchgegangen, muss aber leider sagen, dass ich weiterhin den Fehler nicht beheben konnte…

 

Zu 1:  Ich bin die CSS-Stile durchgegangen und mir auch die Codes angeschaut, mit dem ich den Header verändert hab. Aber nachdem ich alle Codes rausgenommen hatte, ist der Fehler weiterhin da. Das kann ich ausschließen.

 

Zu 2: Den Punkt kann ich nicht ganz nachvollziehen. Was ist damit genau gemeint?

 

Zu 3: Gesucht und leider nichts gefunden.

 

Zu 4: Konnt ich auch nichts finden.

 

Zu 5: Taucht bei allen Browsern auf.

 

Welche Codes würdest du genau benötigen, um mir eventuell weiterhelfen zu können?

 

Schonmal vielen Dank für deiner bisherige Unterstützung:).

 

HansimGlück
Shopify Partner
28 3 11

Hallo @Kuelah 

schade, dass die ersten Tipps noch nicht zum Erfolg geführt haben. Aber kein Grund zur Sorge, wir kriegen das schon hin!

Zu 2: Mit "Media Queries" sind spezielle CSS-Anweisungen gemeint, die dafür sorgen, dass sich das Design deiner Seite an verschiedene Bildschirmgrößen anpasst. Wenn du z.B. eine Regel hast, die besagt, dass die Schriftgröße bei Bildschirmen unter 600px Breite kleiner werden soll, dann ist das eine Media Query. Falls du dich nicht erinnerst, sowas eingestellt zu haben, dann könnten solche Anpassungen auch durch ein Theme oder Plugin kommen. Ein Tipp am Rande: Manchmal kann es auch helfen, die verwendeten Plugins nacheinander zu deaktivieren und nach jeder Deaktivierung zu prüfen, ob das Problem weiterhin besteht.

 

Falls das nichts bringt, bräuchte ich folgende Codes:

  1. HTML-Struktur: Den Teil deines HTML-Codes, der den Header und die umgebenden Elemente betrifft.
  2. CSS: Alle relevanten CSS-Stile für den Header.

Ich bin gespannt auf deine Antwort und hoffe, dass wir das Problem bald gelöst haben! 

If I solved your problem, please hit the solution button
Kuelah
Entdecker
26 0 6

Hallo @HansimGlück 

 

vielen Dank für deine Rückantwort.

 

Ich habe teils positive Neuigkeiten. Ich habe den Code gefunden, der diesen Fehler auslöst, dass sich der Header auf bestimmten Seiten nach unten verschiebt.

 

Ich habe mir die Mühe gemacht und mit einem komplett neuen DAWN Theme angefangen und jeweils alle Codes Stück für Stück gemappt und probiert, wann der Fehler aufkommt. Mühselig aber erfolgreich.

 

Die etwas weniger gute Nachricht. Der Code der scheinbar diesen Fehler auslöst ist ein Code im theme.liquid, welches unseren Cookie Consent auf unserer Homepage abdeckt. Ein Balken (Pop-Up) wo man den Cookies zustimmen oder ablehnen kann. 

 

Mich wundert es aber sehr, dass dieser Code einen derartigen Fehler auslöst. Der Code sieht wie folgt aus. 

    <script type="text/javascript" data-cmp-ab="1" src="https://cdn.consentmanager.net/delivery/autoblocking/????????.js" data-cmp-host="c.delivery.consentmanager.net" data-cmp-cdn="cdn.consentmanager.net" data-cmp-codesrc="1"></script>

 (Habe paar Zahlen durch Fragezeichen ersetzt)

 

Ich mach mich mal auf die Suche nach einem anderen Anbieter oder frage bei dem Support dort mal nach. Sehr komisch jedenfall...

 

Ich bedanke mich sehr für deine Tipps bisher und deine Unterstützung.