Twentyeleven complètement barré

L’autre jour, j’ai découvert que les articles seuls du thème par défaut de wordpress, twentyeleven, ne possédait pas de barre verticale droite? Quelle honte! Voici comment y remédier.

Tout d’abord, allez chercher le fichier single.php du thème, et éditez-le. Tout à la fin, vous devriez trouver :

</div><!-- #primary -->
<?php get_footer(); ?>

Vous y êtes? Parfait. Maintenant rajoutez <?php get_sidebar(); ?> comme ça :

</div><!-- #primary -->
<?php get_sidebar(); ?>
<?php get_footer(); ?>

On y est presque. Plus que quelques modifications CSS :

/*Sans déclaration explicite de margin, on hérite d'une valeur de "0", qui ne donne pas d'espace pour une colonne droite*/
.singular #primary {
	margin: 0 -26.4% 0 0;
}
/* Ceci cache les liens "précédent" et "suivant" en haut de la page, au lieu de le faire en php*/
#nav-single {
	display: none;
}
/*Sans déclaration explicite de position, on hérite d'une position absolute*/
.singular .entry-header .entry-meta {
	position: relative;
}
/*Sans déclaration explicite de padding, on hérite d'un padding-top de "4.875em", qui ajoute trop d'espace en haut*/
.singular .hentry {
	padding: 0;
}
/*Sans déclaration explicite de largeur, on hérite d'un width de "68.9%"*/
.singular .entry-header, .singular .entry-content, .singular footer.entry-meta, .singular #comments-title {
	width: 100%;
}
/*Sans déclaration explicite de margin , on hérite d'un margin-left et margin-right de "7.6%", ce qui fait se superposer le contenu à la barre de droite*/
.singular #content, .left-sidebar.singular #content {
	margin: 0 34% 0 7.6%;
}
/*Sans déclaration explicite de padding, on hérite d'un padding-top de "15px", qui ajoute trop d'espace en haut*/
.singular article .entry-title {
	padding-top: 0;
}
/*Pour le fun, on déplace ailleurs le lien "Edit" pour les admin*/
.singular .entry-meta .edit-link a {
	right: 0;
	top: 0;
	left: auto;
}

Voilà, nous y sommes. Copiez-collez le CSS à la fin de la feuille de style et tout sera OK. N’hésitez pas à demander, si ça ne marchait pas au top pour vous !

Laisser un commentaire

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