{"id":48,"date":"2026-05-28T22:18:15","date_gmt":"2026-05-28T22:18:15","guid":{"rendered":"http:\/\/idfix.local\/comment-supprimer-la-barre-dadministration-wordpress-en-front-end\/"},"modified":"2026-05-28T22:18:15","modified_gmt":"2026-05-28T22:18:15","slug":"supprimer-la-barre-dadministration-wordpress-en-front-end","status":"publish","type":"post","link":"https:\/\/idfix.farfadet.io\/index.php\/2026\/05\/28\/supprimer-la-barre-dadministration-wordpress-en-front-end\/","title":{"rendered":"Supprimer la barre d&rsquo;administration WordPress en front-end"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Si tu d\u00e9veloppes ou g\u00e8res un site WordPress, tu as s\u00fbrement remarqu\u00e9 cette barre noire en haut de ton site lorsque tu es connect\u00e9. C&rsquo;est la <strong>barre d&rsquo;administration WordPress<\/strong> (WordPress Admin Bar). Elle est pratique pour naviguer rapidement vers le back-office, mais sur un site en production ou un th\u00e8me custom, elle peut g\u00eaner visuellement \u2014 surtout quand tu travailles sur le design.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Pourquoi supprimer la barre admin WordPress ?<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Elle casse le design de ton header ou navigation custom<\/li>\n<li>Elle ajoute un <code>margin-top: 32px<\/code> automatique au <code>&lt;body&gt;<\/code> qui peut d\u00e9caler tout ton layout<\/li>\n<li>Elle expose que ton site tourne sur WordPress (s\u00e9curit\u00e9)<\/li>\n<li>Sur mobile elle prend de la place inutilement<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">M\u00e9thode 1 \u2014 Via functions.php (recommand\u00e9e)<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">La m\u00e9thode la plus propre. Ajoute cette ligne dans le fichier <code>functions.php<\/code> de ton th\u00e8me enfant ou directement dans ton th\u00e8me :<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ Masquer la barre admin WordPress en front-end\nadd_filter( 'show_admin_bar', '__return_false' );<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u26a0\ufe0f Cette ligne masque la barre uniquement sur le <strong>front-end<\/strong> (ce que voient les visiteurs). Le back-office (<code>\/wp-admin\/<\/code>) reste intact.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">M\u00e9thode 2 \u2014 Via CSS (masquage visuel)<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Si tu pr\u00e9f\u00e8res juste la masquer visuellement sans d\u00e9sactiver la fonctionnalit\u00e9 :<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/* Masquer la barre admin en CSS *\/\n#wpadminbar {\n    display: none !important;\n}\n\nhtml {\n    margin-top: 0 !important;\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u26a0\ufe0f Cette m\u00e9thode est moins propre car WordPress ajoute quand m\u00eame les scripts et styles de la barre admin.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">M\u00e9thode 3 \u2014 Selon le r\u00f4le utilisateur<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Si tu veux la masquer uniquement pour les abonn\u00e9s (subscribers) mais la garder pour les admins :<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>add_filter( 'show_admin_bar', function( $show ) {\n    if ( current_user_can( 'administrator' ) ) {\n        return $show; \/\/ Admin = barre visible\n    }\n    return false; \/\/ Autres r\u00f4les = barre masqu\u00e9e\n} );<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">M\u00e9thode 4 \u2014 Via un plugin<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Si tu ne veux pas toucher au code, le plugin <strong>Remove Admin Bar<\/strong> ou <strong>WP Hide Admin Bar<\/strong> font \u00e7a en un clic depuis <code>Extensions > Ajouter<\/code>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Quelle m\u00e9thode choisir ?<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>M\u00e9thode<\/th><th>Propre<\/th><th>Performance<\/th><th>Complexit\u00e9<\/th><\/tr><\/thead><tbody><tr><td>functions.php<\/td><td>\u2705 Oui<\/td><td>\u2705 Optimal<\/td><td>\u2b50 Facile<\/td><\/tr><tr><td>CSS<\/td><td>\u26a0\ufe0f Non<\/td><td>\u274c Scripts charg\u00e9s quand m\u00eame<\/td><td>\u2b50 Facile<\/td><\/tr><tr><td>Par r\u00f4le<\/td><td>\u2705 Oui<\/td><td>\u2705 Optimal<\/td><td>\u2b50\u2b50 Moyen<\/td><\/tr><tr><td>Plugin<\/td><td>\u2705 Oui<\/td><td>\u26a0\ufe0f Plugin suppl\u00e9mentaire<\/td><td>\u2b50 Facile<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Mon choix pour Idfix :<\/strong> la m\u00e9thode 1 via <code>functions.php<\/code>. Une ligne, z\u00e9ro plugin, z\u00e9ro CSS en trop. C&rsquo;est la fa\u00e7on dont j&rsquo;ai supprim\u00e9 la barre sur ce site.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>La barre admin WordPress peut g\u00eaner ton design. Voici 4 m\u00e9thodes pour la supprimer proprement \u2014 dont celle que j&rsquo;utilise sur ce site.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"wpai_meta_description":"","footnotes":""},"categories":[3],"tags":[4,14,16,29,30,34],"class_list":["post-48","post","type-post","status-publish","format-standard","hentry","category-wordpress","tag-admin-bar","tag-developpement","tag-functions-php","tag-theme","tag-tuto","tag-wordpress"],"_links":{"self":[{"href":"https:\/\/idfix.farfadet.io\/index.php\/wp-json\/wp\/v2\/posts\/48","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/idfix.farfadet.io\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/idfix.farfadet.io\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/idfix.farfadet.io\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/idfix.farfadet.io\/index.php\/wp-json\/wp\/v2\/comments?post=48"}],"version-history":[{"count":0,"href":"https:\/\/idfix.farfadet.io\/index.php\/wp-json\/wp\/v2\/posts\/48\/revisions"}],"wp:attachment":[{"href":"https:\/\/idfix.farfadet.io\/index.php\/wp-json\/wp\/v2\/media?parent=48"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/idfix.farfadet.io\/index.php\/wp-json\/wp\/v2\/categories?post=48"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/idfix.farfadet.io\/index.php\/wp-json\/wp\/v2\/tags?post=48"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}