14P – Site de partage d'opinion sur les actualités
Par admin le mercredi, mai 21 2014, 07:56 - 2013-2014 - Lien permanent
Ce projet a été réalisé par NICOLAS SALLIN.
Le but de ce projet était de créer un site où il est possible de rédiger des articles argumentatifs sur des sujets de l'actualité ou qui sont d'actualité.
1. Introduction
Suite aux votations, je me suis rendu compte que beaucoup de personne n'était pas informée sur la nature exacte et les conséquences des votations mais avait quand même une opinion sur les sujets votés. Alors je me suis demandé comme cela se faisait-t-il et après avoir parlé avec eux je me suis rendu compte que leur opinion reposait sur des préjugés ou prévisualisation du sujet un peu naïve. Donc je me suis posé la question comment faire pour qu'ils soient mieux informés de chaque texte est de leurs conséquences pour pouvoir ensuite voter en connaissance de cause. Il m'ait venu l'idée qu'un site où chacun pourrait exprimer leurs idées en les argumentants et les illustrants pourrait aider à voter en connaissance de cause. Puis je me suis dit que d'étendre cela aux sujets d'actualité en général apporterait un plus, non seulement au site qui ne serait visité pas uniquement lors de votation, mais permettrait également pour comprendre d'autre fait d'actualité de notre société comme par exemple faudrait-il interdire les Google Glass dans les lieux publics? (catégorie mode de vie) ou alors faut-il accepter les médecins venant de l'étranger ? . Le site aura vraiment pour but d'informer les gens en leur montrant les divers possibilités sur des sujets mais pas de les convaincre, le choix de leur position doit leur appartenir sans être influencer.
2. Matériel et méthodes
J'ai donc commencé à penser à un site qui accueillerait des articles classés par catégorie (politique, religion. mode de vie,...) ce qui permettrait une visualisation très rapide et intuitive. pour héberger le site nous avons un serveur et des ordinateurs à disposition au gymnase ce qui m'a permit d'avoir besoin juste de temps mais aucun matériel supplémentaire. La première étape fût la réalisation du schéma de la disposition de mon site.
Figure1 - Plan de mon site
Il a ensuite fallut également créer les bases de données, une pour contenir les catégories et l'autre les article.
Création des bases de données
Pour cela je me suis servi du modèle suivant
-- -- Structure de la table `CATEGORIES` -- CREATE TABLE IF NOT EXISTS `CATEGORIES` ( `id` int(11) NOT NULL AUTO_INCREMENT, `nom_categorie` text collate latin1_general_ci NOT NULL, `description_categorie` text collate latin1_general_ci NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci AUTO_INCREMENT=1 ; -- -- Contenu de la table `CATEGORIES` -- -- -------------------------------------------------------- -- -- Structure de la table `CONTENU` -- CREATE TABLE IF NOT EXISTS `CONTENU` ( `id` int(11) NOT NULL AUTO_INCREMENT, `id_categorie` int(11) NOT NULL, `titre` text collate latin1_general_ci NOT NULL, `description` text collate latin1_general_ci NOT NULL, `texte` text collate latin1_general_ci NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci AUTO_INCREMENT=1 ; -- -- Contenu de la table `CONTENU` --
que j'ai trouvé à l'adresse suivante: http://creer-un-site.fr/creation-de-la-base-de-donnees-154.php
Puis suivant leur conseil j'ai également créé une page (connexion_bd.php) permettant ,en si référent, d'avoir directement toutes les données pour se connecter à la base de donnée ce qui permet une économie de temps (en ne dois pas écrire toujours la même chose et en plus permet de ne pas afficher dans le code le nom d'utilisateur et le mot de passe de la base de donnée. Le texte permettant la connexion à la base de donnée:
<?php #données pour la connexion à la base de données $nom_du_serveur ="***"; $nom_de_la_base ="***"; $nom_utilisateur ="***"; $passe ="***"; ?>
il faut remplacer les étoiles par vos données et maintenant il suffira d'inclure la page à l'aide de la fonction include et de mettre les fonctions défini sur cette page pour se connecter à la base de données.
Maintenant que nous avons nos bases de données nous allons faire la page permettant d'afficher les catégories, ce sera notre page d'accueil.
Page d'accueil (index.php)
on se connecte à la base de donnée puis on récupère le nom des catégories, on les affiche. Si il n'y en a pas on affiche un message. on ajoute également un lien vers la page pour ajouter une catégorie
<?php
#on se connecte à la base de données
include('connexion_bd.php');
mysql_connect("$nom_du_serveur","$nom_utilisateur","$passe");
mysql_select_db("$nom_de_la_base") or die('Impossible de sélectionner une base de donnée. Assurez vous d\'avoir correctement remplit les données du fichier connexion_bd.php.');
#On selectionne les données
$result = mysql_query("SELECT id,nom_categorie FROM CATEGORIES ORDER BY id ASC");
#On voit si il y a quelque chose. Si il n'y a rien, on affiche un message
if(mysql_num_rows($result) == 0)
{
echo '<div class="cadre"><p>Aucune catégorie pour le moment! <b>>><a title="Ajouter une catégorie" href="ajouter-categorie.php">Ajouter une catégorie</a></b></p> </div>';
}
#Si il y a quelque chose, on affiche nos données
else {
echo '<table style="width: 100%;" cellpadding="2" cellspacing="2"> <tbody> <tr> <td class="hauttd">Catégories</td></tr>';
while($affiche = mysql_fetch_array($result))
{
//On calcul le nombre d'article dans chaque catégorie
$calcul=$affiche['id'];
$result1 = mysql_query("SELECT id_categorie FROM CONTENU WHERE id_categorie=$calcul");
$total = mysql_num_rows($result1);
//Fin du calcul
echo '<tr><td><a href="voir-categorie.php?id='.$affiche['id'].'">'.$affiche['nom_categor ie'].'</a><span style="float:right;">('.$total.')</span></td> <td><a href="modifier-categorie.php?id='.$affiche['id'].'"><img src="images/modifier.png" alt="Modifier"/></a></td> <td><a href="supprimer-categorie.php?id='.$affiche['id'].'"><img src="images/supprimer.png" alt="Supprimer"/></a></td></tr>';
}
echo '</tbody></table>';
//On ferme else
}
?>
Création des catégorie (ajouter-categorie.php)
Nous partons d'un formulaire, avec pour rédiger un texte, la balise <textarea>
<form action="#ok" method="post">
<p>Titre de la catégorie :<br/>
<input name="titre" size="65" value="<?php
if (!empty($_POST["titre"])) {
echo stripcslashes(htmlspecialchars($_POST["titre"],ENT_QUOTES)); #permet de supprimer les antislashs et espaces avant et après
}?>" type="text"/></p>
<p>Description de la catégorie :<br/>
<textarea name="description" rows="10" cols="50" ><?php
if (!empty($_POST["description"])) {
echo stripcslashes(htmlspecialchars($_POST["description"],ENT_QUOTES));
}?></textarea></p>
<p>
<input name="Valider" value="Valider" type="submit"/>
<input name="Effacer" value="Effacer" type="reset"/>
</p>
</form>
Puis on contrôle si tout est ok (ou sinon on affiche un message d'erreur), on enregistre les données et les envoie sur la base de donnée
<?php
#Si l'action de valider a été faite
if(isset($_POST["Valider"]))
{
$titre = htmlspecialchars(stripcslashes(trim($_POST["titre"])));
$description = htmlspecialchars(stripcslashes($_POST["description"]));
#Vérification du formulaire
if(empty($titre)){
$alerte0 ='<div class="erreur"><a name="ok"></a>Vous n\'avez pas saisie de titre.</div>';
}
else if(empty($description)){
$alerte1 ='<div class="erreur"><a name="ok"></a>Vous n\'avez pas saisie de description.
</div>';
}
#Si tout est ok
else
{
#on se connecte à la base de données
include('connexion_bd.php');
mysql_connect("$nom_du_serveur","$nom_utilisateur","$passe");
mysql_select_db("$nom_de_la_base") or die('Impossible de sélectionner une base de donnée. Assurez vous d\'avoir correctement remplit les données du fichier connexion_bd.php.');
#on enregistre les données
$result = mysql_query("INSERT INTO CATEGORIES VALUES
(
'',
'".mysql_real_escape_string($titre)."',
'".mysql_real_escape_string($description)."'
)
");
#Si il y a une erreur, on crie ^^
if (!$result) {
die('Requête invalide : ' . mysql_error());
}
else{
#Si tout est ok, on informe le webmaster
$message_ok = '<div class="erreur"><a name="ok"></a><b>Catégorie enregistrée
avec succès!</b></div>';
}
#On ferme else
}
#On ferme if(isset($_POST["Valider"]))
}
?>
///
A présent faisons la page affichant les article par catégorie.
!!!Affichage des articles (voir-categorie.php)
Pour cela on vérifie que l'id existe (on la reprend de l'url)
puis on va chercher les informations dans la base de données et on les affiche
///
#On récupère l'id transmit par l'url
$id_transmit=$_GET['id'];
if (!isset($_GET["id"]) OR !is_numeric($_GET['id'])){
#Si la variable n'existe pas ou qu'elle n'est pas de type numérique, on redirige
header('location:http://'.$_SERVER['HTTP_HOST'].'');
}
else{
#on se connecte à la base de données
include('connexion_bd.php');
mysql_connect("$nom_du_serveur","$nom_utilisateur","$passe");
mysql_select_db("$nom_de_la_base") or die('Impossible de sélectionner une base de donnée. Assurez vous d\'avoir correctement remplit les données du fichier connexion_bd.php.');
#On va chercher le nom et la description de la catégorie
$nom_categorie = mysql_query("SELECT nom_categorie,description_categorie FROM
CATEGORIES WHERE id='".mysql_real_escape_string($id_transmit)."'");
while($cat = mysql_fetch_array($nom_categorie))
{
$titre_categorie=$cat['nom_categorie'];
$description_categorie=$cat['description_categorie'];
}
?>
<div class="cadrecentrale">
<h1>Catégorie "<?php echo $titre_categorie;?>"</h1>
<?php
#On va chercher tout ce qui rentre dans cette catégorie
$page = mysql_query("SELECT id,titre,description FROM CONTENU WHERE id_categorie='".
mysql_real_escape_string($id_transmit)."' ORDER BY id ASC");
#on voie si il y a quelque chose
if(mysql_num_rows($page) == 0)
{
#Si il n'y a rien, on informe le visiteur
echo '<div class="cadre">Aucun article pour le moment dans la catégorie '.$titre_catego
rie.'.</div>';
}
else
{
#On affiche les pages qui correspondent à la catégorie et en l'occurence le titre et
la description
while($affiche = mysql_fetch_array($page))
{
echo '<div class="cadre">
<h2><a title="'.$affiche['titre'].'" href="page.php?id='.$id=$affiche['id'].'
">'.$affiche['titre'].'</a></h2>
<p>'.$affiche['description'].'</p>
</div>';
}
#On ferme les else
}
}
?>
c'est très joli de voir les articles mais il faut en avoir pour les voir nous allons donc faire la page servant à les écrire
Rédaction des articles (ajouter-page.php)
on reprend le même principe que pour la création des catégories un formulaire comprenant plusieurs champs mais avec des champs différents
<?php
if(isset($message_ok))
{
echo $message_ok;
}
?>
<form action="#ok" method="post">
<?php
if(isset($alerte0))
{
echo $alerte0;
}
?>
<p>Titre de la page :<br/>
<input name="titre" size="65" value="<?php if (!empty($_POST["titre"])) { echo stripcslashes(htmlspecialchars($_POST["titre"],ENT_QUOTES)); } ?>" type="text"/>
</p>
<?php
if(isset($alerte1))
{
echo $alerte1;
}
?>
<p>Description de la page :<br/>
<textarea name="description" rows="10" cols="50" ><?php
if (!empty($_POST["description"])) {
echo stripcslashes(htmlspecialchars($_POST["description"],ENT_QUOTES));
}
?></textarea>
</p>
<?php
if(isset($alerte2))
{
echo $alerte2;
}
?>
<p>Contenu de la page :<br/>
<textarea name="contenu" rows="10" cols="50" ><?php
if (!empty($_POST["contenu"])) {
echo stripcslashes(htmlspecialchars($_POST["contenu"],ENT_QUOTES));
}
?></textarea>
</p>
<?php
if(isset($alerte3))
{
echo $alerte3;
}
?>
<p>Catégorie :<br/>
<?php
if (isset($_GET["id"]) AND is_numeric($_GET['id']))
{
echo '<span>'.$id_transmit.'</span><input name="cat" value="'.$id_transmit.'" type="hidden"><br/>';
} else {
?>
<br/>
<select name="cat">
<option value="">Selectionnez une catégorie</option>
<?php
#On selectionne les données
$categorie = mysql_query("SELECT id,nom_categorie FROM CATEGORIES ORDER BY id ASC");
while($affiche = mysql_fetch_array($categorie))
{
echo '<option value="'.$affiche['id'].'">'.$affiche['nom_categorie'].'</option>';
}
?>
</select>
</p>
<p>
<input name="Valider" value="Valider" type="submit"/>
<input name="Effacer" value="Effacer" type="reset"/>
</p>
</form>
puis on les enregistre et envoie sur la base de données
<?php
# on se connecte à la base de données
include('connexion_bd.php');
mysql_connect("$nom_du_serveur","$nom_utilisateur","$passe");
mysql_select_db("$nom_de_la_base") or die('Impossible de sélectionner une base de donnée. Assurez vous d\'avoir correctement remplit les données du fichier connexion_bd.php.');
#Traitement du formulaire
if(isset($_POST["Valider"]))
{
$titre = htmlspecialchars(stripcslashes(trim($_POST["titre"])));
$description = htmlspecialchars(stripcslashes($_POST["description"]));
$contenu = stripcslashes($_POST["contenu"]);
$categorie = $_POST["cat"];
#Vérification du formulaire
if(empty($titre)){
$alerte0 ='<div class="erreur"><a name="ok"></a>Vous n\'avez pas saisie de titre.</div>';
}
else if(empty($description)){
$alerte1 ='<div class="erreur"><a name="ok"></a>Vous n\'avez pas saisie de description.</div>';
}
else if(empty($contenu)){
$alerte2 ='<div class="erreur"><a name="ok"></a>Vous n\'avez pas saisie de contenu.</div>';
}
else if(empty($categorie)){
$alerte3 ='<div class="erreur"><a name="ok"></a>Vous n\'avez pas sélectionné de catégorie.</div>';
}
#Si tout est ok
else
{
#on enregistre les données
$result = mysql_query("INSERT INTO CONTENU VALUES ( '', '".mysql_real_escape_string($categorie)."', '".mysql_real_escape_string($titre)."', '".mysql_real_escape_string($description)."', '".mysql_real_escape_string($contenu)."' ) ");
#Si il y a une erreur, on crie ^^
if (!$result) {
die('Requête invalide : ' . mysql_error());
}
else{
#Si tout est ok, on informe le webmaster
$message_ok = '<div class="erreur"><a name="ok"></a><b>Page enregistrée avec succès!</b></div>';
}
#On ferme else
}
#On ferme if(isset($_POST["Valider"]))
} ?>
et maintenant il nous manque plus que la page permettant l'affiche des articles
Affichage des articles(page.php)
Il faut récupérer la variable transmit dans l'url qui nous permettera d'avoir l'id donc de retrouver l'article. Ensuite on vérifie si il y quelque chose dedans si c'est pas le cas on retourne en arrière et si il y a l'article on l'affiche
<?php
#On récupère la variable transmit par l'url
$id_transmit=$_GET['id'];
if (!isset($_GET["id"]) OR !is_numeric($_GET['id'])){
#Si la variable n'existe pas ou qu'elle n'est pas de type numérique, on redirige
header('location:http://'.$_SERVER['HTTP_HOST'].'');
}
else{
# on se connecte à la base de données
include('connexion_bd.php');
mysql_connect("$nom_du_serveur","$nom_utilisateur","$passe");
mysql_select_db("$nom_de_la_base") or die('Impossible de sélectionner une base de donnée. Assurez vous d\'avoir correctement remplit les données du f$
$page = mysql_query("SELECT * FROM CONTENU WHERE id='".mysql_real_escape_string
($id_transmit)."'");
#on voie si il y a quelque chose
if(mysql_num_rows($page) == 0)
{
#Si il n'y a rien, on redirige vers l'index
header('location:http://'.$_SERVER['HTTP_HOST'].'');
}
else #sinon on l'affiche
{
while($affiche = mysql_fetch_array($page))
{
$titre=$affiche['titre'];
$description=$affiche['description'];
$contenu=$affiche['texte'];
}
#On ferme else
}
}
?><div id="moncadre">
<div class="cadrecentrale">
<h1><?php echo $titre;?></h1>
et voilà maintenant il vous reste à mettre tout ça en page pour ça nous allons créer une page CCS
CSS
il faut crée un nouveau ficher .css (je vous propose main.css) puis vous y intégrez votre code CSS, je laisse votre imagination faire le travail
ensuite vous insérer la balise suivante dans la balise <head> de chaque document où vous voulez que le style soit appliqué.
<link rel="stylesheet" href="main.css" />
3. Résultats
Le résultat nous donne un site intuitif, qui grâce à la création de catégorie peut s'étendre. la mise en avant des catégories permet de tout de suite trouver le sujet voulu et donc une bonne accessibilité.
4. Discussion
Je pense que ce site pourrais bien marché si il était connu. mais il serait bon de développer plus la mise en page CSS pour que les personnes soient plus attirées. De plus il serait sûrement possible d'optimiser le code plus qu'à présent et de rajouter quelques raccourcis comme l'affichage des derniers article mis en ligne ou d'insérer un système de like/dislike même si ce dernier peut résulter d'une prise de position ce qui n'est pas pas le but comme nous recherchons le côté argumentatif dans les propos et non prise de position.
Pour la conception je pense qu'il est possible de mettre en place un site comme celui ci rapidement si toutes les connaissances sont acquises ou sinon comme dans mon cas en plusieurs jour de boulot il est possible de faire quelques choses de compréhensible.
5. Conclusion
Je pense que le site pourrais s'étendre à d'autre sujet tel que la philosophie mais que pour cela il faudrait en refaire un en parallèle. je trouve le résultat certes simple mais intuitif ce qui m'était le plus cher.
6. Source
Je tiens à préciser que le modèle mis en place vient du site juste ci dessous et qu'il a été adapté à mes besoins en espérant que mes explications seront un bon complément http://creer-un-site.fr/ http://fr.openclassrooms.com/informatique/cours/apprenez-a-creer-votre-site-web-avec-html5-et-css3/mettre-en-place-le-css