Mise en page


Pour commencer nous allons créer la page maître de notre blog. C'est cette page qui contiendra tous les articles qui constituerons notre blog.

Tout d'abord nous allons créer un dossier que nous appellerons f_blog. Ensuite, nous allons créer une nouvelle page que l'on nommera blog.php à l'intérieur du dossier f_blog.

Dans notre fichier menu.php que nous avons déjà créer auparavant nous allons ajouter un lien qui nous permettra d'accéder à notre nouvelle page blog.php


Page menu.php


<li class="nav-item">
  <a class="nav-link" href="blog">Blog</a>
</li>


Nous allons également modifier notre fichier .htaccess afin d'appliquer l'URL souhaitée.


Fichier .htaccess


RewriteRule ^blog$ f_blog/blog


Ensuite dans notre page blog.php nous allons afficher tous les articles.


Page blog.php


<?php
  session_start();
  include('../bd/connexionDB.php'); // Fichier PHP contenant la connexion à votre BDD

  $req = $DB->query("SELECT b.*, u.prenom, u.nom, c.titre as titre_cat
    FROM blog b
    LEFT JOIN utilisateur u ON u.id = b.id_user
    LEFT JOIN categorie c ON c.id_categorie = b.id_categorie
    ORDER BY b.date_creation DESC");

  $req = $req->fetchAll();
?>

<!DOCTYPE html>
<html>
<head><base href="/"/><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/><title>Blog</title><link rel="stylesheet" href="../css/bootstrap.min.css"/><link rel="stylesheet" href="../css/style.css"/>
</head>

  <body><?phprequire_once('../menu.php');    
    ?>
  
    <div class="container"><div class="row">   
  
        <div class="col-sm-0 col-md-0 col-lg-0"></div><div class="col-sm-12 col-md-12 col-lg-12"><h1 style="text-align: center">Mon blog</h1>
  
          <?phpif(isset($_SESSION['id']) && $_SESSION['role'] == 1){
          ?><a href="blog/creer-mon-article" class="btn btn-primary btn-lg active" role="button" aria-pressed="true">Créer un article</a><?php
              }
            ?><?phpforeach($req as $r){ 
              ?>  
                <div style="margin-top: 20px; background: white; box-shadow: 0 5px 10px rgba(0, 0, 0, .09); padding: 5px 10px; border-radius: 10px"><a href="blog/<?= $r['id'] ?>" style="color: #666; text-decoration: none; font-size: 28px;"><?= $r['titre'] ?></a><div style="border-top: 2px solid #EEE; padding: 15px 0"><?= nl2br($r['text']); ?></div><a href="blog/<?= $r['id'] ?>">Voir plus</a> 
                  <div style="padding-top: 15px; color: #ccc; font-style: italic; text-align: right;font-size: 12px;">
                    Fait par  <?= $r['nom'] . " " . $r['prenom'] ?> le <?= date_format(date_create($r['date_creation']), 'D d M Y à H:i'); ?> dans le thème <?= $r['titre_cat'] ?></div></div>  
              <?php
              }
            ?>              
        </div></div></div>
    
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
5079 vues
Modifié le 29 juin 2021
Publicité Sitedudev
Cette pub permet au site de vivre ...
Vidéo associée
Publicité Sitedudev
Cette pub permet au site de vivre ...
Télécharger le code source
Publicité
Cette pub permet au site de vivre ...
Voir d'autres articles
1 579 vues
Gestion des événements : click, submit, keydown, etc.
Gestion des Événements en JavaScriptLa gestion des événements en JavaScript permet d'interagir avec les actions de l'utilisateur sur une page web, telles que les clics de souris, les soumissions...
JS
850 vues
Modification du contenu et des styles
Modification du Contenu et des Styles des Éléments HTML en JavaScriptLa modification du contenu et des styles des éléments HTML est une tâche courante en développement web. Cela permet de...
JS
1 265 vues
Comprendre les concepts de marge, bordure, rembourrage et largeur/hauteur
Dans CSS, la mise en page des éléments est souvent influencée par quatre concepts clés : la marge, la bordure, le rembourrage et la largeur/hauteur. Comprendre ces concepts est essentiel pour...
CSS
2 995 vues
Demande d'amis en PHP (1/3)
Dans cette première vidéo, nous allons créer 3 boutons sur la page voir-profil.php qui vont nous permettre d'ajouter, supprimer et de bloquer une personne.Nous allons également créer une...
Créer son site de rencontres
746 vues
Déclaration de fonctions
Les fonctions en PHP sont des blocs de code réutilisables qui effectuent une tâche spécifique. Elles permettent d'organiser le code en le divisant en tâches plus petites et plus gérables. Voici...
PHP
2 073 vues
Personnaliser ses conversations
Dans cette dernière vidéo nous allons personnaliser notre messagerie ! 😎Pour cela nous allons donner l’aspect des conversations comme une messagerie de smartphone type Apple ou Samsung.Nous...
Créer son site de rencontres
966 vues
Positionnement statique, relatif, absolu et fixe
Positionnement Statique, Relatif, Absolu et Fixe en CSSEn CSS, le positionnement des éléments peut être contrôlé en utilisant différentes propriétés. Les quatre types de positionnement les...
CSS
1 090 vues
Variables : déclaration, types de données (chaînes de caractères, nombres entiers et flottants, booléens)
Les variables sont des éléments fondamentaux en programmation, utilisées pour stocker des données et leur attribuer des noms. En PHP, les variables peuvent stocker différents types de données,...
PHP
Publicité
Cette pub permet au site de vivre ...