Pro cms ب php و mysql الجزء التاسع والأخير


فهاد الجزء التاسع والأخير من Pro cms ب php و mysql غادي نكملو الملفات لي بقاو ولي غادي تكون فيهم الصفحة الرئيسية ديال الblog ديالنا ولي غادي يتعرضوا فيها les articles كاملين مع les catégories وأيضا الملف لي غادي تكون فيه الفورم لي كتمكن الزوار باش يرسلونا رسائل.

نظرة سريعة بالفيديو

1- الملف contact.php

دائما فالمجلد الرئيسي كنزيد ملف جديد كنسميه contact.php فيه كاين الكود لي كيمكن مستخدم يرسلنا رسالة فمن بعد مكيستقبل القيم لي جاوه من الفورم فأول حاجة كنتحقق واش الحقول حتى واحد ما خاوي يلا كان شي واحد خاوي كنعرض رسالة تنبيه باش يتعمر الحقل الخاوي منبعد كنسترجع القيم وكنزيدهم فقاعدة البيانات الكود ديال الملف هو :

                                <?php 
include('includes/header.php');
$errors =[];
$message = "";
if(isset($_POST['submit'])){
    $name = mysqli_escape_string($con,$_POST['name']);
    $email = mysqli_escape_string($con,$_POST['email']);
    $message = mysqli_escape_string($con,$_POST['message']);
    $created = date('Y-m-d H:s:m');
    if(empty($_POST['name'])){
        $errors = "Veuillez remplir le champ nom & prénom";
    }else if(empty($_POST['email'])){
        $errors = "Veuillez remplir le champ email";
    }else if(empty($_POST['message'])){
        $errors = "Veuillez remplir le champ message";
    }else{
        $query = "INSERT INTO contacts (name,email,message,created) values('$name','$email','$message','$created')";
        if(mysqli_query($con,$query)){
             $message = '<div class="alert alert-success">
                    Message envoyé avec succés 
                </div>';
        }else{
            echo '<div class="alert alert-danger">Une erreur est survenue'.mysqli_error($con).'</div>';
        }
    }
}
?>
<div class="container">
    <div class="row" style="margin-top:50px">
        <div class="col-md-6 col-md-offset-3">
            <?php 
                if(!empty($errors)){
                    echo '<div class="alert alert-danger">
                            '.$errors.'
                        </div><br>';
                }else{
                    echo $message;
                }
            ?>
            <form  method="post" action="contact.php">
                <div class="form-group">
                    <label for="name">Nom & Prénom:</label>
                    <input type="hidden" id="post_id" value="<?php echo $id;?>">
                    <input type="text" class="form-control" name="name" id="name" placeholder="Entrer votre nom" value="<?php echo isset($_SESSION['email']) ? $_SESSION['name'] : "";?>">
                </div>
                <div class="form-group">
                    <label for="name">Email:</label>
                    <input type="email" class="form-control" name="email" id="email" placeholder="Entrer votre email" value="<?php echo isset($_SESSION['email']) ? $_SESSION['email'] : "";?>">
                </div>
                <div class="form-group">
                    <label for="body">Message:</label>
                    <textarea  class="form-control" rows="5" cols="30" name="message" id="message" placeholder="Entrer votre message"></textarea>
                </div>
                <div class="form-group">
                    <button type="submit" class="btn btn-success" name="submit">Valider</button>
                </div>
            </form>
        </div>
    </div>
</div>
<?php include('includes/footer.php');?>
                            

2- الملف includes/header.php

دائما  فالمجلد الرئيسي وفالمجلد includes كنزيد ملف جديد كنسميه header.php فيه غادي يكونوا روابط css ديالنا والقائمة لي كتمكن المستخدم من التنقل بين الصفحات وكاينة أيضا الفورم لي كتمكن من البحث على des articles فالموقع ديالنا الكود ديال الملف هو:

                                <?php 
session_start();
include('database/connection.php');
?>
<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>PHP CMS BY DARIJA CODING</title>
    <!-- Bootstrap core CSS -->
    <link href="includes/css/bootstrap.min.css" rel="stylesheet">
    <link href="includes/css/style.css" rel="stylesheet">
  </head>
  <body>
  <nav class="navbar navbar-default main-nav">
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="index.php" id="link">PHP CMS</a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
            <li><a href="index.php" id="link">Accueil</a></li>
            <li><a href="posts.php" id="link">Articles</a></li>
            <?php 
              if(isset($_SESSION['logged']) && $_SESSION['logged'] == true):
            ?>
            <li><a href="logout.php" id="link">Déconnexion</a></li>
            <?php 
              else:
            ?>
            <li><a href="register.php" id="link">Inscription</a></li>
            <li><a href="login.php" id="link">Connexion</a></li>
            <?php 
              endif;
            ?>
            <li><a href="contact.php" id="link">Contact</a></li>
          </ul>
          <form class="navbar-form navbar-right" method="post" action="searchPost.php">
            <input type="text" class="form-control" placeholder="Recherche..." name="search">
            <button class="btn btn-success xs-btn" id="btn-search" type="submit"><i class="glyphicon glyphicon-search"></i></button>
          </form>
        </div>
      </div>
    </nav>
                            

3- الملف includes/footer.php

دائما  فالمجلد الرئيسي وفالمجلد includes كنزيد ملف جديد كنسميه footer.php فيه غادي يكونوا روابط js ديالنا الكود ديال الملف هو:

                                 <hr>
 <footer class="main-nav">
    <p class="text-center" style="color:#FFF;padding:10px;font-size:20px;">DarijaCoding©2017</p> 
 </footer> <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="includes/js/bootstrap.min.js"></script>
    <script src="includes/js/addComment.js"></script>
  </body>
</html>
                            

4- الملف includes/css/style.css

دائما فالمجلد includes وفالمجلد css كنزيد ملف جديد كنسميه style.css فيه غادي يكون les styles css لي غادي نحتاجوا  الكود ديال الملف هو:

                                    body{
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
.sidebar{
    background: #F5F5F5;
    padding: 10px;
    margin-left: 10px;
    margin-right: 10px;
    border: 1px solid #646161;
    font-weight: bold;
}
.sidebar ul li a:hover{
    background: #1ab394;
    color: #ffffff;
}
.admin-nav{
  background: #3498db;
  padding: 10px;
  height: 70px;
}
.main-nav{    
    background: #2ecc71;
    padding: 5px;
    height: 70px;
    border-top: 5px solid #16a085;
    border-bottom: 5px solid #16a085;
}
.li-nav{    
    background: #2ecc71;
    padding: 5px;
    height: 40px;
    color: #FFF;
    font-style: bolder;
    font-size: 16px;
    border-top: 5px solid #16a085;
    border-bottom: 5px solid #16a085;
}
#link{
    color: #ffffff;
    font-size: 20px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
.navbar-collapse{
    background: #2ecc71;
}
#btn-search{
    background: #2ecc71;
    border-color: #2ecc71;;
}
.image img{
    border: 1px solid #2ecc71;
    border-radius: 2px;
}
.post{
    background: #DBCFCF;
    border-radius: 2px;
}
                                

5- الملف index.php

دائما فالمجلد الرئيسي ديالنا كنزيد ملف جديد كنسميه index.php فيه غادي يكون الكود لي غادي يمكن من عرض les articles ديالنا وغادي نستعملو ل pagination باش نعرضوهم فكاين ل fonction getCat لي كنعرضوا بها ل catégorie ديال كل article منبعد كنخدم ب requête sql باش كنسترجع ل les articles من قاعدة البيانات فكندير واحد ل calcule لي كيمكن من عرض فقط خمسة ديال les articles فالصفحة وكنخدم بل pagination باش كنتنقل بين الصفحات وكنعرض أيضا les catégories وles derniers articles ajoutés الكود ديال الملف هو :

                                    <?php 
include('includes/header.php');
function getCat($con,$id){
    $getCatQuery = "SELECT * FROM categories WHERE id='$id'";
    mysqli_query($con,$getCatQuery);
    $result = mysqli_query($con,$getCatQuery);
    return $category = $result->fetch_assoc();
}
?>
<div class="container">
    <div class="row" style="margin-top:50px">
        <div class="col-md-8">
            <div class="panel panel-default" style="padding:20px">
                <?php
                    $limit = 5;
                    $start = 0;
                    $page = isset($_GET['page']) ? $_GET['page'] : 1;
                    $start = ($page*5)-5;
                    $query = "SELECT * FROM articles LIMIT $start,$limit ";
                    mysqli_query($con,$query);
                    $result = mysqli_query($con,$query);
                    while($row = $result->fetch_assoc()):
                ?>
                <?php
                   $category = getCat($con,$row['category_id']);
                ?>
                <div class="media post">
                    <div class="image media-left">
                        <img src="admin/images/<?php echo $row['image'];?>" class="media-object" alt="" height="200" width="200">
                    </div>
                    <div class="media-body" style="padding:10px">
                        <h3 class="media-heading text-primary"><a href="viewPost.php?id=<?php echo $row['id'];?>"><?php echo $row['title'];?></a></h3>
                        <small class="text-danger"><i class="glyphicon glyphicon-time"></i> <?php echo $row['created'];?></small>
                        <small class="text-success"><i class="glyphicon glyphicon-tags"></i> <?php echo $category['name'];?></small>
                        <p class=""><?php echo substr($row['body'],0,150).'...';?></p>
                    </div>
                </div>    
                <hr>
                <?php
                    endwhile;
                ?>
                <?php  
                    $query = "SELECT COUNT(id) FROM articles";  
                    $result = mysqli_query($con,$query);  
                    $row = mysqli_fetch_row($result);  
                    $total_records = $row[0];  
                    $total_pages = ceil($total_records / $limit);  
                    $links = "<nav class='text-center'><ul class='pagination'>";  
                    $page = isset($_GET['page']) ? $_GET['page'] : 1;
                    for ($i=1; $i<=$total_pages; $i++) {  
                                $active = $i == $page ? 'class="active"' : '';
                                $links .= "<li $active><a href='index.php?page=".$i."'>".$i."</a></li>";  
                    };  
                    echo $links . "</ul></nav>";  
                ?>
            </div>
        </div>
        <div class="col-md-4">
           <ul class="list-group">
               <li class="list-group-item li-nav">
                    Catégories
               </li>
               <?php             
                $query = "SELECT * FROM categories";
                if(mysqli_query($con,$query)):
                    $result = mysqli_query($con,$query);
                    while($row = $result->fetch_assoc()):
                ?>
               <li class="list-group-item">
                    <a href="categoryPosts.php?id=<?php echo $row['id'];?>"><?php echo $row['name'];?></a>                  
               </li>
               <?php
                  endwhile;
                  endif;
              ?>
           </ul>
        </div>
        <div class="col-md-4">
           <ul class="list-group">
               <li class="list-group-item li-nav">
                    Dérniers Articles
               </li>
               <li class="list-group-item">
                    <?php
                        $query = "SELECT * FROM articles order by created DESC LIMIT 5";
                        if(mysqli_query($con,$query)):
                            $result = mysqli_query($con,$query);
                            while($row = $result->fetch_assoc()):
                    ?>
                    <div class="media">
                        <div class="image media-left">
                            <img src="admin/images/<?php echo $row['image'];?>" class="media-object" alt="" height="60" width="60">
                        </div>
                        <div class="media-body" style="padding:5px">
                            <h4 class="media-heading text-primary"><a href="viewPost.php?id=<?php echo $row['id'];?>"><?php echo $row['title'];?></a></h4>
                            <p class=""><?php echo substr($row['body'],0,20).'...';?></p>
                        </div>
                    </div>    
                    <hr>
                    <?php
                        endwhile;
                        endif;
                    ?>
               </li>
           </ul>
        </div>
    </div>
</div>
<?php include('includes/footer.php');?>

                                


إشترك في قناتنا على اليوتيوب

بحث في الموقع


إشترك للتوصل بالجديد