|
Untitled Document
 |
Module de news |
|
Tutorial écrit par : Ordimania - Web
Ressources
|
|
Introduction |
|
|
A travers ce tutorial, je vais vous montrer et vous expliquer comment
réaliser un module news. Bien sûr, comme tout tutorial, c'est une version
très simpliste d'un tel script qui vous serra exposée. Pour réaliser ce
tutorial, nous nous servirons du langage de programmation, le PHP combiné
aux base de données MySQL.
|
| |
Le pourquoi du comment du module de news |
|
|
Notre module de news utilise PHP et MySQL. C'est pourquoi, pour une meilleur
appréhension de ce tutorial, je vous conseille d'aller voir ce
cours sur MySQL.
De plus, il faut avoir quelques notions de requêtes MySQL, comme
INSERT, SELECT et la clause WHERE et connaître les instructions
qui permettent l'affichage en boucle car dans ce tutorial nous aurons
besoins d'utiliser la boucle WHILE() - voir
le cours -
Enfin, ce tutorial ne comportant pas de zones d'administrations disponibles
dans certaines versions de ce genre de script en téléchargement,
il faut aussi avoir une certaine connaissances de PhpMyAdmin, gestionnaire
de base de donnée MySQL.
Voici de quoi est composé le module de news :
- Création d'une table MySQL dans laquelle nous insérerons
les nouvelles news
- Une page d'insertion d'une nouvelle news avec un formulaire où
plusieurs champs sont obligatoires donc on les vérifiera dans la
page d'ajout.
- Un fichier de configuration où se trouvera le pseudo et le mot
de passe ainsi que le mon de votre base de données pour la connection
avec la table MySQL.
- Un fichier d'ajout de news, dans lequel on vérifie les champs
du formulaire mais aussi dans lequel on enregistre les données
dans la table MySQL.
- Un fichier d'affichage de toutes les news avec une option : l'affichage
d'un certains nombres de caractères seulement.
- Un fichier de lecture de news dans lequel tous les caractères
seront affichés.
Dans la fin de ce tutorial, je verrai avec vous comment sécuriser
l'affichage de vos news en les accordant avant, ainsi que détourner
l'affichage de termes comme <auteur/> pour éviter que le
navigateur ne considère ceci comme des balises de scripts. Mais
aussi nous verrons comment insérer des smiley, grâce à
une fonction très intéressante de PHP.
|
|
Création de la table MySQL |
| |
Ici, nous allons créer la table nécessaire au module dans
laquelle nous enregistrerons les news. Ils existe plusieurs permettant
la gestion des bases de données ; mais PhpMyAdmin par sa très
grande puissance est le plus utilisé. ( voir
le cours )
Voyons maintenant de quoi est composée la table MySQL :
| Structure de la table de news : |
CREATE TABLE `news` (
`id` smallint(6) NOT NULL auto_increment,
`date` datetime NOT NULL,
`auteur` tinytext NOT NULL,
`email` tinytext NOT NULL,
`site_web` tinytext NULL,
`titre` tinytext NOT NULL,
`news` text NOT NULL,
PRIMARY KEY (`id`),
UNIQUE KEY (`id`)
); |
|
|
La page contenant le formulaire pour insérer
une nouvelle news |
| |
Nous allons voir le code du formulaire qui permettra l'insertion d'une
nouvelle news dans la base de données. Cette page étant
composée principalement de code html, je n'y prêterais pas
grande attention, cependant, je vous ferai remarquer l'importance du champs
name pour ainsi récupérer les valeurs du formulaire. Pour
cela, il existe 2 possibilités, soit la méthode POST, celle
utilisée ou encore la méthode GET. Cette dernière
ce caractérise par le transfert des informations dans la barre
d'adresse alors que POST transmet ses données par les entêtes
HTTP. Utilisée pour les pseudo-frames, la méthode GET comporte
un gros inconvénient, celui de la taille. En effet, un nombre limite
de composant est imposé, contrairement à la méthode
POST. De plus, cette dernière est plus sécurisée
car aucun webmaster ne peut lire les données passées dans
la barre d'adresse ce qui n'est pas le cas de la méthode GET. Nous
appellerons cette page ajout_news.php.
<html>
<head>
<title>[ Ajouter un news
(1/2) ]</title>
</head>
<body>
<form
action="insertion.php" method="post">
<table
width="600" border="0">
<tr>
<td colspan="2"><center>
Formulaire d'insertion d'une nouvelle news.</center></td>
</tr>
<tr>
<td width="20%"> <p
align="right">Auteur : </p></td>
<td
width="80%"><input type="text" name="auteur"
class="formulaire" /></td>
</tr>
<tr>
<td><p align="right">E-mail
:</p></td>
<td><input type="text"
name="email" class="formulaire" /></td>
</tr>
<tr>
<td><p align="right">Site
Web :</p></td>
<td><input type="text"
name="site_web" class="formulaire" /></td>
</tr>
<tr>
<td><p align="right">Titre
de la news :</p></td>
<td><input type="text"
name="titre" class="formulaire" /></td>
</tr>
<tr>
<td colspan="2"> <p
align="center">Message : </p></td>
</tr>
<tr>
<td colspan="2"><center>
<textarea cols="100" rows="7" name="message"
class="formulaire"></textarea></center></td>
</tr>
<tr>
<td colspan="2"> <p
align="center">
<input type="reset"
value="Annuler" /> <input type="submit"
value="Envoyer" />
</p></td>
</tr>
</table>
</form>
</body>
</html> |
|
|
Fichier de configuration |
| |
Voici un simple code de configuration comme vous avez sans doute déjà
rencontré. Il est cependant commenté pour vous faciliter
le renseignement des variables !
Ce fichier sera appelé : config.inc.php
<?php
// Adresse de votre serveur sql (pour free : sql.free.fr)
$serveur = "localhost";
// Votre login chez votre hebergeur
$login = "root";
// Votre mot de passe correspondant à ce login
$mot_passe = "admin";
// Nom de votre base MySQL, elle porte souvent le même nom que
votre login
$nom_bdd = "ma_table";
?> |
|
|
La page d'insertion dans la base de donnée |
| |
Dans cette partie, nous allons voir comment s'assurer que les champs ont
bien été vérifié et si certains champs comportent
bien des caractères obligatoire. Je vais me contenter de vous commenter
le code plutôt que de l'expliquer. Attention dans cette version,
tous les champs doivent être renseignés
Pour information, nous allons travailler sur la page insertion.php
| <?php // on insère le fichier de configuration
require ('config.inc.php');
// on récupère les informations du formulaire
$auteur = $_POST["auteur"];
$email = $_POST["email"];
$site_web = $_POST["site_web"];
$titre = $_POST["titre"];
$message = $_POST["message"];
// on récupère les 7 premiers caractères du
champs site_web
$verif_url = substr($site_web,0,7)
// on définit la date au format MySQL (aaaa-mm-jj hh:mm:ss)
$date = date("Y-m-d H:i:s");
// on vérifie que tous les champs soient vérifiés
if (empty($auteur) OR empty($email) OR empty($message) OR empty($site_web)
OR empty($titre))
{
// on affiche un message d'erreur si l'un d'eux n'est pas remplis
?>
<html>
<body>
<script language="javascript">
alert('Le formulaire n\'est pas complet !\nVeuillez le compléter.');
</script>
[ <a href="javascript:history.go(-1);">Page précédente</a>
]
</body>
</html>
<?php
exit();
}
// on vérifie la présence du "http://"
en début d'url
// on vérifie aussi la présence du '@' et du '.' dans
l'email
elseif($verif_url != 'http://' OR !ereg('@',$email) OR !ereg('.',$email))
{
?>
<html>
<body>
<script language="javascript">
alert('Le formulaire est mal renseigné !\nVeuillez le vérifier.');
</script>
[ <a href="javascript:history.go(-1);">Page précédente</a>
]
</body>
</html>
<?php
exit();
}
// si aucune des conditions n'est vérifiées, on exécute
le script
else
{
// on se connecte au serveur MySQL
$connection = mysql_connect($serveur, $login, $mdp);
// on sélectionne la base de donnée
$select_bdd = mysql_select_db($nom_bdd);
// on insère les données dans la table 'news'
$insertion = "INSERT INTO news (date,auteur,email,site_web,titre,news)
VALUES ('$date','$auteur','$email','$site_web','$titre','$message')";
// en cas d'erreur, on affiche un message avec le nom de l'erreur
mysql_query($insertion) OR die('Impossible d\'enregistrer dans la
base de donnée !<br />Veuillez renouveler votre envoie.<br
/><a href=\'javascript:history.go(-1);\'>Page précédente</a><br
/>L\'erreur MySQL est :'.mysql_error());
// l'enregistrement s'est bien passé, on affiche un message
de remerciement
?>
<html>
<head>
<title>[ Ajouter un news (2/2) ]</title>
</head>
<body>
<script language="JavaScript">
alert('Votre news a été enregistrée dans la
base de donnée.');
</script>
Voici votre news :
<table width="600" border="0">
<tr>
<td width="20%"> <p align="right">Auteur
: </p></td>
<td width="80%"><?php echo $auteur; ?></td>
</tr>
<tr>
<td><p align="right">E-mail :</p></td>
<td><?php echo $email; ?></td>
</tr>
<tr>
<td><p align="right">Site Web :/p></td>
<td><?php echo $site_web; ?></td>
</tr>
<tr>
<td width="20%"><p align="right">Date
: </p></td>
<td><?php echo $date_news; ?> (au format MySQL : aaaa-mm-jj
hh:mm:ss)</td>
</tr>
<tr>
<td colspan="2"> <p align="center">Message
: </p></td>
</tr>
<tr>
<td colspan="2"><center><?php echo $message;
?></center></td>
</tr>
<tr>
<td colspan="2"><center>[ <a href="affichage.php">Voir
les news</a> ]</center></td>
</tr>
</table>
</font>
</body>
</html>
<?php
// on ferme la connection au serveur MySQL
mysql_close();
}
?> |
|
|
L'affichage de toutes les news |
| |
Une fois que nous avons vu comment enregistrer une nouvelle news dans
la base de donnée, nous allons afficher, pour chaque news, l'auteur,
la date d'écriture, l'email de l'auteur et son site internet.
| <?php // on inclut le fichier de configuration
require ('config.inc.php');
// connection à la base donnée
$connection = mysql_connect($serveur, $login, $mdp);
$select_bdd = mysql_select_db($nom_bdd);
// on récupère les info des table news
$affi_news = mysql_query("SELECT *,DATE_FORMAT(date, '%d/%m/%Y
@ %H:%i') AS date_news FROM news");
echo '<html>';
echo '<head>';
echo '<title>[ Afficher les news ]</title>';
echo '</head>';
echo '<body>';
// on se sert de la boucle while pour afficher toutes les news
while ($news = mysql_fetch_array($affi_news))
{
// ici, on prend les 200 premier caractères de la news
// pour les afficher
$message = substr($news["news"],0,200);
// puis on afficher pour chaque news, un tableau
// avec toutes les informations dedans
echo '<table width="570" border="1" bordercolor="#000000"
bgcolor="70809f">';
echo '<tr>';
echo '<td>';
echo '<table width="570" border="0">';
echo '<tr>';
echo '<td colspan="2">';
echo '<table width="570" border="0">';
echo '<tr>';
// on met la premier lettre de chaque mot en Majuscule
echo '<td width="65%">'.ucwords($news["titre"]).'</td>';
// on affiche la date d'insertion de la news
echo '<td>'.$news["date_news"].'</td>';
echo '</tr>';
echo '</table></td>';
echo '</tr>';
echo '<tr>';
// on met un lien vers l'email du posteur qui a pour sujet le titre
de la news
echo '<td width="50%"> <a href="mailto:'.$news["email"].'?subject='.$news["titre"].'">
'.ucwords($news["auteur"]).' </a></td>';
// on met un lien vers le site internet du posteur
echo '<td width="50%"><a href="'.$news["site_web"].'"
target="_blank">'.$news["site_web"].'</a></td>';
echo '</tr>';
echo '<tr>';
echo '<td colspan="2"><hr></td>';
echo '</tr>';
echo '<tr>';
// on met affiche les 200 premiers caratères de la news en
remplacant les saut de ligne du
// formulaire par des retour à la ligne : <br>
echo '<td colspan="2">'.nl2br($message).' ...<br
/>[ <a href="lire.php?id='.$news["id"].'">Lire
la suite ...</a> ]</td>';
echo '</tr>';
echo '<tr>';
echo '<td colspan="2"><hr><br /><br
/></td>';
echo '</tr>';
echo '</table';
echo '</td>';
echo '</tr>';
echo '</table>';
echo '<br /><br /><br />';
}
echo '</body>';
echo '</html>';
// on ferme la connection à la base de donnée
mysql_close();
?> |
Comme vous avez pu le voir, la fonction substr() permet de retourner
un nombre prédéfinit de caractères, ici les 200 premiers.
Il y a aussi l'utilisation de la fonction nl2br() qui permet le remplacement
des sauts de lignes par des <br>.
Nous venons de voir comment afficher une petite partie de toutes les news,
nous allons maintenant voir comment en afficher une seule en entier.
|
|
La page pour lire les news |
| |
Enfin, je vais vous montrer comment afficher une news en entier. Premièrement,
vous avez sûrement remarqué l'apparence du lien différente
avec un champs id. Celui-ci sert à définir quelle news sera
affichée. Comme nous passons une informations par le barre d'adresse,
il est assuré d'avoir la présence d'un $_GET, pour récupérer
l'id et la rechercher dans la base de donnée pour afficher la news
correspondante. Mais comme je le dite toujours, la pratique est dix fois
mieux que la théorique donc, fini les explications et bienvenue
au code commenté !
| <?php
// on inclut le fichier de configuration
require ('config.inc.php');
// on récupère l'id de la barre d'adresse
$id_news = $_GET["id"];
// on se connecte à la base de donnée
$connection = mysql_connect($serveur, $login, $mdp);
$select_bdd = mysql_select_db($nom_bdd);
// on utilise la clause where pour rechercher
// l'id de la news correspondant à notre requête
$affichage = mysql_query("SELECT *,DATE_FORMAT(date, '%d/%m/%Y
@ %H:%i') AS date_news FROM news WHERE id = '$id_news'");
$news = mysql_fetch_array($affichage);
echo '<html>';
echo '<head>';
echo '<title> [ Lire une news ]</title>';
echo '</head>';
echo '<body>';
echo '<table width="570" border="1" bordercolor="#000000"
bgcolor="70809f">';
echo '<tr>';
echo '<td>';
echo '<table width="570" border="0">';
echo '<tr>';
echo '<td colspan="2">';
echo '<table width="570" border="0">';
echo '<tr>';
// on met la première lettre de chaque mot en Majuscule
echo '<td width="65%">'.ucwords($news["titre"]).'</td>';
// on affiche la date d'insertion de la news
echo '<td>'.$news["date_news"].'</td>';
echo '</tr>';
echo '</table></td>';
echo '</tr>';
echo '<tr>';
// on met un lien vers l'email du posteur qui a pour sujet le titre
de la news
echo '<td width="50%"> <a href = "mailto:'.$news["email"].'?subject='.$news["titre"].'">
'.ucwords($news["auteur"]).' </a></td>';
// on met un lien vers le site internet du posteur
echo '<td width="50%"><a href="'.$news["site_web"].'"
target="_blank">'.$news["site_web"].'</a></td>';
echo '</tr>';
echo '<tr>';
echo '<td colspan="2"><hr></td>';
echo '</tr>';
echo '<tr>';
// on met affiche les 200 premiers caractères de la news
en remplaçant les saut de ligne du
// formulaire par des retour à la ligne : <br>
echo '<td colspan="2">'.nl2br($news["news"]).'<br
/><br /></td>';
echo '</tr>';
echo '<tr>';
echo '<td colspan="2"><hr><br /><br
/></td>';
echo '</tr>';
echo '</table>';
echo '</td>';
echo '</tr>';
echo '</table>';
echo '<br /><br /><br /><br />';
echo '</body>';
echo '</html>';
// on ferme la connection à la base de donnée
mysql_close();
?> |
|
|
Sécuriser et Personnaliser l'affichage de news |
| |
Pour éviter que n'importe quelles news soient publiées sur
votre site, il existe une méthode pour les accorder au préalable.
Il suffit juste de créer un champs supplémentaire dans la
table MySQL, que vous nommé affichage, qui a pour valeur défaut
0 et qui ne peut passer à un qu'en modifiant cette valeur via le
web par votre gestionnaire de base de données. Et pour afficher
les news, il faut que le champs affichage soit à 1. Voici un exemple.
| Champs à rajouter dans la création de votre table
de news : |
| `affichage` int(1) default `0` |
La valeur par défaut sera 0 , il n'y aura qu'a modifier directement
sur le web grâce à PhpMyAdmin par exemple en spécifiant
1 à la place de 0 et donc afficher la news. Vous pouvez également
ajouter une page de gestion de news, où vous aurez la possibilité
de valider les nouvelles news.
Voyons maintenant pour l'affichage des toutes les news :
Maintenant, nous allons afficher que les news où le champs affichage
sera 1 ; pour ce faire, nous utiliserons la clause WHERE :
| Restriction d'affichage : |
| $affi_news = mysql_query("SELECT *,DATE_FORMAT(date, '%d/%m/%Y
@ %H:%i') AS date_news FROM news WHERE affichage = '1'"); |
De même pour la page où nous affichons une news seule, il
faut aussi mettre WHERE affichage = '1', comme on se sert déjà
d'un WHERE, nous allons mettre un AND (et) :
| Restriction d'affichage : |
| $affichage = mysql_query("SELECT *,DATE_FORMAT(date, '%d/%m/%Y
@ %H:%i') AS date_news FROM news WHERE id = '$id_news' AND affichage
= '1'"); |
Peut-être un utilisateur a pour pseudo quelque chose du genre <pseudo/>,
et si vous le laisser comme ceci, rien ne va s'afficher. Il vous faut
donc coder les informations en html avant de les enregistrer dans la base
de données. htmlentities() est la fonction qui permet le codage
d'une chaîne en html. Voici comment l'utiliser :
$pseudo = htmlentities($_POST["pseudo"]);
$message = htmlentities($_POST["message"]); |
Vous pouvez aussi afficher des smileys dans vos news, pour cela, vous
devez vous servir de la fonction str_replace(). Voici comment l'utiliser
après la lecture des données dans la base MySQL :
| $news["news"] = str_replace(':-)','<img src="smiley/smiley.gif"
/>',$news["news"]); |
|
|
Conclusion |
| |
Une fois encore, le php nous a montré sa puissance à travers
ce script. J'espère qu'à travers ce tutorial, vous avez
compris ce qu'est et comment fonctionne un module de news. Alors maintenant,
à vos claviers et bonne progr' !! ;-)
|
|
|
|
