Ok, So here it is..
Suppose, you want to display only 08 links per page.
So we are first going to write the whole code, which will be displayed on page as follows..
[1] Index Page as below... Save it as index.php
PHP Code:
//connect to the database
include_once ('db.php'); // code for this page is at [2]
//get the function
include_once ('paginate_function.php'); // code for this page is at [3]
$page = (int) (!isset($_GET["page"]) ? 1 : $_GET["page"]);
$limit = 8; // number of links to be displayed per page
$startpoint = ($page * $limit) - $limit;
//to make pagination
$statement = "`list_id`";
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Playing with Arrays</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link href="pagination.css" rel="stylesheet" type="text/css" /> @[4]
<link href="green_tab.css" rel="stylesheet" type="text/css" /> @[5]
<style type="text/css">
.records {
width: 510px;
margin: 5px;
padding:2px 5px;
border:1px solid #B6B6B6;
}
.record {
color: #474747;
margin: 5px 0;
padding: 3px 5px;
background:#E6E6E6;
border: 1px solid #B6B6B6;
cursor: pointer;
letter-spacing: 2px;
}
.record:hover {
background:#D3D2D2;
}
.round {
-moz-border-radius:8px;
-khtml-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius:8px;
}
p.createdBy{
padding:5px;
width: 510px;
font-size:15px;
text-align:center;
}
p.createdBy a {color: #666666;text-decoration: none;}
</style>
</head>
<body>
<div class="records round">
<?php
//show records
$query = mysql_query("SELECT * FROM {$statement} LIMIT {$startpoint} , {$limit}");
while ($row = mysql_fetch_assoc($query)) {
?>
<div class="record round"> <a href="http://www.google.com/<?php echo $row['movie_id']; ?>"> <?php echo $row['movie_id'];?> </a> | <a href="http://www.google.com/<?php echo $row['celeb_id']; ?>"> <?php echo $row['celeb_id'];?> </a> </div>
<?php
}
?>
</div>
<?php
echo pagination($statement,$limit,$page);
?>
</body>
</html>
[2] Now, for the db.php .. Save it as db.php
PHP Code:
$connect = mysql_connect("localhost", "root", ""); // connection to database host using database URL, username and password
mysql_select_db("moviearray", $connect); // connection to database
[3] Now, let's write down the code of Pagination in another php page and we already called it at top in php code... Save it as paginate_function.php
PHP Code:
function pagination($query, $per_page = 8,$page = 1, $url = '?'){
$query = "SELECT COUNT(*) as `num` FROM `list_id`";
$row = mysql_fetch_array(mysql_query($query));
$total = $row['num'];
$adjacents = "2";
$page = ($page == 0 ? 1 : $page);
$start = ($page - 1) * $per_page;
$prev = $page - 1;
$next = $page + 1;
$lastpage = ceil($total/$per_page);
$lpm1 = $lastpage - 1;
$pagination = "";
if($lastpage > 1)
{
$pagination .= "<ul class='pagination'>";
$pagination .= "<li class='details'>Page $page of $lastpage</li>";
if ($lastpage < 7 + ($adjacents * 2))
{
for ($counter = 1; $counter <= $lastpage; $counter++)
{
if ($counter == $page)
$pagination.= "<li><a class='current'>$counter</a></li>";
else
$pagination.= "<li><a href='{$url}page=$counter'>$counter</a></li>";
}
}
elseif($lastpage > 5 + ($adjacents * 2))
{
if($page < 1 + ($adjacents * 2))
{
for ($counter = 1; $counter < 4 + ($adjacents * 2); $counter++)
{
if ($counter == $page)
$pagination.= "<li><a class='current'>$counter</a></li>";
else
$pagination.= "<li><a href='{$url}page=$counter'>$counter</a></li>";
}
$pagination.= "<li class='dot'>...</li>";
$pagination.= "<li><a href='{$url}page=$lpm1'>$lpm1</a></li>";
$pagination.= "<li><a href='{$url}page=$lastpage'>$lastpage</a></li>";
}
elseif($lastpage - ($adjacents * 2) > $page && $page > ($adjacents * 2))
{
$pagination.= "<li><a href='{$url}page=1'>1</a></li>";
$pagination.= "<li><a href='{$url}page=2'>2</a></li>";
$pagination.= "<li class='dot'>...</li>";
for ($counter = $page - $adjacents; $counter <= $page + $adjacents; $counter++)
{
if ($counter == $page)
$pagination.= "<li><a class='current'>$counter</a></li>";
else
$pagination.= "<li><a href='{$url}page=$counter'>$counter</a></li>";
}
$pagination.= "<li class='dot'>..</li>";
$pagination.= "<li><a href='{$url}page=$lpm1'>$lpm1</a></li>";
$pagination.= "<li><a href='{$url}page=$lastpage'>$lastpage</a></li>";
}
else
{
$pagination.= "<li><a href='{$url}page=1'>1</a></li>";
$pagination.= "<li><a href='{$url}page=2'>2</a></li>";
$pagination.= "<li class='dot'>..</li>";
for ($counter = $lastpage - (2 + ($adjacents * 2)); $counter <= $lastpage; $counter++)
{
if ($counter == $page)
$pagination.= "<li><a class='current'>$counter</a></li>";
else
$pagination.= "<li><a href='{$url}page=$counter'>$counter</a></li>";
}
}
}
if ($page < $counter - 1){
$pagination.= "<li><a href='{$url}page=$next'>Next</a></li>";
$pagination.= "<li><a href='{$url}page=$lastpage'>Last</a></li>";
}else{
$pagination.= "<li><a class='current'>Next</a></li>";
$pagination.= "<li><a class='current'>Last</a></li>";
}
$pagination.= "</ul>\n";
}
return $pagination;
}
[4] Now CSS file for Styling the Pagination .. Save it as pagination.css
HTML Code:
ul.pagination{
margin:0px;
padding:0px;
height:100%;
overflow:hidden;
font:12px 'Tahoma';
list-style-type:none;
}
ul.pagination li.details{
padding:7px 10px 7px 10px;
font-size:14px;
}
ul.pagination li.dot{padding: 3px 0;}
ul.pagination li{
float:left;
margin:0px;
padding:0px;
margin-left:5px;
}
ul.pagination li:first-child{
margin-left:0px;
}
ul.pagination li a{
color:black;
display:block;
text-decoration:none;
padding:7px 10px 7px 10px;
}
ul.pagination li a img{
border:none;
}
[5] Now Specific Color Tabs for Numbers.. Save it as green_tab.css
HTML Code:
ul.pagination li.details{
color:#699613;
}
ul.pagination li a
{
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
padding:6px 9px 6px 9px;
}
ul.pagination li a
{
color: #fff;
background:#699613;
background:-moz-linear-gradient(top,#87AB19,#699613);
background:-webkit-gradient(linear,0 0,0 100%,from(#87AB19),to(#699613));
}
ul.pagination li a:hover,
ul.pagination li a.current
{
color:#4F7119;
background:#E7F2C7;
}
At Last, if you also want Database I used to see it working fully, just import the Sql file..
Sending an Attachment with this Mail.. Download it and use as you like to... playingwitharrays.zip
Bookmarks