Comment modifier un thème wordpress ?

Autant je prend plaisir à améliorer le référencement de mon blog, autant j’ai d’énormes difficultés pour modifier un thème wordpress à mon goût. Je suis parti d’un thème à la base qui me paraissait simple : Le thème Big Brain francisé par notre grand spécialiste, wordpress tuto. Mais que j’ai honte, mon blog ne ressemble pas à grand chose, et je m’enlise peu à peu dans le CSS et le HTML machin chouette. Si une âme charitable pouvait m’aider, pour me remettre un peu d’ordre, ça serait pas mal
Ps : suite à cet article, j’ai commencé à consacrer une série d’articles à ce sujet. Les voici :
Si cet article vous a plu,
n'hésitez pas à vous abonner au
blog
















A 11 ans (1984), j’ai eu un ZX 81, puis à 12, un
Amstrad CPC 464. Puis pendant des années plus rien
jusqu’en 1999, lorsque le web s’est
démocratisé. Et puis récemment,
j’ai découvert la plate-forme de blogging,
Wordpress. Je blogue principalement autour du Web 2.0, vous fait part
de mes découvertes et de mes réflexions.
A quel stade en es tu ? As-tu installé wordpress en local sur ton PC ?
Une fois que c’est fait, le mieux à mon avis est de commencer à modifier des choses très simples dans la feuille de style (fichier .CSS), comme les couleurs (”background” pour la couleur de fond, “color” pour la couleur du texte), afin de comprendre un peu comment ça fonctionne…
Bonjour Grr,
Je fais la manip de ma feuille de style direct sur l’admin wordpress. Pour les couleurs, je vois à peu près. C’est surtout l’agencement. Par exemple, je suis embêté avec le sous-titre de mon blog, j’aimerai qu’il soit un peu plus haut.
Ouch c’est quand même un sacré bordel ce fichier CSS !! En tout cas si on parle bien du même : http://blogityourself.net/wp-content/themes/bigbrain-fr/style.css
Est-ce que si tu mets le header a une hauteur plus importante, par exemple :
#header { width: 917px; height: 80px; margin: 0 auto;
à la place de
#header { width: 917px; height: 50px; margin: 0 auto;
est-ce que ça améliore pas les choses ?
C’est bien ce fichier CSS et c’est carrément le bordel !
J’ai fais la modif et ça marche ! merci beaucoup! Si tas d’autres conseils, je suis très preneur
Ah bah c’est déjà ça ;o)
Je ne sais pas comment le fichier apparaît dans wordpress, mais par contre en le regardant en ligne il est très très moche, donc déjà ce que je ferais c’est ranger un peu tout ça. Par exemple avec quelques retours à la ligne pour avoir
#logo h1 a {
color: #000000;
}
#logo h2 {
float: left;
padding: -60px 0 0 40px;
font-size: 30;
border: none;
}
A la place de l’actuel :
#logo h1 a { color: #000000; } #logo h2 { float: left; padding: -60px
0 0 40px; font-size: 30; border: none; }
Déjà c’est plus compréhensible !
Sinon le mieux pour commencer c’est de trifouiller un peu pour voir ce que ça fait, et comprendre le fonctionnement d’une feuille de style CSS.
Par exemple comprendre que si tu définis un style “logo” il sera valable pour tout ce qui est entre des balises “div id=logo”.
Mais que si tu définis en plus un style “logo a” cela ne concernera que les liens (balise ) qui sont dans un “div id=logo”… C’est “en cascade”, d’où le “C” de CSS !
Un bon truc pour voir à quoi tu touches c’est de mettre des bordures (que tu enlèveras après en mettant 0px) dans un élément, par exemple :
#logo h2 {
float: left;
padding: -60px 0 0 40px;
font-size: 30;
border: 1px solid red; /* bordure */
}
Ça permet de voir sur la page quels éléments sont concernés…
Après il y a des sites comme http://css.alsacreations.com/ qui expliquent pas mal de choses sur les CSS.
Autre possibilité : tout simplement enregistrer une page d’un site que tu trouves bien, avec sa feuille de style, et trifouiller tout ça pour voir.
Il faut aussi bien comprendre que les styles CSS te permettront de présenter ton site comme tu veux (disposition, couleurs, polices…),
mais que tout ce qui est “contenu” (nombre de billets affichés dans la page d’accueil par exemple) est du domaine de wordpress.
Mierda mon commentaire est complètement parti en live !!
Au lieu de (balise) il fallait lire (balise “a”) mais il m’a transformé ça en vrai lien de 20 lignes !!
Ok merci je vais faire du rangement, histoire d’y voir plus clair
Je vais partir sur ce theme de base