Vous vous apprêtez à lire un tutoriel rédigé par un membre de ce site. Malgré tout le soin que ce membre a pu apporter au tutoriel, nous ne pouvons pas garantir que les informations contenues sur cette page sont exactes à 100%. Merci de garder cela en tête lorsque vous lirez cette page ;o)
En fait, avant de se lancer dans notre première page, il va falloir créer quelques fichiers à inclure dans notre script. Si je dis "quelques", c'est parce que le nombre dépend de vous (une fois de plus) ; personnellement, j'aime bien avoir des menus en haut et à gauche de mon forum, ce qui fait que j'en ai déjà deux en plus. Mais si vous voulez garder la même navigation que dans votre site, il est inutile d'en refaire.
Quoiqu'il en soit, pour qu'on soit certains de bien se comprendre, voici les deux fichiers que je vais inclure dans mes scripts :
Page : identifiants.php
Code : PHP1
2
3
4
5
6
7 | <?php
//identifiants
$adresse = 'localhost';
$nom = 'Monnom';
$motdepasse = 'MonMotDePasse';
$database = 'TutoForum';
?>
|
Bien entendu, il s'agit de mes vrais identifiants
.
Cette page permet donc de vous identifier pour les requêtes SQL ; en l'incluant, on évite de le réécrire sur chaque page, ce qui en plus de rendre le code moins lisible n'est pas forcément très bon pour sa sécurité.
Page : debut.php
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<?php
if (!empty($titre)) //Si le titre est indiqué, on l'affiche entre les balises <title>
{
echo '<title> '.$titre.' </title>';
}
else //Sinon, on écrit forum par défaut
{
echo '<title> Forum </title>';
}
?>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="./css/design.css" />
</head>
|
Cette page est à inclure au début de tous vos scripts, c'est tout simplement l'initialisation.
Et comme elle est à inclure au début de chaque page, on va parfois l'utiliser pour ajouter des fonctionnalités qu'on veut voir apparaître sur toutes les pages. Enfin, vous comprendrez mieux un peu plus tard
.
Voilà : c'est tout pour ces fichiers qu'on va donc utiliser grâce à la fonction native
include de php, que vous connaissez sûrement si vous avez lu les cours du site.
J'ai placé tous mes fichiers à inclure dans un dossier includes, lui-même placé dans mon dossier forum ; vous n'êtes pas obligés de faire pareil, mais ne soyez pas surpris si l'adresse est différente lors de l'appel de la fonction include !
On y arrive, on va pouvoir commencer notre première vraie page !
Avant tout, voyons comment elle va se présenter.
On a tout d'abord le haut de page qui propose à l'utilisateur de se connecter, de s'inscrire ou bien, s'il est déjà connecté, de modifier son profil, de consulter ses messages privés, ou encore de se déconnecter.
Ensuite, on va avoir un tableau qui présente toutes les catégories et les forums respectifs.
Et enfin, le pied de page donnera des indications sur le nombre de membres, de messages, etc.
Haut de page
Comme je l'ai dit plus haut, on va proposer diverses options au visiteur qui arrive sur la page selon qu'il est connecté ou non. On va donc utiliser un simple
if, qui va tester si la variable
$_SESSION['pseudo'] existe, puis afficher le texte en fonction du résultat.
Pour info, la variable
$_SESSION['pseudo'] est créée lors de la connexion, mais on verra ça plus tard
.
Page : index.php
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16 | <?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/debut.php");
?>
<body>
<div id="banniere"></div>
<?php
//Maintenant, on se connecte à la base de données
include("includes/identifiants.php");
mysql_connect($adresse, $nom, $motdepasse);
mysql_select_db($database);
?>
|
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, et de se connecter.
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, 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 | #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);
}
|
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 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 | <div id="corps_forum">
<?php
// On indique où l'on se trouve
echo'<a href ="./index.php">Index du forum</a>';
// Puis on commence notre if
if (isset($_SESSION['pseudo'])) // Si le membre est connecté
{
//Voici les options
echo'<p>Vous êtes connecté en tant que
<a href="./voirprofil.php?m='.intval($_SESSION['id']).'&action=consulter">
'.stripslashes(htmlspecialchars($_SESSION['pseudo'])).'</a><br />
<a href="./voirprofil.php?action=modifier">
Modifier mon profil</a><br />
<a href="./messagesprives.php">
Consulter mes messages privés</a><br />
<a href ="./deconnexion.php">Se déconnecter</a><br /></p>';
}
// Sinon, on propose de se connecter ou de s'enregistrer
else
{
echo'<p>Vous n êtes pas connecté <br />
<a href="./connexion.php">Se connecter</a><br />
<a href="./register.php">Pas encore inscrit ?</a><br /></p>';
}
?>
|
Si vous ne comprenez pas encore les liens, c'est normal, car on verra ces pages plus tard. Donc, si on résume ici, on va vérifier si l'utilisateur est connecté, puis lui afficher des options.
Vous vous interrogez peut-être sur l'intérêt de cette ligne :
Code : PHP1
2
3 | <?php
echo'<a href ="./index.php">Index du forum</a>';
?>
|
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 | .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
id pour les balises
<table>,
<th> et
<td>. Chaque
id 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é au bord de leurs cases.
On reprend le php !
Sans plus attendre, voilà la suite :
Page : index.php
Code : PHP1
2
3
4
5
6 | <h1>Forum Exemple</h1><br /><br />
<?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 "Forum Exemple". 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 tutorial 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
17 | <?php
//Déterminons le niveau d'accès du visiteur
$level = (isset($_SESSION['level']))?intval($_SESSION['level']):1;
//Cette requete permet d'obtenir tout sur le forum
$requete2 = mysql_query('
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 < '.$level.'
ORDER BY cat_ordre, forum_ordre DESC');
?>
|
C'est une requête, ce truc !?
Oui, et c'est même très pratique
. Les jointures ne sont pas expliquées par M@teo21 dans ses cours, mais il existe un
tutoriel pour ça sur le Site du Zér0. 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).
Je ne suis pas là pour expliquer ce qu'est une jointure : donc si ça vous intéresse, allez lire le tutoriel
.
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 vu.
Catégories
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 | <?php
//Dans un premier temps, on vérifie s'il y a des forums à lister
if (mysql_num_rows($requete2) < 1)
{
echo'Il n y a pas de forum :o
Allez en ajouter avec le panneau d administration';
}
else
{
?>
<table>
<?php
//Début de la boucle
while($data2 = mysql_fetch_assoc($requete2))
{
//On affiche chaque catégorie
if( $categorie != $data2['cat_id'] )
{
//Si c'est une nouvelle catégorie on l'affiche
$categorie = $data2['cat_id'];
?>
<tr>
<th></th>
<th class="titre"><strong><?php echo stripslashes(htmlspecialchars($data2['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 distingue deux cas pour être sûr qu'il y a des forums à lister (dans le cas où c'est la première fois que vous utilisez votre forum, il n'y en aura pas, logiquement), mais c'est un cas rare, bien sûr. Donc, s'il y a des forums à lister, on 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='.$data2['forum_id'].'">
'.stripslashes(htmlspecialchars($data2['forum_name'])).'</a></strong>
<br />'.nl2br(stripslashes(htmlspecialchars($data2['forum_desc']))).'</td>
<td class="nombresujets">'.$data2['forum_topic'].'</td>
<td class="nombremessages">'.$data2['forum_post'].'</td>';
// Deux cas possibles :
// Soit il y a un nouveau message, soit le forum est vide
if (!empty($data2['forum_post']))
{
//Selection dernier message
$nombreDeMessagesParPage = 15;
$nbr_post = $data2['topic_post'] +1;
$page = ceil($nbr_post / $nombreDeMessagesParPage);
echo'<td class="derniermessage">
'.date('H\hi \l\e d/M/Y',$data2['post_time']).'<br />
<a href="./voirprofil.php?m='.stripslashes(htmlspecialchars($data2['membre_pseudo'])).'&action=consulter">'.$data2['membre_pseudo'].' </a>
<a href="./voirtopic.php?t='.$data2['topic_id'].'&page='.$page.'#p_'.$data2['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 message, on la met à jour
$totaldesmessages += $data2['forum_post'];
//On ferme notre boucle et nos balises
} //fin de la boucle
echo '</table>';
} //fin du else
?>
|
Voilà : on a terminé l'affichage des forums. Bon, en fait, tout ce 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
24
25
26
27 | <?php
//Le pied de page ici :
echo'
<hr />
<div>
<h2>
Qui est en ligne ?
</h2>
';
$requete3 = mysql_query("SELECT membre_id FROM forum_membres");
$TotalDesMembres = mysql_num_rows($requete3);
$requete4 = mysql_query("SELECT membre_pseudo, membre_id FROM forum_membres ORDER BY membre_id DESC LIMIT 0, 1");
$data4 = mysql_fetch_assoc($requete4);
$derniermembre = stripslashes(htmlspecialchars($data4['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='.$data4['membre_id'].'&action=consulter">'.$derniermembre.'</a>.</p>';
?>
</div>
</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_post 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.
Si vous lancez votre navigateur et que vous allez sur la page index.php, vous voyez normalement un message qui vous demande d'ajouter des forums.
Ou alors un tableau vide, si vous n'avez pas suivi exactement le code proposé.
Euh ?
Non, en fait c'est parfaitement normal, dans la mesure où votre base de données est entièrement vide pour l'instant. Dans l'avenir, pour la remplir il suffira de se rendre dans la page d'administration, rajouter des forums ou des catégories, ou bien simplement de s'inscrire... Mais comme on n'a pas encore créé toutes les pages qui vont nous le permettre, il va falloir modifier directement la base de données, histoire de voir un peu ce que ça donne.
Je vous propose donc les requêtes suivantes, que vous pourrez bien sûr modifier plus tard.
Code : SQL1
2
3 | INSERT INTO `forum_categorie` (`cat_id`, `cat_nom`, `cat_ordre`) VALUES (1, 'Général', 30);
INSERT INTO `forum_categorie` (`cat_id`, `cat_nom`, `cat_ordre`) VALUES (2, 'Jeux-Vidéos', 20);
INSERT INTO `forum_categorie` (`cat_id`, `cat_nom`, `cat_ordre`) VALUES (3, 'Autre', 10);
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20 | INSERT INTO `forum_forum` (`forum_id`, `forum_cat_id`, `forum_name`, `forum_desc`, `forum_ordre`, `forum_last_post_id`, `forum_topic`, `forum_post`, `auth_view`, `auth_post`, `auth_topic`, auth_annonce, auth_modo)
VALUES (1, 1, 'Présentation', 'Nouveau sur le forum? Venez vous présenter ici !', 60, 0, 0, 0, 0, 0, 0, 0, 0);
INSERT INTO `forum_forum` (`forum_id`, `forum_cat_id`, `forum_name`, `forum_desc`, `forum_ordre`, `forum_last_post_id`, `forum_topic`, `forum_post`, `auth_view`, `auth_post`, `auth_topic`, auth_annonce, auth_modo)
VALUES (2, 1, 'Les News', 'Les news du site sont ici', 50, 0, 0, 0, 0, 0, 0, 0, 0);
INSERT INTO `forum_forum` (`forum_id`, `forum_cat_id`, `forum_name`, `forum_desc`, `forum_ordre`, `forum_last_post_id`, `forum_topic`, `forum_post`, `auth_view`, `auth_post`, `auth_topic`, auth_annonce, auth_modo)
VALUES (3, 1, 'Discussions générales', 'Ici on peut parler de tout sur tous les sujets', 40, 0, 0, 0, 0, 0, 0, 0, 0);
INSERT INTO `forum_forum` (`forum_id`, `forum_cat_id`, `forum_name`, `forum_desc`, `forum_ordre`, `forum_last_post_id`, `forum_topic`, `forum_post`, `auth_view`, `auth_post`, `auth_topic`, auth_annonce, auth_modo)
VALUES (4, 2, 'MMORPG', 'Parlez ici des MMORPG', 60, 0, 0, 0, 0, 0, 0, 0, 0);
INSERT INTO `forum_forum` (`forum_id`, `forum_cat_id`, `forum_name`, `forum_desc`, `forum_ordre`, `forum_last_post_id`, `forum_topic`, `forum_post`, `auth_view`, `auth_post`, `auth_topic`, auth_annonce, auth_modo)
VALUES (5, 2, 'Autres jeux', 'Forum sur les autres jeux', 50, 0, 0, 0, 0, 0, 0, 0, 0);
INSERT INTO `forum_forum` (`forum_id`, `forum_cat_id`, `forum_name`, `forum_desc`, `forum_ordre`, `forum_last_post_id`, `forum_topic`, `forum_post`, `auth_view`, `auth_post`, `auth_topic`, auth_annonce, auth_modo)
VALUES (6, 3, 'Loisir', 'Vos loisirs', 60, 0, 0, 0, 0, 0, 0, 0, 0);
INSERT INTO `forum_forum` (`forum_id`, `forum_cat_id`, `forum_name`, `forum_desc`, `forum_ordre`, `forum_last_post_id`, `forum_topic`, `forum_post`, `auth_view`, `auth_post`, `auth_topic`, auth_annonce, auth_modo)
VALUES (7, 3, 'Délires', 'Décrivez ici tous vos délires les plus fous', 50, 0, 0, 0, 0, 0, 0, 0, 0);
|
Ce code aura pour effet de créer trois catégories, et quelques forums pour chacune d'elles. Vous vous demandez peut-être pourquoi le champ
ordre prend des valeurs si espacées (60, 50, 40) ? Ça permet d'éviter d'avoir à modifier toutes les valeurs dans le cas où l'on voudrait ajouter une catégorie, ou un forum, entre deux autres. Avec ce système par exemple, on a juste à mettre 55 pour placer une catégorie entre Général et Jeux Vidéos
.
Tutoriels
Communauté
Mon compte
Recherche
Livre d'or
Publicité
164 Zéros connectés |
8 requêtes |
0.046s (0.0271s)
