Reprenons par le commencement: ici je colle des notes de ma découverte de WordPress il y a quelques mois… La structure minimum d’un thème lambda, les tags de modèles qu’on utilise tout le temps, et les ressources auxquelles s’abonner si on veut mieux connaître tout cela.
Thème et templates
Créer SON thème de blog, c’est le premier truc qu’on puisse faire pour apprendre quand on ne sait pas vraiment coder.
Tutos pour débuter dans la création de thèmes wordpress:
http://blogityourself.net/comment-modifier-theme-wordpress/
http://www.fran6art.com/wordpress/creez-votre-theme-wordpress-de-a-a-z/
Comme expliqué dans ces articles, le thème désigne l’ensemble des fichiers requis pour l’affichage joli du contenu de la base (= styles.css, templates.php et images).
Les Templates sont les .php requis par le visiteur en fonction de la forme de sa requête: on ne les utilise pas tous en même temps:
| Url demandée par V | f° wp appelée | Template cherché | if not exist |
| mondomaine.fr | is_home() | home.php | index.php |
| mondomaine.fr/?p=3 OUmondomaine.fr/?post_title | is_single() | single.php | index.php |
| mondomaine.fr/?page_id=2 mondomaine.fr/?page_title |
is_page() | leNomDeMaPage.php | page.php >> index.php |
| mondomaine.fr/?cat=2 mondomaine.fr/?category/title |
is_category() | category-2.php >> category.php | archive.php >> index.php |
| mondomaine.fr/?author=2 mondomaine.fr/?author/name |
is_author() | author.php | archive.php >> index.php |
| mondomaine.fr/?m=2009 | is_date(), is_year(), is_month(), is_day(), is_time() | date.php | archive.php >> index.php |
| mondomaine.fr/?s=recherche | is_search() | search.php | index.php |
| mondomaine.fr/?NimporteKoi | is_404() | 404.php | index.php |
On commencera donc avec le seul qui soit vraiment indispensable:
Index.php qui appelle (via <?php get) deux autres fichiers qu’on sépare du reste de la page car ils seront appelés par tous les templates ( sauf si get header1 // header2 // …etc…):
- header.php –> DOCTYPE, HEAD, META, <body> + svt un peu de menus.
- footer.php –> credits, google analytics, </body>
Entre ces deux appels, tout se passe dans le Loop WordPress; ça porte bien son nom, ça se repère aux conditions:
If – while – endwhile – endif
<!-- ici l'affichage des trouvés par la boucle "tant qu'il y a des posts..." --> <h2><a href="" title=""></a></h2> <!-- par exemple -->
C’est la boucle qui construit la page demandée. On y « invoque » donc les différents attributs des posts qu’on veut voir pour chaque article (ici ligne 6).
Pour cela on se sert d’expressions prédéfinies, elles indiquent la présence de variables qui seront remplacées au moment de l’affichage par leur valeur spécifique au contenu consulté, par exemple:
the_title();— — le Titre de l’article
the_content(); — — le Contenu de l’article
the_excerpt();— — le Résumé de l’article
the_ID(); — — le numéro unique de l’article
the_time(); — — la date de publication de l’article
the_author();— — le nom de l’auteur
the_category(); — — catégorie(s) de l’article.
Liste non exhaustive, ces formules peuvent contenir des conditions (pour ne lister que certaines catégories, pour ordonner les résultats de la boucle…)
voir: « Marqueurs de Modèles » selon le Codex. et c’est avec ça on construit son thème jusqu’à avoir tous les fichiers .php qu’on veut (correspondant chacun à une demande différente du visiteur).
Styles imposés
WordPress utilise certaines classes et certains objets html dans les articles du site. Il faut penser à styler ces éléments, ainsi on doit les intégrer aux css des thèmes « faits maison »:
/* les images */
img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
/* les images liées */
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}
/* la séparation */
hr { display: none; }
/* les abbréviations */
acronym, abbr, span.caps { cursor: help; }
acronym, abbr { border-bottom: 1px dashed #999; }
/* les citations */
blockquote {
margin: 15px 30px 0 10px; padding-left: 20px; border-left: 5px solid #ddd;
}
cite { margin: 5px 0 0; display: block; }
J’en oublie sans doute beaucoup en chemin, mais dans les grandes lignes un thème wordpress ça se passe comme ça, non?
Ressources Utiles
En plus des liens cités plus haut, pour commencer je lis un peu
wordPress tuto porte bien son nom, c’est écrit en français par un type qui partage son faire.
Geekeries.fr – qui agrège plein de rédacteurs pédagogues au sein de sa Galaxie WordPress et qui présente régulièrement beaucoup d’extensions gadgets.
Articles (RSS)