آموزش صفحه بندی با php

اگر php را به عنوان زبان برنامه نویسی خود انتخاب کرده باشید قطعا از اهمیت صفحه بندی در این پلتفرم اطلاع دارید. آموزش صفحه بندی با php یا Pagination یکی از کاربردی ترین مباحثی است که در مورد این زبان برنامه نویسی مطرح میشود. با توجه به اهمیتی که صفحه بندی برروی بهبود و ارتقای تجربه کاربری (UX) دارد در این مطلب قصد داریم مختصری به ان بپردازیم، پس در ادامه با ما همراه باشید.

اهمیت آموزش صفحه بندی با php

پیش از انکه بخواهیم آموزش نحوه صفحه بندی را شروع کنیم خوب است در همین ابتدا کمی با اهمیت این موضوع آشنا شویم. صفحه بندی در پی اچ پی به نام pagination هم شناخته میشود و به منظور ایجاد خوانایی بیشتر و درک بهتر برای کلاینت مورد استفاده قررا می گیرد. یکی از کارهایی که در این زمینه انجام می دهیم این است که قسمتی از اطلاعات مورد نیاز به وسیله پایگاه داده مان دریافت گردد.

چون در این صورت حجم ترافیکی که سرور مورد استفاده قرار می دهد به خوبی کاهش پیدا می کند. به علاوه وقتی این کاهش حجم ترافیک سرور را داشته باشیم شاهد افزایش سرعت بارگذاری صفحه ها برای کلاینت ها خواهیم بود.

به طور کلی برای صفحه بندی در زبان برنامه نویسی پی اچ پی دو روش اصلی وجود دارد:

• صفحه بندی معمولی به صورت صفحه های پشت سر هم و شماره دار: صفحه 1، 2، 3 و …
• صفحه بندی از نوع ajax که برای مثال شاهد دکمه های ادامه مطلب، یا بارگذاری مطلب و … برای آن هستیم.

در ادامه با ما همراه باشید تا آموزش صفحه بندی با php را آغاز کنیم.

صفحه بندی برای اطلاعات پایگاه داد

اگر میخواهید اطلاعات پایگاه داده شما بهتر به نمایش دربیاید انگاه می بایست اطلاعات آن را صفحه بندی شده و مرتب طراحی کنید. اینگونه است که کلیه داده ها در صفحه های مختلف به خوبی به نمایش درمی آیند و کاربران سایت دیگر سردرگم نخواهند شد.

به طور کلی وقتی شما بخش بزرگی از محتوای دیتابیس خود را تنها در یک صفحه آن هم به صورت متاولی و پشت هم برای کاربر به نمایش بگذارید او باید زمان زیادی را برای بررسی این داده ها و محتواها اختصاص دهد. خود همین موضوع سبب سردرگمی کاربر می شود و همین موضوع افت کیفیت تجربه کاربری را به دنبال خواهد داشت.

اما به کمک صفحه بندی اطلاعات پایگاه داده ها شما می توانید مطالب را برای کاربران سایتتان خواناتر و قابل فهم تر کنید. برای این کار نیاز به مجموعه داده ای داریم که گسترده باشد. لذا در گام نخست می بایست یک دیتابیس به همراه یک جدول طراحی کرده و بسازیم.

هرکس میاد سمت php میخواد درامد هم داشته باشه ما در مداد سبز روش های تضمینی کسب درامد از PHP رو برات آماده کردیم، سعی کن بخونیش

مرحله های صفحه بندی در php

در این بخش از آموزش صفحه بندی با php به صورت کلی مرحله هایی که برای این کار وجود دارند را معرفی میکنیم. این مراحل به شرح زیر هستند:

• به وجود آوردن جدول ها و دیتابیس
• رکوردهای مورد نیاز در جدول ها ثبت می شوند
• با پایگاه داده ارتباط برقرار می شود
• لینک صفحه بندی داده ها ایجاد می شود و سپس ان را به جدول طراحی شده اضافه میکنیم
• داده های مورد نیاز را از دیتابیس دریافت میکنیم

اجازه دهید در ادامه با یک مثال عینی به آموزش صفحه بندی با php بپردازیم.

به نمایش درآوردن حروف الفبا در صفحات مختلف

بهترین راهی که برای آموزش صفحه بندی با php بنظر می رسد چیزی نیست جز بررسی یک مثال در همین زمینه. برای این منظور ما میخ واهیم با هم بررسی کنیم که چطور می توانیم حروف الفبا را در صفحه های مختلف به کاربر نشان دهیم. هر یک از مرحله های گفته شده در بالا را یک به یک برای این مثال بررسی میکنیم که به شرح زیر خواهد بود:

1. طراحی و ساخت یک دیتابیس در مای اس کیو ال

نخستین مرحله ای که باید آن را انجام دهیم ایجاد یک دیتابیس یا همان پایگاه داده است. شما می توانید به کمک کدنویسی در mysql یک دییتابیس ایجاد کنید. به علاوه راه دیگری که برای این کار وجود دارد استفاده از ابزاری است که phpmyadmin نامیده می شود. با این ابزار ابتدا یک دیتابیس ایجاد میکنیم و نام ان را برای مثال pagination می گذاریم. سپس جدولی هم طراحس کرده و نام آن را برای نمونه alphabet خواهیم گذاشت. درست مانند آنچه که در تصویر مشاهده می کنید. عکس 1

2. متصل شدن به پایگاه داده

مرحله بعدی که در آموزش صفحه بندی با php به بررسی آن می پردازیم ایجاد اتصال بین سایت شما و دیتابیس است. در واثع بعد از اینکه پایگاه داده مورد نظذتان را طراحی کردید ضروری ترین کاری که می ایست انجام دهید چیزی نیست جز همین برقراری ارتباط و متصل کردن ان. به این شکل شما می توانید اطلعاتی که روی پایگاه داده مورد نظر ذخیره شده اند را روی سایت نشان دهید. برای این کار می توانید از دستوی که در زیر آورده شده استفاده کنید:

$conn = mysqli_connect(‘localhost’, ‘root’, ”);

if (! $conn) {

die(“Connection failed” . mysqli_connect_error());

}

else {

mysqli_select_db($conn, ‘pagination’);

}

حال به وسیله دستوری که در زیر مشاهده می کنید قادر هستید به راحتی شماره صفحه ای که در حال حاضر در ان هستید را مشخص کنید:

if (!isset ($_GET[‘page’]) ) {

$page = 1;

} else {

$page = $_GET[‘page’];

}

همانطور که می بینید این کد شماره صفحه ای را نشان می دهد که در حال حاضر کاربر درآن قرار دارد. اگر این مقدار وجود نداشته باشد به صورت پیش فرض صفحه مورد نظر شماره صفحه 1 را خواهد داشت.

آموزش های بیشتر را در مقالات php بخوانید.

3. مشخص کردن فرمولی که برای صفحه بندی استفاده می شود

یکی از مهمترین مراحل در صفحه بندی پی اچ پی همین مشخص کردن فرمولی است که قرار است برای این کار از ان استفاده کنیم. اینکه ما چطور رکوردها را بچینیم با وتجه به نوع دیتا و همینطور حجم انها کاملا متغیر است. اما باید دقت شود که بهترین شیوه و بهینه ترین انها برای این کار انتخاب شود. در مثالی که در حال بررسی ان هستیم ما می خواهیم در هر صفحه تنها 10 رکورد به نمایش دربیاید. پس ما سه صفحه خواهیم داشت که به ضورت زیر هستند:

1. صفحه نخست از حرف A تا J رکوردهای 1 تا 10
2. صفحه دوم از حرف K تا T رکوردهای 11 تا 20
3. صفحه سوم از حرف U تا Z رکوردهای 21 تا 26

برای فرمول صفحه بندی می توانید از دستور زیر استفاده کنید:

$results_per_page = 10;

$page_first_result = ($page-1) * $results_per_page;

در ادامه باید ابتدا تعداد کل صفحه ها حساب شوند. برای این کار باید تعداد رکوردهای جدولی که در این دیتابیس ایجاد کرده ایم مشخص شده و سپس این عدد را بر 10 تقسیم کنیم. در انتها چیزی که به دست می آید تعداد کل صفحه هاست:

$query = “select *from alphabet”;

$result = mysqli_query($conn, $query);

$number_of_result = mysqli_num_rows($result);

//determine the total number of pages available

$number_of_page = ceil ($number_of_result / $results_per_page);

4. اطلاعات از پایگاه داده خوانده می شود

مرحله بعدی از آموزش صفحه بندی با php بازخوانی اطلاعات از پایگاه داده پی اچ پی است. شما باید داده های مورد نیاز خود را از پایگاه داده تان بازیابی کنید و سپس انها را در صفحه هایی که مشخص کرده اید تقسیم کرده و قرار دهید. به این منظور می توانید از دستورهای زیر استفاده کنید:

$query = “SELECT *FROM alphabet LIMIT ” . $page_first_result . ‘,’ . $results_per_page;

$result = mysqli_query($conn, $query);

//display the retrieved result on the webpage

while ($row = mysqli_fetch_array($result)) {

echo $row[‘id’] . ‘ ‘ . $row[‘alphabet’] . ‘</br>’;

}

و در نهایت نوبت به ان می رسد که این صفحه هایی که ایجاد کرده اید را در URL مورد نظرتان به نمایش بگذارید. کد زیر دقیقا این کار را برای شما انجام می دهد:

for($page = 1; $page<= $number_of_page; $page++) {

echo ‘<a href = “index2.php?page=’ . $page . ‘”>’ . $page . ‘ </a>’;

و در نهایت…

اگر تمام دستورات و کدهایی که در بالا گفته شد را پشت سر هم در یک فایل بگذاریم شاهد کد نهایی به شکل زیر خواهیم بود:

<html>

<head>

<title> Pagination </title>

</head>

<body>

<?php

//database connection

$conn = mysqli_connect(‘localhost’, ‘root’, ”);

if (! $conn) {

die(“Connection failed” . mysqli_connect_error());

}

else {

mysqli_select_db($conn, ‘pagination’);

}

//define total number of results you want per page

$results_per_page = 10;

//find the total number of results stored in the database

$query = “select *from alphabet”;

$result = mysqli_query($conn, $query);

$number_of_result = mysqli_num_rows($result);

//determine the total number of pages available

$number_of_page = ceil ($number_of_result / $results_per_page);

//determine which page number visitor is currently on

if (!isset ($_GET[‘page’]) ) {

$page = 1;

} else {

$page = $_GET[‘page’];

}

//determine the sql LIMIT starting number for the results on the displaying page

$page_first_result = ($page-1) * $results_per_page;

//retrieve the selected results from database

$query = “SELECT *FROM alphabet LIMIT ” . $page_first_result . ‘,’ . $results_per_page;

$result = mysqli_query($conn, $query);

//display the retrieved result on the webpage

while ($row = mysqli_fetch_array($result)) {

echo $row[‘id’] . ‘ ‘ . $row[‘alphabet’] . ‘</br>’;

}

//display the link of the pages in URL

for($page = 1; $page<= $number_of_page; $page++) {

echo ‘<a href = “index2.php?page=’ . $page . ‘”>’ . $page . ‘ </a>’;

}

?>

</body>

</html>

در تصویر زیر هم خروجی نهایی این قطعه کد را با هم میبینیم:

عکس 3

استفاده از کدهای CSS برای صفحه بندی

اگر می خواهید سایت جذابی داشته باشید توصصیه مان این است که برای صفحه بندی از کدهای CSS بهره ببرید. در مثال و قطعه کد زیر نمونه ای از یک صفحه بندی جذاب را مشاهده میکنید. برای شروع این کار شما می بایست دو فایل ایجاد کنید:

1. connection.php
2. index1.php

فایل 1 برای وصل شدن به دیتابیس استفاده شده و فایل 2 هم به منظور صفحه بندی مورد استفاده قرار می گیرد. در فایل connection.php کدهای زیر را بذارید:

<?php

$conn = mysqli_connect(‘localhost’, ‘root’, ”);

if (! $conn) {

die(“Connection failed” . mysqli_connect_error());

}

else {

mysqli_select_db($conn, ‘pagination’);

}

?>

در فایل صفحه بندی هم می بایست کدهایی که برای لینک به صفحه ها هستند و همینطور کدهایی که برای طراحی استایل صفحه هستند قرار گیرد:

<html>

<head>

<title>Pagination</title>

<link rel=”stylesheet”

href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css”>

<style>

table {

border-collapse: collapse;

}

.inline{

display: inline-block;

float: right;

margin: 20px 0px;

}

input, button{

height: 34px;

}

.pagination {

display: inline-block;

}

.pagination a {

font-weight:bold;

font-size:18px;

color: black;

float: left;

padding: 8px 16px;

text-decoration: none;

border:1px solid black;

}

.pagination a.active {

background-color: pink;

}

.pagination a:hover:not(.active) {

background-color: skyblue;

}

</style>

</head>

<body>

<center>

<?php

// Import the file where we defined the connection to Database.

require_once “connection.php”;

$per_page_record = 4; // Number of entries to show in a page.

// Look for a GET variable page if not found default is 1.

if (isset($_GET[“page”])) {

$page = $_GET[“page”];

}

else {

$page=1;

}

$start_from = ($page-1) * $per_page_record;

$query = “SELECT * FROM student LIMIT $start_from, $per_page_record”;

$rs_result = mysqli_query ($conn, $query);

?>

<div class=”container”>

<br>

<div>

<h1>Pagination Simple Example</h1>

<p>This page demonstrates the basic

Pagination using PHP and MySQL.

</p>

<table class=”table table-striped table-condensed

table-bordered”>

<thead>

<tr>

<th width=”10%”>ID</th>

<th>Name</th>

<th>College</th>

<th>Score</th>

</tr>

</thead>

<tbody>

<?php

while ($row = mysqli_fetch_array($rs_result)) {

// Display each field of the records.

?>

<tr>

<td><?php echo $row[“Rank”]; ?></td>

<td><?php echo $row[“Name”]; ?></td>

<td><?php echo $row[“College”]; ?></td>

<td><?php echo $row[“Score”]; ?></td>

</tr>

<?php

};

?>

</tbody>

</table>

<div class=”pagination”>

<?php

$query = “SELECT COUNT(*) FROM student”;

$rs_result = mysqli_query($conn, $query);

$row = mysqli_fetch_row($rs_result);

$total_records = $row[0];

echo “</br>”;

// Number of pages required.

$total_pages = ceil($total_records / $per_page_record);

$pagLink = “”;

if($page>=2){

echo “<a href=’index1.php?page=”.($page-1).”‘> Prev </a>”;

}

for ($i=1; $i<=$total_pages; $i++) {

if ($i == $page) {

$pagLink .= “<a class = ‘active’ href=’index1.php?page=”

.$i.”‘>”.$i.” </a>”;

}

else {

$pagLink .= “<a href=’index1.php?page=”.$i.”‘>

“.$i.” </a>”;

}

};

echo $pagLink;

if($page<$total_pages){

echo “<a href=’index1.php?page=”.($page+1).”‘> Next </a>”;

}

?>

</div>

<div class=”inline”>

<input id=”page” type=”number” min=”1″ max=”<?php echo $total_pages?>”

placeholder=”<?php echo $page.”/”.$total_pages; ?>” required>

<button onClick=”go2Page();”>Go</button>

</div>

</div>

</div>

</center>

<script>

function go2Page()

{

var page = document.getElementById(“page”).value;

page = ((page><?php echo $total_pages; ?>)?<?php echo $total_pages; ?>:((page<1)?1:page));

window.location.href = ‘index1.php?page=’+page;

}

</script>

</body>

</html>

و در نهایت خروجی به فرم زیر خواهید داشت:

عکس 4

خلاصه

یکی از مهمترین و کاربردی ترین مباحثی که در پی اچ پی مطرح می شود صفحه بندی یا همان pagination است.  وقتی شما در این پلتفرم، این کار را به خوبی انجام دهید آنگاه مطالب سایتتان به شیوه ای بهتر، بهینه تر و زیباتر به نمایش درمی آیند.

همچنین وقتی مطالبی که در صقحه ها بازگذاری میکنید خیلی زیاد و با حجم بالا نباشند، زمان لود شدن صفحه ها هم کاهش پیدا می کند و در کنار الا رفتن سرعت بارگذاری شمل ظاهری سایتتان هم بهتر خواهد بود. اگر به آموزش php علاقه مند هستید میتوانید اموزش مقدماتی php مداد سبز را ببینید.

در این مطلب از مدادسبز، آموزش صفحه بندی با php پرداخته ایم و به کمک 2 مثال دو روش اصلی برای این کار را به شما نشان داده ایم که امیدواریم این مطالب برایتان مفید واقع شده باشند. دقت کنید که این دو کد به عنوان مثال بوده و شما می توانید روی انها کار کرده و آنها را مطابق میل و سلیقه خود تغییر داده و از انها بهره ببرید.