[Tuto] Dimensionnement Sidebar automatique WordPress

Comme vous le savez surement déjà, je suis assez chiant et perfectionniste sur le blog, comme dans la vie de tous les jours 😀
Et j’avais un élément de design qui ne me convenait pas et je ne trouvais pas de réponse sur les forums officiels WordPress, car il semblerait que c’était « impossible » et pourtant j’ai trouvé la solution après de nombreuses heures de recherche.
Le problème en question concernait la « Sidebar » du site, c’est-à-dire le menu que vous voyiez à droite.
Celle-ci avait une longueur définit en fonction du contenu et elle ne descendait pas jusqu’au « footer » (pied de page) du coup j’avais trouvé une petite ruse en lui donnant une valeur fixe.
Malheureusement, c’était qu’un bricolage avant que je ne trouve définitivement la solution et que mon design soit parfait 😀

Comme de nombreuses personnes cherchaient une solution sans avoir de réponse, je vais vous la donner ici.
Pour que la Sidebar descende jusqu’au footer, il faut changer quelques valeurs CSS.

Par exemple pour mon blog, avec le thème Mystique modifié voilà comment procéder pour ajouter un CSS perso.

D’abord vous rendre sur votre panneau d’administrateur.
Ensuite, aller sur : Apparence -> Paramètre de Mystique (je pense que sur tous les thèmes vous devez l’avoir) -> CSS de l’utilisateur (en haut de la page)

À partir d’ici, tout ce que vous entrez comme valeur CSS sera lu et exécuté en priorité sur le « Style.css »
Puis il vous suffira de mettre:

#sidebar {
position: absolute; /* Positionnement de la sidebar */
background-color: #e6e6e6; /* Couleur de fond de votre sidebar */
background-image:url(« http://www.experience2geek.com/bg-sidebar.jpg »); /* Image de votre sidebar */
background-repeat: repeat-y; /* Répétition de l’image */
height: 100%; /* la hauteur de votre sidebar se règle automatiquement par rapporte au footer */
}

Puis il vous suffira d’enregistrer votre travail et regarder le résultat 😀

J’espère que ça en aidera quelques-uns 😉

* Toute reproduction est interdite sans mon accord *

6 réflexions au sujet de “[Tuto] Dimensionnement Sidebar automatique WordPress”

  1. Salut à toi, j’ai essayé ton code mais je possède la version 3 de mystique et je n’arrive pas à faire de séparation visible entre la sidebar et le contenu comme toi, aurais-tu une solution?

    MErci

  2. ton post m’aide bcp! j’ai fait comme tu as dit mais il me reste un espace blanc entre mon contenu et mon sidebar.. sais-tu comment je peux résoudre ça?

Laisser un commentaire

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.