Barre supérieure WordPress et ma barre supérieure et IE9

Publié par Jean-Michel le

j’ai ajouté ma fonctionnalité css sur certaines div dans header.php afin de créer ma propre barre supérieure sur le thème wordpress maintenant je suis confronté à un seul problème que la barre supérieure wordpress apparaît sur chrome mais pas sur IE9 et j’ai codé le css en conséquence par réglage du haut=28 ; qui fonctionnent parfaitement sur chrome car la barre supérieure WP y apparaît mais pas sur IE9 car la barre supérieure du tableau de bord wordpress n’y apparaît pas et l’espace supérieur supplémentaire de 28 ; apparaît

veuillez me faire savoir comment puis-je le réparer afin qu’il fonctionne parfaitement sur les deux navigateurs

Solution n°1 trouvée

La barre supérieure de WordPress apparaît si vous êtes connecté à votre panneau d’administration WordPress. Essayez de vous connecter sur IE9 et vous verrez la barre d’administration. De plus, la barre d’administration utilise CSS avec l’attribut !important. Mais vous n’avez pas à vous inquiéter car cette barre ne sera pas visible pour les visiteurs de votre site.

Ce bar m’a fait perdre beaucoup de temps lorsque je travaillais pour la première fois sur le thème WordPress. Vous devez concevoir votre thème en gardant à l’esprit qu’il n’y a pas une telle barre, c’est-à-dire top = 0 (peut-être le vérifier dans un autre navigateur où vous n’êtes pas connecté au panneau d’administration pour voir la vraie image)

Solution n°2 trouvée

Vous pouvez styliser conditionnellement votre barre supérieure, que la barre d’administration de WordPress soit affichée ou non.
Vérifiez avec Firebug ou simplement le code source de votre page, vous verrez que WP ajoute une classe admin-barsur l’ bodyélément. Et .logged-inaussi mais je suppose que celui-ci apparaîtra que la barre d’administration WP soit affichée ou non.

Vous pouvez ensuite styliser votre barre supérieure pour vos visiteurs et pour vous-même, par exemple :

.softgenic-bar {
    position: fixed;
    top: 0;
    left: 0;
    color: white;
    background: black;
}
.admin-bar .softgenic-bar {
    top: auto;
    bottom: 0;
    background: darkred;
}

N’oubliez pas d’ajouter/supprimer le rembourrage et la marge en conséquence si vous positionnez votre barre complètement ailleurs.
Vous pouvez aussi décider de positionner votre bar en absolu pour vous et en fixe pour vos visiteurs. Ou masquez-le s’il n’est pas pertinent pour vous, cela dépend entièrement de son contenu (vous n’avez pas besoin de vous inscrire à votre propre newsletter par exemple ^^ mais les outils de dessin dans une application doivent toujours être affichés)

Catégories : Wordpress

Jean-Michel

Jean-Michel est en charge de la partie blog du site. Il met en place la stratégie de contenu et répond aux questions fréquentes sur Wordpress.

0 commentaire

Laisser un commentaire

Avatar placeholder

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *