Déjà une tripotée d’articles dans ce tutorial, et nous n’avons pas encore réalisé le sommaire !
Tenez-vous bien : nous n’allons pas encore nous y attaquer. Le sommaire général du site, c’est en effet la partie la plus difficile à réaliser graphiquement, et l’interface doit présenter les informations les plus importantes de manière cohérente (ni trop, ni pas assez...). Avant de créer le sommaire, il faut donc déjà connaître tous les types d’information présents sur le site, et les différentes structures de navigation. Le sommaire général, c’est donc pour la fin...
Nous allons donc commencer à réellement exploiter les informations de notre site pour créer des « sommaires » alternatifs. Les sites de jeux vidéo regorgent en effet de ces pages récapitulatives présentant les jeux selon différents critères : le calendrier des sorties, les meilleures notes...
Le tableau des meilleures notes
Créons un couple de fichiers pour afficher la liste des meilleurs jeux.
La page d’appel sera « notes.php3 », dont le contenu est :
Nous pouvons maintenant commencer le squelette, « notes.html » :
Nous avons installé une première BOUCLE_notes, qui affiche tous les mots-clés de type « Note » (c’est-à-dire « 01 », « 02 », ..., « 10) par ordre inversé (« 10 » en haut de liste).
Affichons le titre des articles correspondant à chaque note (c’est-à-dire les articles associés au mot-clé renvoyé par la BOUCLE_notes) :
La seule subtilité : le mot (la note) est désormais affiché dans le texte conditionnel avant de la BOUCLE_articles. De ce façon, seules les notes qui ont été réellement attribuées à des articles sont affichées.
Nous affichons ici le titre de l’article. Ce n’est pas ce qui nous intéresse. Nous voulons afficher :
le titre du jeu, c’est-à-dire le titre de la rubrique qui contient l’article ;
la (les) machine(s) sur lesquelles tournent ces jeux ;
la (les) date(s) de sortie du jeu.
Rien de bien compliqué, nous avons déjà réalisé ces opérations sur d’autres pages (pour la date de sortie, nous recopions directement ce que nous avons développé pour « article.html ») :
Seule petite subtilité : la balise #URL_ARTICLE est utilisée dans une boucle de type RUBRIQUES, de façon en réaliser le lien vers la page du test plutôt que sur la page générale de la rubrique du jeu. Cette utilisation d’un élément propre aux ARTICLES est possible ici, car l’#URL_ARTICLE est réalisé à partir de la variable « id_article ». Cet id_article est fourni par la BOUCLE_articles, puis la BOUCLE_rubrique_jeu ne la modifie pas (puisqu’il s’agit d’une boucle de RUBRIQUES). C’est le même principe qui permet d’utiliser « id_mot » dans la BOUCLE_verifier_mot.
Dernier problème à régler : cette page fonctionne bien au lancement du site et pendant les essais, avec une dizaine d’articles, mais quand votre site aura un an et plusieurs milliers de jeux tests (au minimum !), la liste sera trop longue. De toute façon, afficher indifféremment des jeux sortis il y a une semaine et des jeux sortis depuis plusieurs mois n’a pas grand intérêt : un jeu noté « 9/10 » il y a un an serait certainement moins bien noté aujourd’hui. Introduisons donc une limitation de temps en modifiant la BOUCLE_articles :
{age<90}, c’est-à-dire les articles publiés depuis moins de 3 mois.
Le calendrier des sorties
Incontournable sur les pages de jeux vidéo, la page indiquant les sorties récentes et les prochaines sorties.
La page d’appel sera « sorties.php3 » :
Commençons le fichier « sorties.html » ainsi :
Le #TITRE est celui de l’article contenant la date de sortie ; c’est un titre bidon utilisé par commodité dans l’espace privé. Il faut donc le remplacer par le titre du jeu, c’est-à-dire le titre de la rubrique qui contient cet article. Toujours le même processus. Nous voulons de plus afficher le logo des machines concernées par cette sortie. Là non plus rien de compliqué.
Il y a ici un défaut de navigation important : il y a systématiquement un lien vers la rubrique du jeu. Or, et surtout pour les jeux qui ne sont pas encore sortis, il est très possible qu’il n’y ait aucune information publiée sur ce jeu, en dehors de sa date de sortie. On risque alors de pointer vers une rubrique qui ne présente aucune information.
Modifions donc encore ce code, pour afficher non plus un lien vers la rubrique elle-même, mais vers chaque type d’articles.
Afin d’obtenir une présentation un peu plus condensée, commençons par créer une interface sous forme de lignes et de colonnes (et au passage, nous supprimons le lien hypertexte fautif) :
Ce code ne présente pas de grosse difficulté. Expliquons rapidement le positionnement des balises du tableau.
<table> et </table> sont placés en texte optionnel de la BOUCLE_sorties ; de cette façon, si la liste des jeux à venir est vide, on évite d’afficher un <table></table> peu élégant.
Les <tr> et </tr> sont à l’intérieur de la BOUCLE_sorties, et englobent l’intégralité de son contenu ; il s’agit ici de créer les lignes du tableau.
Dans la BOUCLE_rubrique_jeu, nous plaçons les <td> et </td> directement dans la boucle, autour du #TITRE. Nous savons en effet que, l’article étant forcément dans une rubrique, il y aura forcément une (et une seule) réponse dans BOUCLE_rubrique_jeu (inutile de placer ces codes dans du texte optionnel ; et comme il n’y aura qu’une seule réponse, on peut se placer à l’intérieur de la boucle).
C’est différent pour la BOUCLE_machines_jeu : les <td align="center"> et </td> sont à l’extérieur de la boucle, et ne sont même pas placés en code optionne. En effet : (1) ils sont à l’extérieur de la boucle, car il peut y avoir plusieurs machines concernées par cette date de sortie (c’est-à-dire plusieurs mots-clés de machines associés à l’article) ; si on avait placé ces balises à l’intérieur de la boucle, comme précédemment, le tableau perdrait son alignement, puisqu’on créerait des « cases » supplémentaires à chaque nouveau logo de mot-clé ; (2) ils ne sont pas placés dans du texte optionnel, car ce ne sont pas des balises optionnelles ; si on a oublié d’indiquer une machine pour la date de sortie, il faut tout de même créer cette « case » du tableau, certes vide, pour conserver l’alignement. Enfin, nous avons placé un en texte optionnel alternatif : s’il n’y a pas de mot-clé de machine associé à la date de sortie, on affiche cet espace insécable pour que la « case » ait un contenu (dans de nombreux butineurs, une case <td></td> n’est pas affichée de la même façon qu’une case <td> </td>.
Nous allons maintenant afficher pour chaque jeu la liste des Tests qui concernent ce jeu (insérons cela juste avant le </tr> final de la ligne) :
Cette BOUCLE_tests_jeu utilise des méthodes déjà expliquées.
Cependant, cela ne nous convient pas encore : nous affichons ici tous les tests, pour toutes les machines, alors que notre date de sortie ne concerne pas forcément toutes les versions du jeu (on peut ici afficher la date de sortie de la versions Dreamcast, alors qu’on a déjà publié des tests pour les versions Playstation, Dreamcast, Window...).
On ne veut donc afficher que les tests qui concernent les versions concernées par cette date de sortie. Nous avons déjà réalisé un processus similaire dans la page « article.html » pour n’afficher que les dates de sortie sur les mêmes machines que l’article affiché (BOUCLE_mac2). Cela donne :
La BOUCLE_mac2 récupère la liste des machines de la date de sortie. La BOUCLE_tests_jeu récupère l’ensemble des tests de jeu de la rubrique (toutes machines confondues). La BOUCLE_verifier_mot vérifie pour chaque test récupéré dans BOUCLE_tests_jeu qu’il est associé à la machine récupérée par BOUCLE_mac2.
Nous avons pour l’instant supprimé l’affichage de « Tests :» en texte conditionnel pour des raisons de lisibilié. Voici maintenant le code, exactement sur le même principe, qui permet d’afficher cette indication (ainsi que le ) :
Notez bien : les BOUCLE_mac2, BOUCLE_tests_jeu et BOUCLE_verifier_mot sont « collées », c’est-à-dire qu’elles ne sont plus séparées par des retours à la ligne ni par des espaces. En effet, nous testons le « contenu » de la BOUCLE_mac2 pour savoir si nous affichons l’indication « Tests :» ou le (les textes conditionnels). S’il nous avions concervé les retours à la ligne ou des espaces blancs entre les boucles, quel que soit le résultat de BOUCLE_tests_jeu et de BOUCLE_verifier_mot, la BOUCLE_mac2 aurait été considérée comme ayant un contenu à cause de l’affichage de ces retours-chariot.
Pour afficher une liste des previews, dupliquons simplement ce code, en modifiant le nom des boucles et en remplaçant titre_mot=test par titre_mot=preview :
Ajoutons enfin une boucle pour les « news » concernant ce jeu. Ici nous ne nous préoccuperons pas des machines, puisque toutes les news sont affichées sur une unique page. Nous n’afficherons donc pas de #TITRE, mais directement la mention « Les news » ; le lien hypertexte pointe vers la page spécifique que nous avons créée pour ce jeu. Notez enfin la restriction {0,1} qui permet de ne récupérer qu’une seule « news » pour créer un unique lien.
Pour être exhaustif, il resterait à recommencer l’opération avec les Soluces et les Astuces. Mais puisqu’il s’agit ici d’afficher une liste de sorties, considérons que ces informations ne sont pas pertinentes ici. Même si, techniquement, on peut les afficher facilement, faisons un choix éditorial : l’information n’est pas intéressante ici et surchargerait l’interface, donc nous préférons ne pas l’indiquer. (Mais si cela vous amuse, vous pouvez vous entraîner en les intégrant vous-même.)
