Créer un thème WordPress intégralement N°3 : l’index.php
Publié le 3 février 2012 dans Création de sites web, Spécial débutantsPour créer l’index.php, nous reprenons quelques informations présentes dans le header.php. N’hésitez pas à relire l’épisode N°2 si quelques notions vous échappent!
L’index peut contenir de multiples informations : vous y intégrerez tout ce qui concerne la page d’accueil, ce qui permet de personnaliser celle-ci indépendamment du reste du site.
Créer l’index.php
Comme pour le header.php créé dans le billet précédent, ouvrez un fichier Notepad et appelez-le index.php. Pour que la page d’accueil ouvre le fichier header.php, nous indiquons ceci :
<?php get_header(); ?> <!– ouvrir header,php –>
Ce que vous voyez en orange n’a pas d’incidence sur votre site, ce n’est qu’une indication : pour cela on l’encadre des symboles <!– et –>. Cette astuce sert de repère pour la suite : lorsque vous voudrez faire évoluer votre thème, vous trouverez les balises plus aisément.
Ensuite, nous intégrons un espace texte dédié à vos articles, le content :
<div id="content">
Nous laissons la div ouverte puisque nous allons détailler plusieurs choses du content. Notamment les postmetadata : données relatives au contenu comme le nom de l’auteur, la catégorie etc. Elles sont personnalisables :
<p class="postmetadata">
Avant cela, nous intégrons certains renseignements qui s’afficheront en correlation avec l’article : le titre par exemple. La balise h2 est importante pour le SEO : elle est l’une des premières lectures du moteur de recherche qui parcours le site.
En orange le if devra être fermé plus bas avec <?php endif; ?> :
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
<div class="post" id="post-<?php the_ID(); ?>">
<h2><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
<div class="post_content">
Intégrer des commentaires
Nous notons le code suivant, en sachant que si vous souhaitez à l’avenir retirer l’accès aux commentaires il suffit d’enlever ce code du fichier index, page ou single.php, ou les trois, à votre guise! Il va appeler comment.php :
Ensuite nous fermons les div ouvertes précédemment hormis quelques unes car nous n’avons pas tout inséré dans l’index:
<div class="comments-template">
<?php comments_template(); ?>
</div>
</div>
</div>
</div>
<?php endwhile; ?>
Les div sont sources de nombreuses « catastrophes » quant à l’apparence du site : si un jour vous retrouvez votre sidebar en bas de page par exemple, pensez de suite à vérifier vos que vos div sont bien fermées. Le problème est donc solutionné en quelques secondes.
Intégrer la sidebar et le footer à l’index
Nous appelons les fichiers correspondants, au même titre que nous l’avons fait pour le header.php :
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Nous clôturons le if comme précisé tout à l’heure, ainsi que la page que nous avions ouverte dans le header.php, de même que le body :
</div>
</body>
Voilà une bonne chose de faite! Vous verrez que les autres fichiers php iront plus vite à créer car nous reprendrons la majorité des éléments de l’index.php.

TROUVER UN HÉBERGEUR







