Personnaliser la pagination

+2
wims
alv
6 participants

Page 1 sur 4 1, 2, 3, 4  Suivant

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Personnaliser la pagination

Message par alv Dim 12 Jan 2014 - 8:28

Bonjour,
J'aimerai personnaliser la pagination des sujets. Ceci : [ Aller à la page: 1, 2, 3]
Comment enlever : [ Aller à la page:, les virgules et ] ? Pour qu'il n'y ai plus que les chiffres, comme sur ce forum.
Merci d'avance.


Dernière édition par alv le Sam 5 Avr 2014 - 19:29, édité 3 fois
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Lun 13 Jan 2014 - 13:11

Very Happy up
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Mar 14 Jan 2014 - 13:09

up svp
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Mer 15 Jan 2014 - 12:28

Up Smile
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par wims Mer 15 Jan 2014 - 23:41

Salut,

Je pense que c'est inhérent à la version de ton forum (mais je peux me tromper).
avatar

wims
**

Messages : 60
Inscrit(e) le : 08/01/2014

http://www.lupsclub.com
wims a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Jeu 16 Jan 2014 - 19:30

Ah, zut !
Je vais attendre voir si quelqu'un me confirme ça.
Merci.
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Ven 17 Jan 2014 - 18:52

Up
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Personnaliser la pagination

Message par WhyNot Sam 18 Jan 2014 - 0:13

Hello,

Dans le template topics_list_box, tu peux trouver cette ligne :
Code:
<span class="gensmall">{topics_list_box.row.GOTO_PAGE}<!-- BEGIN nav_tree -->{topics_list_box.row.TOPIC_NAV_TREE} <!-- END nav_tree --></span>
et la remplacer par :
Code:
<span class="gensmall paginer">{topics_list_box.row.GOTO_PAGE}<!-- BEGIN nav_tree -->{topics_list_box.row.TOPIC_NAV_TREE} <!-- END nav_tree --></span>

Tu peux enregistrer et mettre dans le CSS
Code:
.paginer {
    font-size: 0;
}
.paginer img {
    display: none;
}
.paginer a {
    background-color: #FFFFFF;
    border: 1px solid #000000;
    color: #000000;
    display: inline-block;
    font-size: 9px;
    margin: 0 3px;
    padding: 0 2px;
    text-decoration: none;
}

Tu peux bien sûr modifier les couleurs de fond / d'écriture / de bordure
WhyNot

WhyNot
****

Masculin
Messages : 244
Inscrit(e) le : 25/11/2013

http://whynot.forumactif.org
WhyNot a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Sam 18 Jan 2014 - 6:14

Merci beaucoup.

Comment enlever "Aller à la page :" dans les sujets ?
J'ai essayé avec ton code, mais ça met "Aller à la page :" de la même apparence que les "1", "2", "3"...
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Dim 19 Jan 2014 - 6:53

Up
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par WhyNot Dim 19 Jan 2014 - 20:22

Hello,

Dans viewtopic_body il faut remplacer (présent 2 fois dans le template) :
Code:
<span class="gensmall">{PAGINATION}</span>

par :
Code:
<span class="gensmall paginer_topic">{PAGINATION}</span>

Et le CSS précédent est à remplacer par :
Code:
.paginer,.paginer_topic {
   font-size:0;
}
.paginer img,.paginer_topic img {
   display:none;
}
.paginer a,.paginer_topic a,.paginer_topic b {
   background-color:#FFFFFF;
   border:1px solid #000000;
   color:#000000;
   display:inline-block;
   font-size:9px;
   margin:0 3px;
   padding:0 2px;
   text-decoration:none;
}
.paginer_topic a[onmousedown^='createPagination'] {
   display: none;
}
WhyNot

WhyNot
****

Masculin
Messages : 244
Inscrit(e) le : 25/11/2013

http://whynot.forumactif.org
WhyNot a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Lun 20 Jan 2014 - 19:15

Parfait.
Dernière question : j'ai mis une image vide à la place de la flèche "Précédent" dans "Gestion des images". Le petit problème est que d'avoir mis "padding: 0px 2px 1px 2px" pour les liens, ça met ça aussi pour l'image vide. Comment faire pour que "padding: 0px 2px 1px 2px" ne soit pas sur l'image vide ?
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Mar 21 Jan 2014 - 19:23

Up
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Mer 22 Jan 2014 - 18:05

Up
Very Happy
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Jeu 23 Jan 2014 - 18:36

Up svp
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Ven 24 Jan 2014 - 17:23

Up  aidez moi 
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par Invité Sam 25 Jan 2014 - 9:58

Salut alv,

avec la css cela ne sera pas possible,
par contre ce petit javascript fera l'affaire  Wink .

On va dans un premier temps modifier la C.S.S :
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Supprimes le contenu donné par WhyNot (que je salue au passage)et remplace le par celui-ci:

Code:

.paginer,.paginer_topic
{
font-size:0;
}
.paginer a,.paginer_topic a,.paginer_topic b
{
background-color:#FFFFFF;
border:1px solid #000000;
color:#000000;
display:inline-block;
font-size:9px;
margin:0 3px;
padding:0 2px;
text-decoration:none !important;
}
Penses à cliquer sur le boutonpersonnaliser  popup - Personnaliser la pagination Boutonvalider



Modules/HTML&JAVASCRIPT/
Gestion des codes Javascript/Créer un nouveau Javascript

Mettre un titre explicite : comme (Modifier la pagination)

Cocher "Sur les sujets" .

Dépose ce contenu:

Code:

//on supprime le texte allez a la page
$(function(){
$(".paginer_topic a:first ").remove();
});
//on supprime le  bloc precedent
$(function(){
$(".paginer_topic a:nth-child(2) ").remove();
});

//on supprime le  bloc suivant
$(function(){
$(".paginer_topic a:last-child ").remove();
});


Penses à cliquer sur le boutonpersonnaliser  popup - Personnaliser la pagination Boutonvalider


a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Sam 25 Jan 2014 - 11:31

Merci beaucoup.

Un petit problème :
personnaliser  popup - Personnaliser la pagination 140125113250841808
Sur l'image d'en haut (qui correspond à la pagination au début d'un sujet), tout est bon, mais sur l'image d'en bas (qui correspond à la pagination à la fin d'un sujet), le bloc précédent n'a pas disparu.
J'ai fais toutes les étapes que t'as indiqué.

2ème chose : le javascript ne s'exécute que vers la fin du chargement total de la page. Est-il possible que la suppression des blocs se fasse dès le début du chargement ?

Merci.
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par WhyNot Sam 25 Jan 2014 - 12:07

Hello,

C'est le problème du javascript : il ne s'exécute qu'après chargement de la page pour pouvoir agir sur l'élément (sinon il n'existe pas encore).
Mais en CSS il est possible de supprimer cette image, et là c'est instantané.

Du coup, tu peux remplacer le CSS précédent par celui-ci :
Code:
.paginer, .paginer_topic {
    font-size: 0;
}
.paginer img, .paginer_topic img {
    display: none;
}
.paginer a, .paginer_topic a, .paginer_topic b {
    background-color: #FFFFFF;
    border: 1px solid #000000;
    color: #000000;
    display: inline-block;
    font-size: 9px;
    margin: 0 3px;
    padding: 0 2px;
    text-decoration: none;
}
.paginer_topic a:last-child {
    display: none;
}
.paginer_topic a[onmousedown^="createPagination"] {
    display: none;
}

Et normalement le JS donné par Milouze14 (que je salue également) peut être supprimé aussi. Je viens de tester, ça me semble fonctionner. Smile
WhyNot

WhyNot
****

Masculin
Messages : 244
Inscrit(e) le : 25/11/2013

http://whynot.forumactif.org
WhyNot a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Sam 25 Jan 2014 - 12:52

Merci.
Pour supprimer le bloc précédent, j'ai mis ceci en plus :
Code:
.paginer_topic a:nth-child(2) {
        display: none;
        }
mais ça n'a pas marché.
Je dois mettre quoi ?
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par WhyNot Sam 25 Jan 2014 - 13:42

Quel bloc précédent ? J'ai testé en phpBB2 et je n'ai plus rien que les chiffres des pages scratch
WhyNot

WhyNot
****

Masculin
Messages : 244
Inscrit(e) le : 25/11/2013

http://whynot.forumactif.org
WhyNot a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Sam 25 Jan 2014 - 13:57

Je suis aussi en phpbb2.

Je parle du bloc qui comprend la flèche "précédente". La case vide de l'image du bas :
personnaliser  popup - Personnaliser la pagination 140125113250841808
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par WhyNot Sam 25 Jan 2014 - 14:21

Tu peux me donner le lien d'une page où je peux voir ça ? Je ne l'ai pas sur mon forum, bizarrement
WhyNot

WhyNot
****

Masculin
Messages : 244
Inscrit(e) le : 25/11/2013

http://whynot.forumactif.org
WhyNot a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Sam 25 Jan 2014 - 14:36

L'adresse de mon forum est dans mon profil mais tu ne pourra pas voir le problème, je suis entrain de refaire toute l'apparence et je n'ai pas encore publié le template.


Dernière édition par alv le Mar 4 Mar 2014 - 13:08, édité 1 fois
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Dim 26 Jan 2014 - 14:00

Up Very Happy
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Lun 27 Jan 2014 - 12:32

Up
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par WhyNot Lun 27 Jan 2014 - 21:16

Hello,

Sans voir directement, et sans l'avoir moi-même sur mon forum de test, ça m'est plus difficile de te proposer une solution
WhyNot

WhyNot
****

Masculin
Messages : 244
Inscrit(e) le : 25/11/2013

http://whynot.forumactif.org
WhyNot a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Mar 28 Jan 2014 - 17:26

Merci pour ton aide Very Happy
Peut-être que quelqu'un pourra trouver une solution.

merci
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par WhyNot Mar 28 Jan 2014 - 21:41

Hello,

Je persiste parce que ça m'intrigue, je n'ai pas l'image non plus, avant les pages, comme sur ton image :
personnaliser  popup - Personnaliser la pagination 140125113250841808

A la limite, je veux bien le code source de cette partie (au cas où : sélectionne la ligne complète : CTRL + clic sur la colonne, clic droit, "Code source de la sélection")
WhyNot

WhyNot
****

Masculin
Messages : 244
Inscrit(e) le : 25/11/2013

http://whynot.forumactif.org
WhyNot a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser la pagination

Message par alv Jeu 30 Jan 2014 - 18:31

Voilà le code sur une page liste des sujets :
Code:
<td valign="bottom"><div align="right"><table style="font-size: 11px; text-align: left" border="0" cellpadding="0" cellspacing="0"><tbody><tr><td><span class="gensmall paginer_topic"><script type="text/javascript">
//<![CDATA[
var agt = navigator.userAgent.toLowerCase();
var originalFirstChild;
var display = false;

function msg(message)
{
   if( typeof(console) == "undefined" )
   {
      alert(message);
   }
   else
   {
      console.info( message );
   }
}
function createPagination(which, string, x, y)
{
   if ( display == true )
   {
      destroyPagination();
      display = false;
   }
   else
   {
      display = true;

      if (typeof(originalFirstChild) == "undefined")
      {
         originalFirstChild = document.body.firstChild;
      }

      /* Pour maximiser les compatbilit�s IE6/7/8 en quirk/doctyped */
      var de = !document.documentElement.clientWidth?document.body:document.documentElement;
      x = document.all ? (event.clientX + de.scrollLeft) : x;
      y = document.all ? (event.clientY + de.scrollTop) : y;

      element = document.createElement("div");
      element.style.position = "absolute";
      element.style.zIndex = 1000;
      element.style.visibility = "hidden";
      excessWidth = 0;

      excessHeight = 20;
      element.innerHTML = '<table cellspacing="0" cellpadding="0" border="0" style="width:auto;"><tr><td><span class="gen">' + string + "</span></td></tr></table>";
      renderedElement = document.body.insertBefore(element, document.body.firstChild);
      renderedWidth = renderedElement.offsetWidth;
      renderedHeight = renderedElement.offsetHeight;

      overFlowX = x + renderedWidth + excessWidth - document.body.offsetWidth;
      x = overFlowX > 0 ? x - overFlowX : x;

      overFlowY = y + renderedHeight + excessHeight - window.innerHeight - window.pageYOffset;
      y = overFlowY > 0 ? y - overFlowY : y;

      renderedElement.style.top = (y + 15) + "px";
      renderedElement.style.left = (x + 15) + "px";

      if (agt.indexOf("gecko") != -1 && agt.indexOf("win") != -1)
      {
         setTimeout('renderedElement.style.visibility = "visible"', 1);
      }
      else
      {
         renderedElement.style.visibility = "visible";
      }
   }
}

function Pagination()
{
}

function do_pagination_start()
{
   var start = document.go_page.start.value;
   start = (start > 2) ? 2 : start;
   start = (start - 1) * 40;
   start = (isNaN(start) || start < 0 ) ? 0 : start;

self.location.href = start ? ['','f42p'+start+'-l-asse-80-ans-saint-etienne-3208-matchs-depuis-1933'].join('/') : ['','f42-l-asse-80-ans-saint-etienne-3208-matchs-depuis-1933'].join('/');

}

function destroyPagination()
{
   if (document.body.firstChild != originalFirstChild)
   {
      document.body.removeChild(document.body.firstChild);
   }
}
//]]>
</script><a href="javascript:Pagination();" onmousedown="createPagination(this, '<form name=&quot;go_page&quot; ><table class=&quot;forumline&quot; cellpadding=&quot;5&quot; cellspacing=&quot;1&quot; border=&quot;0&quot; width=&quot;150&quot;><tr><th class=&quot;thHead&quot;>Aller à la page</th></tr><tr><td class=&quot;row1&quot; align=&quot;center&quot;><input type=&quot;text&quot; class=&quot;bginput&quot; name=&quot;start&quot; size=&quot;5&quot; onKeyPress=&quot;if (event.keyCode==13) { do_pagination_start();return false; }&quot; /> <input type=&quot;button&quot; class=&quot;button&quot; value=&quot;Aller&quot; onclick=&quot;do_pagination_start();return false;&quot; /></td></tr></table></form>', event.pageX, event.pageY);">Aller à la page</a> : <b>1</b>, <a href="/f42p40-l-asse-80-ans-saint-etienne-3208-matchs-depuis-1933?tt=1">2</a>  <a href="/f42p40-l-asse-80-ans-saint-etienne-3208-matchs-depuis-1933?tt=1"><img src="http://2img.net/i/fa/empty.gif" alt="Suivant"></a></span><br><span style="font-size: 5px"><br></span></td></tr></tbody></table></div></td>
alv

alv
Membre habitué

Messages : 1542
Inscrit(e) le : 09/07/2012

https://www.forumpeuplevert.com
alv a été remercié(e) par l'auteur de ce sujet.

Page 1 sur 4 1, 2, 3, 4  Suivant

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum