Kurze Information in eigener Sache: Ich habe gerade in WordPress eine kurze Anpassung vorgenommen, durch die Kommentare beim Aufruf von Kommentarlinks in Chromium-Browsern korrekt im Browserfenster angezeigt werden.
Was ist das Problem?
Mir ist in letzter Zeit aufgefallen, dass Kommentarlinks beim Aufruf im Ungoogled Chrome nicht immer korrekt im Browser angezeigt wurden. Man musste etwas nach unten scrollen, um den Kommentar im Browserfenster zu sehen. Habe ich dann den Kommentarlink im URL-Feld erneut eingegeben, wurde der Kommentar direkt angezeigt. Ich hatte ein Plugin in Verdacht, habe aber eine andere Erklärung per Internet bekommen.
Das Problem, das du beschreibst, ist sehr häufig bei modernen WordPress-Seiten und hat fast immer denselben Grund:
Der Permalink zum Kommentar (z. B. https://deine-seite.de/mein-beitrag/#comment-12345) scrollt nicht exakt zum Kommentar, sondern der Kommentar liegt etwas tiefer im Viewport – meistens genau um die Höhe des sticky / fixed Headers (also der Navigation, die beim Scrollen oben kleben bleibt).
Beim ersten Aufruf des Links springt der Browser zum Element mit id="comment-12345", aber der sticky Header überdeckt den oberen Teil → man muss manuell nachscrollen.
Klickt man danach nochmal auf denselben Link (oder auf „Link zum Kommentar" im Kommentar selbst), macht Chrome einen sanften Scroll und korrigiert die Position etwas besser. Alles sieht plötzlich „korrekt" aus.
Das ist kein Bug von WordPress selbst, sondern ein klassisches CSS- / Browser-Verhalten bei fixed/sticky Elementen oben.
Im Firefox habe ich das Problem nicht, aber im Ungoogled nervt es micht derzeit.
Eine CSS-Korrektur
Klang nachvollziehbar, und ich habe nun im IT-Blog hier versuchsweise einen "quick and dirty"-Hack in Form einer zusätzlichen CSS-Anweisung:
/* wegen Kommentar springen */
.comment {
scroll-margin-top: 180px;
}
eingefügt. Bei mir funktionierte das im Kurztest. Falls es euch aber was in den Kommentaranzeigen zerschlägt, gebt Rückmeldung – dann nehme ich die Korrektur wieder raus. Danke.
Update: Hab die Korrektur wieder rausgenommen – es liegt an den QMN-Anzeigen, werde den Anbieter diesbezüglich kontaktieren – siehe auch die folgenden Kommentare.
MVP: 2013 – 2016
Dieses Blog hat keinen fixed/sticky Header, diese Erklärung im Text trifft nicht zu.
Mal mit deaktivierter Werbung testen..
Ist ein guter Einwand – war auch hier im Hinterkopf. Der sticky header kommt imho durch die Webeanzeige (das macht QMN) – und ich teste gelegentlich auch diese Baustelle. Aktuell geht es mir darum, ob der Fix meine Beobachtung behebt oder nicht. Ich kann die Anweisung binnen einer Minute wieder deaktivieren. Danke für's Feedback.
Basteln an der falschen Stelle, Bugreport an Ungoogled Chrome. Alternativ an den Webeanzeigenanbieter.
Problem ist hier ohne Ungoogled Chrome nicht nachvollziehbar.
Generell scheint der Code den falschen Ansatz zu wählen, da er sich auf jeden einzelnen Kommentar bezieht, statt ggf. auf den Kommentarbereich als solches, falls der durch Werbeanzeigen verrutschen sollte, wobei das wie gesagt kein WordPress CSS Problem ist und man hier einen Edgecase behandeln will, der nicht von WordPress verursacht wird.
Ich habe jetzt parallel zu einigen anderen Aktivitäten deinen Hinweis beherzigt und schnell getestet. Mein Hack ist wieder raus – ich werde QMN als Werbeanbieter kontaktieren. Die haben imho in den letzten zwei Wochen was an ihren CSS umgestellt, was den Effekt verursacht. Danke für die gedankliche Anregung. Und Ja, im Firefox habe ich dieses "springen des Viewport" nicht.