Pagination / Sidbläddring med PHP & Mysql

Ska man hämta och visa många poster från databasen, t ex nyheter, kan man dela upp resultatet på flera sidor. Då sparar man sidladdningstid och besökaren slipper skrolla så mycket. Här är ett exempel på hur man skriver kod för att bläddra mellan sidor (på engelska "pagination").

<?php

//**** Öppna databasen ****

// Antal poster per sida
$rowsperpage=10;

// Aktuell sida
$pageSide=(isset($_GET["ps"]) && is_numeric($_GET["ps"]) && $_GET["ps"]>0 ? $_GET["ps"] : 1);

// Startpost
$offset=($pageSide>1 ? ($pageSide-1)*$rowsperpage : 0 );

// Visa posterna
$query="SELECT * FROM news LIMIT $offset, $rowsperpage"; 
$result=mysql_query($query);
while($row=mysql_fetch_array($result)){
echo $row['post'] . '<br>';}

// Totala antalet poster i tabellen
$query="SELECT COUNT(id) FROM news";
$result=mysql_query($query);
$row=mysql_fetch_array($result);
$total = $row[0];

// Totala antalet sidor
$maxpage=ceil($total/$rowsperpage);

// Visa navigeringen
?><div class="news_nav">
    <ul>
        <?php if($pageSide>1){?>
            <li><a href="?"><<</a></li>
            <li><a href="?ps=<?= $pageSide-1 ?>"><</a></li>
       <?php }else{ ?>
           <li class="inactive_page"><<</li>
           <li class="inactive_page"><</li>
       <?php } ?>
      <?php
        for($i=1; $i<=$maxpage; $i++){
          if($pageSide==$i)
             echo "<li class=\"current_page\">".$i."</li>";
          else
             echo '<li><a href="?ps='.$i.'">'.$i.'</a></li>';
        }
      ?>
     <?php if($pageSide<$maxpage){?>
        <li><a href="?ps=<?= $pageSide+1 ?>">></a></li>
        <li><a href="?ps=<?= $maxpage ?>"> >></a></li>
     <?php }else{ ?>
        <li class="inactive_page">>></li>
        <li class="inactive_page">></li>
      <?php } ?>
    </ul>
</div>

.news_nav ul {
display:block;
border:none;
text-transform:uppercase;
}
.news_nav ul li {
list-style:none;
float:left;
border:1px solid #FFF;
text-decoration:none;
margin:0 5px 0 0;
padding:0 5px;
}
.news_nav ul li:hover {
border:1px solid #000;
}
.news_nav ul li.current_page {
border:1px solid #000;
color:#000;
font-weight:bold;
background-color:#FFF;
}
.news_nav ul li.inactive_page, .news_nav ul li.inactive_page:hover {
border:1px solid #666;
color:#666;
}
.news_nav ul li a{line-height:normal;}