Für Ihre functions.php-Datei
add_action('get_header', 'my_filter_head');
function my_filter_head() {
remove_action('wp_head', '_admin_bar_bump_cb');
}
Standardmäßig wird, wenn Sie die Admin-Leiste als angemeldeter WordPress-Benutzer sehen, CSS wie dieses in Ihren Kopf eingefügt (Ausgabe in der wp_head() Funktion)
<style type="text/css" media="screen">
html { margin-top: 28px !important; }
* html body { margin-top: 28px !important; }
</style>
Das ist normalerweise eine gute Sache, da es dann nicht Teile Ihrer Website mit seiner Fixed-Position-Eigenschaft verdeckt. Aber es kann auch seltsam sein, wenn Sie absolute Positionierung für Dinge verwenden. Da diese unterschiedlich sein werden, je nachdem, ob die Leiste vorhanden ist oder nicht. Die Verwendung des obigen Codes, um das Bump-CSS zu entfernen, lässt die Leiste den oberen Teil Ihrer Website abdecken, aber zumindest wird die Positionierung konsistent sein.
Ich hasse wirklich WordPress
Danke :)
Hey
Bedeutet das, dass die Admin-Leiste weiterhin für angemeldete Benutzer angezeigt wird, aber die ersten 28px überlagert, anstatt sie nach unten zu schieben?
In Verbindung mit diesem Code könnten Sie die Admin-Leiste für Administratoren anzeigen und sie für alle anderen (Abonnenten usw.) ausblenden.
Sie haben gerade eine meiner Nervensägen gelöst! Danke
Das hat bei mir nicht funktioniert
Funktioniert nicht in der neuesten WordPress-Version.
Versuchen Sie, dies zwischen und in Ihrem Theme einzufügen.
html { margin-top: 0px !important; }
* html body { margin-top: 0px !important; }
@media screen and ( max-width: 782px ) {
html { margin-top: 0px !important; }
* html body { margin-top: 0px !important; }
}
Es funktioniert für mich. :)
zwischen den Head-Tags in Ihrem Header Ihres Themes.
Haben wir eine 2014er-Version, wie man den Push Down stoppt? Ich möchte Rys Lösung nicht verwenden, weil das bedeutet, dass es doppelte, widersprüchliche Codes gibt. Ich bin sicher, das ist keine W3C-Lösung – und HABEN SIE DIESEN CROSS-BROWSER-TEST GEMACHT?? Ryu, ich schaue dich an. Ich liebe deine Arbeit, Chris – irgendwelche Ideen für eine Funktion, die den Push Down in 3.8.1 entfernt?? Ich benutze Roots, also versuche ich, so prägnant wie möglich zu bleiben, wissen Sie?
Hier ist die Version für WP 3.8.x und höher.
...und das ist alles :)
So wahr :D
Danke für diese.
Held :)
Vielen Dank!! Konnte es nicht lösen, aber mit dem PHP-Snippet in functions.php hat es perfekt funktioniert (und mit WP 4.0)! Großartig
Vielleicht bin ich zu simpel, aber Sie können die Admin-Leiste auch über Ihr Benutzerprofil deaktivieren, wenn Sie angemeldet sind.
Ich merke, dass ich ziemlich spät zu dieser Party komme, aber es ist immer noch ein echtes Problem. Ich neige dazu, mein gesamtes Markup in eine '.wrapper' zu packen, die
position:relative;sein kann, was alle absolut positionierten Dinge erledigt. Dann habe ich einen SASS-Mixin, der überall helfen kann, wo Sieposition:fixedoder Ähnliches verwenden.Ich hoffe, das hilft jemandem. Ich habe auch einen Gist für einfache Wiederverwendung erstellt.
Die Lösung für mich war
add_theme_support( 'admin-bar', array( 'callback' => '__return_false' ) );in der functions-DateiDanke Mike. Ihr Code hat das leere Layout der Admin-Leiste, das ganz oben auf meiner Website erscheint, entfernt...
Ich lasse mich korrigieren, aber gibt es nicht eine Klasse, die WordPress dem Body-Tag hinzufügt? Zum Beispiel, wenn Sie einen Sticky-Header haben, der vom Admin-Panel verdeckt wird, verwenden Sie einfach das folgende CSS...
…
.my-sticky-header {
top: 0px;
}
.admin-bar .my-sticky-header {
top: 32px;
}
…
Wenn admin-bar true ist, wird Ihr Sticky-Header um 32px nach unten verschoben.
Ciarán
Ciar4ns Lösung hat für mich und mein Sticky-Banner funktioniert. So einfach – danke!
Das hat für mich funktioniert, danke
Großartig! Das hat uns viel Zeit gespart!
Beste Grüße
Funktionierte bei mir in der Aktion 'admin_bar_init'.
Mikes Lösung hat für mich auf 4.2.2 funktioniert. Danke!
Ich verwende Bootstrap in einem Theme mit Sticky-Header/Footer und hatte dieses Problem. Ich habe einen Hook erstellt, den ich zu meiner functions.php-Datei hinzufügen kann. Er funktioniert, indem er den Margin vom HTML entfernt und dem Body-Tag unter dem Media-Query-Bereich einen Top-Padding hinzufügt. Ich habe ihn nicht außerhalb von Bootstrap getestet.
Ich war so begeistert von dieser Lösung, dass ich vergessen habe, sie ohne die Admin-Leiste zu testen. Auf der Grundlage der Padding-Korrektur. Ignorieren Sie das Obige, da es oben einen Abstand lässt, wenn Sie nicht angemeldet sind. Hier ist meine neue Lösung.
Zu functions.php hinzufügen
Zum style.css (oder Theme-Style) hinzufügen
Funktioniert bei mir. Danke! Ich habe Zeit damit verbracht, nach dem CSS-Code zu suchen, aber das hat mein Problem in einer Minute gelöst!
Ryan, danke! Ihre Lösung funktioniert perfekt!
Dies funktioniert für mich, Sie müssen der Aktion nur die geringste Priorität geben.
Hier ist meine schnelle Lösung. für 4.4.2
In meinem Fall habe ich einen Fixed-Header, sodass der Inhalt darunter scrollt. Und natürlich ist die Admin-Leiste ein Fixed-Header, und diese Leiste überlappt meinen Header-Container. Also habe ich einen einfachen PHP-Code hinzugefügt, um eine ID anzuzeigen, wenn Sie angemeldet sind. Dann verwenden Sie top:32px;, um den Header-Container nach unten zu verschieben, wenn die Admin-Leiste angezeigt wird. Hier ist der Code. (Beachten Sie, dass dieser PHP-Code überall platziert werden kann, nicht nur in Header-Tags)
<
header >
also wenn nicht angemeldet, sehen Sie
<
header >
wenn angemeldet, sehen Sie
<
header id=”adminbarfix”>
Fügen Sie dann einfach dieses CSS entweder wie folgt über dem Tag hinzu
#adminbarfix {top:32px;}
oder in Ihrem styles.css Sheet wie folgt
#adminbarfix {top:32px;}
Natürlich können Sie auch Klassen anstelle von IDs verwenden. Sie können diesen Code für andere coole Dinge verwenden, wenn Sie angemeldet sind :) Hoffe, das hilft.
Bitte löschen Sie meinen letzten Kommentar, da ich ihn nicht korrekt geschrieben habe
Hier ist meine schnelle Lösung. für 4.4.2
In meinem Fall habe ich einen Fixed-Header, sodass der Inhalt darunter scrollt. Und natürlich ist die Admin-Leiste ein Fixed-Header, und diese Leiste überlappt meinen Header-Container. Also habe ich einen einfachen PHP-Code hinzugefügt, um eine ID anzuzeigen, wenn Sie angemeldet sind. Dann verwenden Sie top:32px;, um den Header-Container nach unten zu verschieben, wenn die Admin-Leiste angezeigt wird. Hier ist der Code. (Beachten Sie, dass dieser PHP-Code überall platziert werden kann, nicht nur in Header-Tags)
also wenn nicht angemeldet, sehen Sie
wenn angemeldet, sehen Sie
Fügen Sie dann einfach dieses CSS entweder wie folgt über dem Tag hinzu
oder in Ihrem styles.css Sheet wie folgt
Natürlich können Sie auch Klassen anstelle von IDs verwenden. Sie können diesen Code für andere coole Dinge verwenden, wenn Sie angemeldet sind :) Hoffe, das hilft.
Danke Ryan! Du hast meinen Tag gerettet. Dein zweiter Vorschlag funktioniert perfekt.
Die korrekte Antwort für die aktuelle WordPress-Version 4.6.1
Sie könnten einfach einen CSS-Selektor zum HTML-Element hinzufügen. Ich habe es nur in FireFox getestet. Fügen Sie dies zu Ihrer styles.css in Ihrem Theme hinzu
html:first-of-type {margin-top:0 !important;}#wpadminbar {margin-top:-32px;}
Wenn Sie die Admin-Leiste in eine ausklappbare Leiste verwandeln möchten (lässt eine 1-Pixel-Linie zum Überfahren und Ausklappen der Admin-Leiste übrig), z. B. wenn Sie Themes und Plugins entwickeln.
html:first-of-type {margin-top:0 !important;}#wpadminbar {margin-top:-31px;}
#wpadminbar:hover {margin-top: 0;}
#wpadminbar {
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
Sie könnten dies einfach nach Ihrem öffnenden Body-Tag (in header.php) hinzufügen, um alles nach unten zu schieben und sicherzustellen, dass nichts von der Admin-Leiste abgedeckt wird.
<?php if ( is_admin_bar_showing() ) echo '<style>header {position:relative;top:0;}</style>'; ?>
Es gibt eine viel einfachere Lösung, die die Admin-Leiste ausblendet und das CSS in neueren WordPress-Versionen (derzeit 5.2.1) entfernt. Hier ist sie, fügen Sie dies in
functions.phpIhres Themes einDas hat bei mir aufgehört zu funktionieren (ungefähr ab WordPress 5, vielleicht?) und ich habe bei der Suche nach
_admin_bar_bump_cbfestgestellt, dass der Quellcode für die WP Admin Bar – https://developer.wordpress.org/reference/classes/wp_admin_bar/ – einen ansonsten undokumentierten Hinweis enthält.Ich hoffe, das erspart Ihnen allen die Suche.
Ich habe mich dafür entschieden, das CSS basierend darauf anzupassen, ob die Admin-Leiste vorhanden war oder nicht, indem ich dies in den Header eingefügt habe...
#topbar{ top: px; }
html { margin-top: px !important;}
* html body { margin-top: px !important;}
Ich musste diese obere Leiste sehen können, aber ich wollte die Admin-Leiste immer noch benutzen, wenn ich wollte.