On y arrive, on va pouvoir commencer notre première vraie page !
Avant tout, voyons comment elle va se présenter :
Dans un premier temps on va générer la page en incluant les fichiers dont on vient de parler, ensuite on va inscrire le titre du forum. Il suffira alors de faire une requête pour récupérer dans notre base de données tous les forums et créer un tableau pour y présenter les forums par catégorie.
Enfin un pied de page donnera des indications sur le nombre de membres, de messages ou autre.
Je vous recommande vivement d'utiliser votre fichier menu.php pour y ajouter des liens de navigation : connexion, enregistrement, boite de message privée et autre ce qui nous évitera d'avoir à écrire ses liens sur chaque page !
Dans ce cas il faut bien faire attention à distinguer les cas selon que le visiteur est connecté ou non. Pensez donc à inclure la page menu.php après avoir récupéré les variables de session dans debut.php.
Pour savoir si un visiteur est connecté, il suffira de regarder la valeur stockée par la variable $id elle contient un nombre si c'est un membre, 0 si c'est un invité.
Haut de page
Page : index.php
Code : PHP | <?php
//Cette fonction doit être appelée avant tout code html
session_start();
//On donne ensuite un titre à la page, puis on appelle notre fichier debut.php
$titre = "Index du forum";
include("includes/identifiants.php");
include("includes/debut.php");
include("includes/menu.php");
|
Cette première partie de code ne doit pas vous poser trop de problèmes de compréhension, normalement : il s'agit juste d'inclure nos deux fichiers.
Maintenant, si vous le voulez bien, avant de reprendre, on va faire un tour du côté du fichier
design.css ; il va falloir créer un
id corps_forum, un pied de page (footer) et une autre bannière pour nos balises
<div>.
Voici à titre indicatif ce que j'ai réalisé: bien sûr, vous faites comme vous voulez, encore une fois

.
Code : CSS 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30 | #banniere
{
width: 600px;
height: 150px;
background-position: center;
margin-bottom: 20px;
background-image: url('images/banniere.jpg');
}
#corps_forum
{
border: 1px solid black;
width: 90%;
margin-top: 50px;
margin-left: 5%;
margin-bottom: 10Opx;
padding: 5px;
background-color: rgb(237,224,213);
}
#footer
{
border: 1px solid black;
width: 90%;
margin-top: 50px;
margin-left: 5%;
margin-bottom: 10Opx;
padding: 5px;
background-color: rgb(237,224,213);
}
|
Rien de bien neuf par rapport à ce que vous avez pu lire dans les cours sur le CSS jusqu'ici. On va pouvoir continuer notre page
index.php.
Code : PHP | <?php
echo'<i>Vous êtes ici : </i><a href ="./index.php">Index du forum</a>';
?>
|
Vous vous interrogez peut-être sur l'intérêt de cette ligne. Il s'agit simplement d'un outil de navigation (on appelle cela un
fil d'Ariane (
Def. fil d'Ariane), comme on en trouve dans beaucoup de forums, et qui nous permet de se repérer et de se déplacer plus rapidement (d'ailleurs, si vous levez les yeux, vous verrez qu'il y en a un sur ce site

).
Voilà : on a fini avec le haut de la page, et on va donc pouvoir passer à la partie la plus importante, l'affichage des catégories.
Afficher les forums
Ce qu'on va faire ici, ça va être en fait très simple puisqu'on va simplement afficher un tableau à cinq colonnes. La première colonne va afficher une image, la deuxième affichera le titre et la description, la troisième, le nombre de sujets, la quatrième, le nombre de messages, et la dernière donnera des infos sur le dernier message de cette catégorie.
Pour avoir un tableau un peu plus classe, je suis passé par mon
fichier css, et je vous recommande d'en faire autant, ne serait-ce que pour fixer la largeur de vos cases.
Le design
Code : CSS 1
2
3
4
5
6
7
8
9
10
11
12 | .ico {width:2%}
.titre { width:61%; }
.nombremessages { width:2%; }
.nombrevu { width:4%; }
.nombresujets { width:2%; }
.auteur { width:7%; }
.derniermessage { width:18%; }
.categorie { width:92%; background-color : rgb(244,238,250); }
td { border: 1px solid black; background-color: rgb(253,244,223); vertical-align:top; }
table { background-color: rgb(237,224,213); border: 1px solid black; }
th { background-color: rgb(243,250,223); border: 1px solid black; }
|
Dans un premier temps, j'ai créé des
classes pour les balises
<table>,
<th> et
<td>. Chaque
classe correspond à une colonne ; j'ai donc seulement fixé leur taille. J'ai ensuite modifié un peu ces balises, sans toutefois y apporter de changements majeurs (elles sont simplement entourées de noir, et ont un fond en couleur).
Bien entendu, ce n'est qu'une proposition de design ; en aucun cas la modification de celui-ci posera un problème de fonctionnement. Vous pouvez aussi ajouter un
padding pour que les textes ne soient pas collés au bord de leurs cases.
On reprend le php !
Sans plus attendre, voilà la suite :
Page : index.php
Code : PHP | <h1>Mon super forum</h1>
<?php
//Initialisation de deux variables
$totaldesmessages = 0;
$categorie = NULL;
?>
|
Ici, on écrit le titre de la page : comme vous le voyez, dans un grand moment d'inspiration, j'ai mis "Mon super forum". Ensuite ça devient plus intéressant : je prends deux variables qui ont le même but,
diminuer le nombre de requêtes de cette page. Si vous voulez tout savoir, ce tutoriel a été refusé une première fois parce que le forum utilisait trop de requêtes. Donc, en initialisant deux variables, croyez-moi ou non, ça les diminue ; la première compte le nombre de messages dans chaque forum pour l'écrire en bas de la page, et la seconde va prendre tout son sens dans le code qui suit.
La requête
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16 | <?php
//Cette requête permet d'obtenir tout sur le forum
$query=$db->prepare('SELECT cat_id, cat_nom,
forum_forum.forum_id, forum_name, forum_desc, forum_post, forum_topic, auth_view, forum_topic.topic_id, forum_topic.topic_post, post_id, post_time, post_createur, membre_pseudo,
membre_id
FROM forum_categorie
LEFT JOIN forum_forum ON forum_categorie.cat_id = forum_forum.forum_cat_id
LEFT JOIN forum_post ON forum_post.post_id = forum_forum.forum_last_post_id
LEFT JOIN forum_topic ON forum_topic.topic_id = forum_post.topic_id
LEFT JOIN forum_membres ON forum_membres.membre_id = forum_post.post_createur
WHERE auth_view <= :lvl
ORDER BY cat_ordre, forum_ordre DESC');
$query->bindValue(':lvl',$lvl,PDO::PARAM_INT);
$query->execute();
?>
|
C'est une requête, ce truc !?
Oui, et c'est même très pratique

. Les jointures sont expliquées par M@teo21 dans ses cours. Si vous avez un trou de mémoire, je vous conseille de relire son chapitre
Les jointures entre tables. En fait, cette requête va mettre à la suite les tables
forum_categorie,
forum_forum,
forum_post,
forum_topic et
forum_membres en les liant par des champs communs (par exemple, ici le champ
cat_id de
forum_forum va être lié avec le champ
cat_id de
forum_categorie).
Quant à la ligne juste avant, elle détermine le niveau d'accès du visiteur, on verra beaucoup plus tard ce que tout ça signifie, en attendant en utilisant cette méthode la page n'affichera pas les forums qui ne sont pas censés être vus.
Catégories
On va commencer par créer notre tableau
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26 | <table>
<?php
//Début de la boucle
while($data = $query->fetch())
{
//On affiche chaque catégorie
if( $categorie != $data['cat_id'] )
{
//Si c'est une nouvelle catégorie on l'affiche
$categorie = $data['cat_id'];
?>
<tr>
<th></th>
<th class="titre"><strong><?php echo stripslashes(htmlspecialchars($data['cat_nom'])); ?>
</strong></th>
<th class="nombremessages"><strong>Sujets</strong></th>
<th class="nombresujets"><strong>Messages</strong></th>
<th class="derniermessage"><strong>Dernier message</strong></th>
</tr>
<?php
}
//Ici, on met le contenu de chaque catégorie
?>
|
Avant de poursuivre, faisons une petite pause

. Vous avez vu que je procède comme ceci :
- On regarde si c'est une nouvelle catégorie : dans ce cas, on l'affiche en faisant un nouveau tableau. C'est là que la variable $categorie prend son sens. Elle est d'abord vide, donc, lorsqu'on va tester si elle a le même id que celle de la requête, ça ne sera bien sûr pas le cas, alors, on affichera un nouveau tableau après avoir actualisé la valeur de la variable.
- On affiche tous les forums, et c'est ce qu'on va voir tout de suite
.
Les forums
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41 | <?php
// Ce super echo de la mort affiche tous
// les forums en détail : description, nombre de réponses etc...
echo'<tr><td><img src="./images/message.gif" alt="message" /></td>
<td class="titre"><strong>
<a href="./voirforum.php?f='.$data['forum_id'].'">
'.stripslashes(htmlspecialchars($data['forum_name'])).'</a></strong>
<br />'.nl2br(stripslashes(htmlspecialchars($data['forum_desc']))).'</td>
<td class="nombresujets">'.$data['forum_topic'].'</td>
<td class="nombremessages">'.$data['forum_post'].'</td>';
// Deux cas possibles :
// Soit il y a un nouveau message, soit le forum est vide
if (!empty($data['forum_post']))
{
//Selection dernier message
$nombreDeMessagesParPage = 15;
$nbr_post = $data['topic_post'] +1;
$page = ceil($nbr_post / $nombreDeMessagesParPage);
echo'<td class="derniermessage">
'.date('H\hi \l\e d/M/Y',$data['post_time']).'<br />
<a href="./voirprofil.php?m='.stripslashes(htmlspecialchars($data['membre_id'])).'&action=consulter">'.$data['membre_pseudo'].' </a>
<a href="./voirtopic.php?t='.$data['topic_id'].'&page='.$page.'#p_'.$data['post_id'].'">
<img src="./images/go.gif" alt="go" /></a></td></tr>';
}
else
{
echo'<td class="nombremessages">Pas de message</td></tr>';
}
//Cette variable stock le nombre de messages, on la met à jour
$totaldesmessages += $data['forum_post'];
//On ferme notre boucle et nos balises
} //fin de la boucle
$query->CloseCursor();
echo '</table></div>';
?>
|
Voilà : on a terminé l'affichage des forums. Bon, en fait, tout se joue sur le gros
echo : il remplit simplement les cases du tableau avec les données de la requête. Les liens des images sont bien sûr à modifier en fonction de votre organisation.
Ensuite, on met à jour la variable qui compte le nombre de messages total, et le tour est joué !
J'ai également mis une petite flèche, sobrement appelée go.gif, un lien vers le dernier message de chaque forum.
Ce code n'est pas tout à fait complet : on n'a pas vu comment utiliser les autorisations (vous vous souvenez les champs auth_machin ?). Ceci sera fait dans une seconde partie avec les pages admin.
Avant de conclure j'aimerais retourner sur la petite partie concernant le lien vers le dernier message. Pour l'instant c'est surement un peu flou mais en fait il faut calculer la page dans laquelle ce message sera et faire le lien vers cette page, de cette manière vous arriverez directement sur le dernier message posté de chaque forum.
Le pied de page
Nous y voilà, on passe au bas de la page. Comme sur un forum phpbb, on va simplement y mettre des statistiques sur le forum (nombre de membres, nombre de messages, dernier membre inscrit).
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23 | <?php
//Le pied de page ici :
echo'<div id="footer">
<h2>
Qui est en ligne ?
</h2>
';
//On compte les membres
$TotalDesMembres = $db->query('SELECT COUNT(*) FROM forum_membres')->fetchColumn();
$query->CloseCursor();
$query = $db->query('SELECT membre_pseudo, membre_id FROM forum_membres ORDER BY membre_id DESC LIMIT 0, 1');
$data = $query->fetch();
$derniermembre = stripslashes(htmlspecialchars($data['membre_pseudo']));
echo'<p>Le total des messages du forum est <strong>'.$totaldesmessages.'</strong>.<br />';
echo'Le site et le forum comptent <strong>'.$TotalDesMembres.'</strong> membres.<br />';
echo'Le dernier membre est <a href="./voirprofil.php?m='.$data['membre_id'].'&action=consulter">'.$derniermembre.'</a>.</p>';
$query->CloseCursor();
?>
</div>
</body>
</html>
|
Petite explication sur ce bout de code. Au total, on va donc faire deux requêtes : la première va compter le nombre d'entrées dans la table
forum_membres pour retourner le nombre de membres (sans blague ?

). La deuxième requête va aller chercher le pseudo et l'
id du dernier membre inscrit ; comment fait-elle ? Elle regarde toutes les id et retourne la plus grande, tout simplement

.
On est donc arrivés en bas de notre page index.php, et on va maintenant tester pour voir ce que ça donne.