WordPress Browser Extension : masquer l’admin bar et tester vos sites
La barre d’administration facilite l’accès au tableau de bord et à l’éditeur, mais elle modifie aussi le viewport affiché. L’extension officielle WordPress Browser Extension la masque sans vous priver de ses raccourcis, puis ajoute des outils de test directement dans le navigateur.
Disponible pour Google Chrome et les navigateurs fondés sur Chromium dans le Chrome Web Store, elle est aussi proposée pour Safari sous macOS dans le Mac App Store. Son code source est disponible dans le dépôt WordPress/browser-extension.
Masquer la barre d’administration sans perdre les raccourcis
Lorsque vous êtes connecté à WordPress, la barre d’administration apparaît en haut de chaque page. Elle conserve le tableau de bord, l’éditeur et votre profil à portée de clic, mais elle réduit la zone visible et ne montre donc pas exactement la page telle qu’un visiteur la voit.
Cette différence peut produire des artefacts trompeurs sur les sites qui utilisent des en-têtes fixes ou des effets déclenchés par le défilement. La barre peut également devenir encombrante lorsque des extensions y ajoutent leurs propres fonctions et raccourcis. La désactiver dans les réglages de profil retire aussi tous ces raccourcis.
L’extension masque la barre sur les sites que vous choisissez, ou partout par défaut, tout en plaçant les raccourcis les plus utilisés dans la barre d’outils du navigateur. Vous réaffichez la barre complète en deux clics, sans passer par le tableau de bord.

Identifier un site WordPress et ouvrir la bonne interface
L’icône de la barre d’outils indique discrètement si le site actuellement ouvert utilise WordPress et si vous y êtes connecté. L’extension peut ainsi reconnaître WordPress au fil de votre navigation.
Sur un site que vous gérez, son menu propose un accès direct au tableau de bord ou à l’éditeur de la publication, de la page, de la taxonomie ou du modèle affiché. Lorsqu’une page repose sur un modèle, l’extension ouvre l’éditeur de site si le thème utilise des blocs.
Un lanceur enregistré localement mémorise les sites auxquels vous vous connectez. Vous pouvez donc ouvrir ces sites depuis l’extension, même lorsque vous consultez un autre domaine.
Utiliser les outils de test dans le navigateur
Certaines vérifications s’intègrent plus naturellement à une extension de navigateur qu’à une extension WordPress. WordPress Browser Extension fournit les outils suivants sur chaque site WordPress visité :
- Dessiner les contours des blocs au-dessus de la page rendue.
- Ouvrir une fenêtre d’aperçu au format téléphone.
- Recharger la page en contournant le cache.
- Effacer les cookies et le stockage local du site courant.
Ces outils évitent d’installer une extension ou un autre logiciel sur chaque site. Certaines opérations, comme l’effacement du stockage local ou le rechargement sans cache, restent par ailleurs difficiles à déclencher depuis l’intérieur du site concerné.

Conserver les données sur l’appareil
L’extension traite ces fonctions sur votre appareil. Elle lit la page ouverte pour déterminer son contexte et interroge le site uniquement lorsque le contenu de la page ne suffit pas.
Vos préférences et la liste des sites auxquels vous vous êtes connecté restent dans le navigateur. L’extension n’envoie ces données vers aucun autre service et n’intègre ni suivi ni analytique.
Installer l’extension et l’intégrer aux vérifications
Installez l’extension depuis le store correspondant à votre navigateur, connectez-vous à vos sites WordPress, puis ouvrez son menu sur une page à contrôler. Masquez la barre d’administration pour vérifier le viewport réel, accédez à l’éditeur de l’élément affiché et activez les outils de test selon votre besoin.
Le projet, d’abord développé indépendamment, fait désormais partie des projets officiels WordPress. Consultez son dépôt GitHub pour suivre son développement, signaler un bug ou proposer une pull request.
Références / Sources
Camille Dubois
Rédactrice en chef de l'équipe française, experte Symfony et Laravel. Je suis convaincue que le code élégant et la bonne documentation vont de pair.
Tous les articles