Classe de pagination en PHP5 et CSS blog NetZen inspiration internet

Blog NetZen

Blog NetZen

Classe de pagination en PHP5 et CSSPHP | ASP


Tags : css | css2 | css3 | html5 | php5 |

Dans tout site internet ou blog, on trouve toujours un système de pagination pour afficher des articles. Ces articles issues d'une base de données peuvent être filtrer avec des catégories ou des tags. Le Blog de NetZen n'échappe pas à la règle ! Mais si nombres d'exemples ou tutoriel sont disponibles avec un bon moteur de recherche comme Google, peu sont fonctionnels et aux normes du W3C. Voici la version de NetZen...

Classe de pagination en PHP5 et CSS
Classe de pagination en PHP5 et CSS© NetZen 2010

Aujourd'hui avec le CSS 2 et demain le CSS 3, soyez moderne et gagner du temps !
Utilisez les listes ordonnées.

<ol>
<li><a href="recherche.php?page=1" rel="precedent"></a></li>
<li><a href="recherche.php?page=1">1</a></li>
<li class="selected">2</li>
<li><a href="recherche.php?page=4">3</a></li>
<li><a href="recherche.php?page=3">4</a></li>
<li><a href="recherche.php?page=3" rel="suivant"></a></li>
</ol>

Ajoutons maintenant la décoration pour transformer cette liste de puces en système de pagination.

ol.pagination { list-style:none; text-align:center; margin:25px 0 0; padding:0;}
ol.pagination li { display:inline; }
ol.pagination a, ol.pagination li.selected { font-weight:bold; background-color:white; line-height:14px; margin:0 2.5px 0 0; padding:2.5px 5px; border:1px solid #d8cdbf; text-decoration:none; font-family: Arial, Helvetica; font-size:14px; border-radius:7.5px; -o-border-radius:7.5px; -moz-border-radius:7.5px; -webkit-border-radius:7.5px; -moz-box-shadow: 1px 1px 1px #999; -webkit-box-shadow: 1px 1px 1px #999; box-shadow: 1px 1px 1px #999;}
ol.pagination a:hover, ol.pagination a:focus { background-color:#e85420; color:white;}
ol.pagination li.selected { background-color:#95809f; color:white;}
ol.pagination a[rel="precedent"]:before { content: "«";}
ol.pagination a[rel="suivant"]:after { content: "»";}

Attention la syntaxe a[rel="suivant"]:before n'est pas comptabible avec la vieille version d'Internet Explorer 6.0 ! Attaquons maintenant la classe PHP pour gérer la pagination. La classe initiale provient du site de snoupix et a été améliorée pour générer le code CSS.

Fichier "class-pagination.php"

<?php
class Pagination{
/**
* Fonction qui retourne une div de pagination en fonction de plusieurs paramètres
* @return $html une chaine contenant une div.
* @param object $chemin
* @param object $nomget
* @param object $total
* @param object $courante[optional]
* @param object $affichage[optional]
*/
public static function affiche($chemin,$nomget,$total,$courante=1,$affichage=2){
//variable contenant le code HTML a retourner
$html = '';
//Si il n'y a pas plus d'une page on renvoit rien...
if($total<=1)
return $html;
		
$precedent = $courante-1;
$suivant = $courante+1;
$textePrecedent = '«';
$texteSuivant = '»';
			
$html .= '<ol class="pagination">';
$html .= "\n\t\t\t";
			
/*Boutons précédent*/
if ($courante == 2) // si on est sur la page 2, Nous retournons sur la page initiale (permet d'éviter les doublons index.php et index.php?page=1)
{$html.= Pagination::lien($chemin,$textePrecedent,$precedent,1);}
elseif($courante > 2) // si la page courante est supérieure à 2 le bouton précédent renvoit sur la page dont le numéro est immédiatement inférieur
{$html.= '<li>';
$html.= Pagination::lien($chemin,$textePrecedent,$nomget,$precedent);

$html.= '</li>';}		
	
/*Affichage des numéros des pages*/
if($total < 7 + $affichage*2){
			
//affiche tous les numéros				
$html.= "\n\t\t\t";
$html.= '<li>';
$html.= ($courante == 1) ? '
  • 1</li>' : Pagination::lien($chemin,'1',$nomget,1); $html.= '</li>'; // On boucle toutes les pages restantes boucle for for ($i = 2; $i <= $total; $i++){ if ($i == $courante) // La page courante est affichée différemment {$html.= "\n\t\t\t"; $html.= '<li class="selected">'.$i.'</li>'; $html.= "\n\t\t";} else {$html.= "\n\t\t\t"; $html.= '<li>'; $html.= Pagination::lien($chemin,$i,$nomget,$i); $html.= '</li>'; $html.= "\n\t\t";} } } elseif($total > 5 + ($affichage * 2)){ /*Il y'en a trop donc il va falloir des "..." */ if($courante < 1+($affichage * 2)){ $html.= ($courante == 1) ? '<li class="selected>1</li>' : Pagination::lien($chemin,'1',$nomget,1); // On boucle toutes les pages restantes boucle for for($i = 2; $i < 4 + ($affichage * 2); $i++){ if ($i == $courante)// La page courante est affichée différemment $html.= '<li class="selected">'.$i.'</li>'; else {$html.= "\n\t\t\t"; $html.= '<li>'; $html.= Pagination::lien($chemin,$i,$nomget,$i); $html.= '</li>'; $html.= "\n\t\t";} } // les ... pour marquer la troncature $html.= "<li>...</li>"; // et enfin les deux dernières pages $html.= "\n\t\t\t"; $html.= '<li>'; $html.= Pagination::lien($chemin,$total-1,$nomget,$total-1); $html.= '
  • '; $html.= "\n\t\t"; $html.= "\n\t\t\t"; $html.= '
  • '; $html.= Pagination::lien($chemin,$total,$nomget,$total); $html.= '
  • '; $html.= "\n\t\t"; }elseif($total - ($affichage * 2) > $courante && $courante > ($affichage * 2)){ // on affiche les deux premières pages $html.= "\n\t\t\t"; $html.= '
  • '; $html.= Pagination::lien($chemin,'1',$nomget,1); $html.= '
  • '; $html.= "\n\t\t"; $html.= '
  • '; //$html.= Pagination::lien($chemin,'2',$nomget,2); //$html.= '
  • '; //$html.= "\n\t\t"; // les ... pour marquer la troncature $html.= "
  • ...
  • "; // puis sept pages : les trois précédent la page courante, la page courante, puis les trois lui succédant for ($i= $courante - $affichage; $i<= $courante + $affichage; $i++){ if ($i== $courante) $html.= '
  • '.$i.'
  • '; else {$html.= "\n\t\t\t"; $html.= '
  • '; $html.= Pagination::lien($chemin,$i,$nomget,$i); $html.= '
  • '; $html.= "\n\t\t";} } // les ... pour marquer la troncature $html.= "
  • ...
  • "; // et enfin les deux dernière spages $html.= '
  • '; //$html.= Pagination::lien($chemin,$total-1,$nomget,$total-1); $html.= '
  • '; $html.= "\n\t\t\t"; $html.= '
  • '; $html.= Pagination::lien($chemin,$total,$nomget,$total); $html.= '
  • '; $html.= "\n\t\t"; } else{ // on affiche les deux premières pages $html.= "\n\t\t\t"; $html.= '
  • '; $html.= Pagination::lien($chemin,'1',$nomget,1); $html.= '
  • '; $html.= "\n\t\t"; $html.= '
  • '; $html.= Pagination::lien($chemin,'2',$nomget,2); $html.= '
  • '; // les ... pour marquer la troncature $html.= "
  • ...
  • "; // et enfin les neuf dernières pages for ($i = $total - (2 + ($affichage * 2)); $i <= $total; $i++){ if ($i == $courante) $html.= '
  • '.$i.'
  • '; else {$html.= "\n\t\t\t"; $html.= '
  • '; $html.= Pagination::lien($chemin,$i,$nomget,$i); $html.= '
  • '; $html.= "\n\t\t";} } } } /*Bouton suivant*/ if ($courante < $total) {$html.= '
  • '; $html.= Pagination::lien($chemin,$texteSuivant,$nomget,$suivant); $html.= '
  • ';} $html .= "\n\t\t"; $html .= ''; $html .= "\n\t\t"; echo $html; } /** * Méthode qui renvoit un lien en fonction de plusieurs paramètres * @return $lien un lien * @param object $chemin notre fichier * @param object $texte texte du lien * @param object $parametre[optional] parametre GET * @param object $valeur[optional] valeur du parametre GET */ public static function lien($chemin,$texte,$parametre='',$valeur=''){ $lien = '<a href="'.$chemin; if(!empty($parametre)) $lien .= $valeur; $lien .= '.php?phpMyAdmin=f58a550c4de42d5b37ffd0628efed39e">'.$texte.'</a>'; return $lien; } } ?>

    La classe est enfin appelée dans un fichier principale avec la syntaxe suivante (il faut bien évidemment ajouter la ligne d'inclusion

    require_once($_SERVER['DOCUMENT_ROOT'].'class-pagination.php');
    Pagination::affiche('$url','$variable',$nombre_de_pages_total,$page_courante,$nombre-articles_par_page);   
    

    Cette classe fonctionne quelque soit le chemin et en mode rewriting.

    Démo Net Zen Classe PHP 5 pagination et CSS

    Site de Snoupix

    Démo Net Zen Classe PHP 5 pagination et CSS Site de Snoupix
    Partager cet article du blog sur Facebook

    Scoop.it

    Article meme theme Blog

    Autre(s) article(s) Blog NetZen

    Message, commentaires Blog NetZen

    Commentaire sur l'article du Blog NetZen