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>
5129 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
3 814 vues
Afficher ses utilisateurs en PHP
Maintenant que nous avons créé notre formulaire d’inscription et de connexion nous allons afficher tous nos utilisateurs du site afin de visiter par la suite les autres profils du site.
Créer son site de rencontres
2 970 vues
Messagerie interne
Maintenant que vous avez créé votre nouvelle base de données pour notre messagerie interne nous allons ajouter à la main quelques lignes pour afficher la liste des messageries entre vous et les...
Créer son site de rencontres
4 718 vues
Différencier HTML (structure) de CSS (présentation)
Différencier HTML (structure) de CSS (présentation)HTML (HyperText Markup Language) et CSS (Cascading Style Sheets) sont deux langages complémentaires utilisés pour créer des sites Web, mais ils...
CSS
1 501 vues
Lien externe de feuilles de style CSS avec l'élément <link>
Lien externe de feuilles de style CSS avec l'élément <link>L'élément <link> est utilisé dans une page HTML pour lier une feuille de style CSS externe. Cela permet de séparer le...
HTML
7 394 vues
Barre de recherche : Formulaire
Avant d'entamer le développement de notre barre de recherche nous allons reprendre le fichier index.php des articles précédents.Dans notre fichier index.php nous allons y...
Créer son site
3 579 vues
Comprendre les différentes catégories de commandes SQL
SQL, ou Structured Query Language, est composé de plusieurs catégories de commandes, chacune ayant un rôle spécifique dans la manipulation et la gestion des bases de données relationnelles. Les...
SQL
1 089 vues
Comparaison avec d'autres langages de programmation
Comparaison de JavaScript avec d'autres langages de programmationJavaScript est un langage de programmation unique avec ses propres caractéristiques et particularités. Comprendre comment il se...
JS
1 360 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
Publicité
Cette pub permet au site de vivre ...