How To Add Pagination Into List of Records or WordPress Plugin

by in WordPress on 22nd Jun 2009 · Comments

Often in many application, such as in WordPress Plugin, we will need to deal with list of records. As the records grow, more records will need to be displayed. There is a catch though, if you retrieve all the records at one go because it will slow the system down.

In order to have a better user experience for record listing, paging comes into play. It'll not only help to organize the records by limiting the number of records you want to show per page, it also cuts the down the time of retrieving records. Therefore, pagination plays a very important part in providing a great user experience when interacting with the data.

Adding Pagination


Imaging if you have a list of 1000 or more records that you want to display. Without pagination, listing all the records will definitely take quite awhile and also increase the load for the database server when executing the query. This is not very efficient, even though retrieving records from database can be cheap.

Now let's say we want to add in pagination into the 1000 records, by specifying the limit, it will only shows the exact amount of records you want to view. This is a huge benefit for the database server load, because we are not retrieving all the records at once.

Below examples are 2 different type of pagination and a demo on how to add pagination into WordPress Plugin.

Simple PHP Pagination Class

Copy the following code and save as pager.php, this file will be the pagination class. With this pagination class from Happycodings, it'd help us add pagination to the list of records easily.

<?php
function findStart($limit) { 
	if ((!isset($_GET['page'])) || ($_GET['page'] == "1")) { 
    	$start = 0; 
    	$_GET['page'] = 1; 
    } else { 
       	$start = ($_GET['page']-1) * $limit; 
    } 
	return $start; 
}
 
  /*
   * int findPages (int count, int limit) 
   * Returns the number of pages needed based on a count and a limit 
   */ 
function findPages($count, $limit) { 
     $pages = (($count % $limit) == 0) ? $count / $limit : floor($count / $limit) + 1; 

     return $pages; 
} 

/* 
* string pageList (int curpage, int pages) 
* Returns a list of pages in the format of "« < [pages] > »" 
**/ 
function pageList($curpage, $pages) 
{ 
	$page_list  = ""; 

    /* Print the first and previous page links if necessary */ 
    if (($curpage != 1) && ($curpage)) { 
       $page_list .= "  <a href=\" ".$_SERVER['PHP_SELF']."?page=1\" title=\"First Page\">«</a> "; 
    } 

    if (($curpage-1) > 0) { 
       $page_list .= "<a href=\" ".$_SERVER['PHP_SELF']."?page=".($curpage-1)."\" title=\"Previous Page\"><</a> "; 
    } 

    /* Print the numeric page list; make the current page unlinked and bold */ 
    for ($i=1; $i<=$pages; $i++) { 
    	if ($i == $curpage) { 
         	$page_list .= "<b>".$i."</b>"; 
        } else { 
         	$page_list .= "<a href=\" ".$_SERVER['PHP_SELF']."?page=".$i."\" title=\"Page ".$i."\">".$i."</a>"; 
        } 
       	$page_list .= " "; 
      } 

     /* Print the Next and Last page links if necessary */ 
     if (($curpage+1) <= $pages) { 
       	$page_list .= "<a href=\"".$_SERVER['PHP_SELF']."?page=".($curpage+1)."\" title=\"Next Page\">></a> "; 
     } 

     if (($curpage != $pages) && ($pages != 0)) { 
       	$page_list .= "<a href=\"".$_SERVER['PHP_SELF']."?page=".$pages."\" title=\"Last Page\">»</a> "; 
     } 
     $page_list .= "</td>\n"; 

     return $page_list; 
}
 
/*
* string nextPrev (int curpage, int pages) 
* Returns "Previous | Next" string for individual pagination (it's a word!) 
*/ 
function nextPrev($curpage, $pages) { 
 $next_prev  = ""; 

	if (($curpage-1) <= 0) { 
   		$next_prev .= "Previous"; 
	} else { 
   		$next_prev .= "<a href=\"".$_SERVER['PHP_SELF']."?page=".($curpage-1)."\">Previous</a>"; 
	} 

 		$next_prev .= " | "; 

 	if (($curpage+1) > $pages) { 
   		$next_prev .= "Next"; 
    } else { 
       	$next_prev .= "<a href=\"".$_SERVER['PHP_SELF']."?page=".($curpage+1)."\">Next</a>"; 
    } 
     	return $next_prev; 
    } 
} 
?> 

Once you have the pager.php, instantiate the class as below. Change the $limit to your desired number of records to show per page and finally get the page list by echoing it out.

/* Instantiate class */ 
require_once("pager.php"); 
$p = new Pager; 

/* Show many results per page? */ 
$limit = 100; 

/* Find the start depending on $_GET['page'] (declared if it's null) */ 
$start = $p->findStart($limit); 

/* Find the number of rows returned from a query; Note: Do NOT use a LIMIT clause in this query */ 
$count = mysql_num_rows(mysql_query("SELECT field FROM table")); 

/* Find the number of pages based on $count and $limit */ 
$pages = $p->findPages($count, $limit); 

/* Now we use the LIMIT clause to grab a range of rows */ 
$result = mysql_query("SELECT * FROM table LIMIT ".$start.", ".$limit); 

/* Now get the page list and echo it */ 
$pagelist = $p->pageList($_GET['page'], $pages); 
echo $pagelist; 

/* Or you can use a simple "Previous | Next" listing if you don't want the numeric page listing */ 
//$next_prev = $p->nextPrev($_GET['page'], $pages); 
//echo $next_prev; 
/* From here you can do whatever you want with the data from the $result link. */ 

Digg Style Pagination

As the above simple pagination class is enough for us to display a list of page numbering for the records, but what will happen if there are a few hundreds of pages, isn't the row of page numbering going to be very long too?

Here is another nice Digg Style Pagination class that you can consider if you think there will be a lot of pages for your records.

Download the pagination.class.php.

Go through the guide to customize the style or desired output for the paging you want. Now, to give you a clearer view on how to add this Digg Style Pagination class. Check out below to find out how to add the Digg Style Pagination to a WordPress Plugin.

How To Add Pagination To WordPress Plugin?

If you are building a WordPress plugin that require to display a list of records from database. As records get huge, you will need to have pagination so that you can organize your records well.

Wordpress Plugin with Digg Style Pagniation

First, you will need to download the pagination.class.php and save it in your WordPress Plugin folder.

Next, in the PHP file that you want to list your records, insert the following code. Below are some of the methods we used from the pagination class. For the full list of methods, please refer to Digg Style Pagination Class Help Page.

Note that you will need to change the SQL query, pagination class configuration and table fields, in order to work nicely with your WordPress Plugin.

<?php

$items = mysql_num_rows(mysql_query("SELECT * FROM wp_table;")); // number of total rows in the database

if($items > 0) {
		$p = new pagination;
		$p->items($items);
		$p->limit(30); // Limit entries per page
		$p->target("admin.php?page=list_record"); 
		$p->currentPage($_GET[$p->paging]); // Gets and validates the current page
		$p->calculate(); // Calculates what to show
		$p->parameterName('paging');
		$p->adjacents(1); //No. of page away from the current page
				
		if(!isset($_GET['paging'])) {
			$p->page = 1;
		} else {
			$p->page = $_GET['paging'];
		}
		
		//Query for limit paging
		$limit = "LIMIT " . ($p->page - 1) * $p->limit  . ", " . $p->limit;
		
} else {
	echo "No Record Found";
}

?>

//Now we'll display the list of records

<div class="wrap">
	<h2>List of Records</h2>

<div class="tablenav">
    <div class='tablenav-pages'>
        <?php echo $p->show();  // Echo out the list of paging. ?>
    </div>
</div>

<table class="widefat">
<thead>
	<tr>
		<th>ID</th>
		<th>Full Name</th>			
		<th>Email</th>
	</tr>
</thead>
<tbody>

$sql = "SELECT *  FROM $wp_table ORDER BY id DESC $limit";
$result = mysql_query($sql) or die ('Error, query failed');

if (mysql_num_rows($result) > 0 ) {
	while ($row = mysql_fetch_assoc($result)) {
            $id             = $row['id'];
            $fullname  = $row['fullname'];
            $email       = $row['email'];

        <tr>
            <td><?php echo $id; ?></td>
            <td><?php echo $fullname; ?></td>
            <td><?php echo $email; ?></td>	
        </tr>
<?php } 
} else { ?>
        <tr>
	    <td>No Record Found!</td>
        <tr>	
<?php } ?>
</tbody>
</table>
</div>

Now you know How to Add a Digg Style Pagination to a WordPress Plugin, it should make your listing of data much more efficient. Pagination saves your time and bandwidth so you can concentrate more on other implementing issues.

Still not sure about this tutorial on adding pagination? Or simply have an idea to share? Feel free to contact us or leave a comment here!

Terrance is a versatile web developer and the technical editor at OXP. He enjoys creating functional websites and is particularly engrossed in all the tiny details mixed together to construct great user experiences. He always believe that every web user deserves the best!