Step 1 First, create a few important variable in php.
——— Primary variables ————
$totallist
how many listing in total
$totallist = count($ListsToDisplay);
$limit
How many listing per page
——— Derived variables ———–
$page
The current page
$totalpage
How many pages there is
$totalpage = $totallist / $limit;
$start
The first item of the page
if(!empty($page)){ $start = ($page-1)*$limit; }else{ $start=0; }
$prevpage
The previous page
$prevpage = $page-1
$nextpage
The next page
$nextpage = $page+1
$firstpage
The very first page
$firstpage = 0;
$lastpage
The very last page
$lastpage = ceil($totalpage/$limit);
Step 2 Use the variable to slice the array to display for each page
$projectDisplayPaged = array_slice($projectDisplay, $start, $limit);
Step 3 create the pagination using bootstrap
<!---------pagination ----------------> <nav> <ul class="pagination"> <li <?php if($prevpage < 1){ echo "class="disabled""; } ?>> <a href="?page=<?php echo $prevpage ?>" aria-label="Previous"> <span aria-hidden="true">«</span> </a> </li> <?php for($i=0; $i<$totalpage; $i++){ ?> <li <?php if($page==$i+1){ echo "class="active""; }?>><a href="?page=<?php echo $i+1 ?>"><?php echo $i+1 ?></a></li> <?php } ?> <li <?php if($nextpage > $totalpage){ echo "class="disabled""; } ?>> <a href="?page=<?php echo $nextpage ?>" aria-label="Next"> <span aria-hidden="true">»</span> </a> </li> </ul> </nav> </div> <!---------pagination end here---------------->