Paginación en WordPress

Hoy buscando una forma rápida y practica de lograr una forma mas fácil de navegar entre las paginas mas antiguas y nuevas del blog (Podrás verlo abajo funcionando), descubro en La mate por un yogur un plugin que nos ayudara a lograrlo de forma fácil y rápida. WP Digg Style Pagination es un plugin para WordPress creado por mis-algoritmos y es precisamente este plugin quien nos facilitara paginar nuestra entradas del blog, y así eliminar el típico “siguiente - anterior” que a veces nos confunde.
Vayamos ahora paso por paso para instalarlo.

Instalacion:

  1. Descargamos el plugin WP Digg Style Pagination
  2. Descomprimimos el archivo y copiamos el archivo pagination.php en la carpeta plugin de wordpress “wp-content/plugins”
  3. En nuestro panel de control hacemos click en “Plugin” y activamos el plugin que acabamos de subir “WP Digg Style Pagination”
  4. Para que nuestro plugin funcione debemos eliminar el antiguo código que muestra el típico “siguiente - anterior” e introducir nuestro nuevo código que hará referencia a nuestro plugin de paginación. Entonces ahora procederemos a buscar ese código en nuestro theme.
  5. En nuestro Panel de control seleccionamos “Presentación” y “Luego “Editor de Temas”
  6. Buscaremos el código a modificar en nuestra “Plantilla de la página principal”(index.php) que será algo similar a esto:

  7. Una vez ubicado nuestro código, lo eliminamos y en su lugar pegaremos el código que hará referencia a nuestro plugin de paginación:
  8. PHP:
    1. <?php
    2.     if(function_exists('pagination'))
    3.         pagination(2,array("Anterior","Siguiente"));
    4. ?>

  9. Guardamos los cambios

Darle algun estilo:
Ahora viene la mejor parte darle un estilo para que haga juego con nuestro diseño. El estilo que vez en la foto del post y vez funcionando ya en xybeneticos es el estilo Flickr. Como veras su diseño y colores son iguales. ¿Cómo damos esos estilo? En este caso le daremos el estilo Flickr. Para lograrlo, nos vamos a la hoja de estilos de nuestro theme (Style.css) y pegamos el siguiente código.

CSS:
  1. /*CSS Flickr style pagination*/
  2. div.pagination {
  3. padding: 3px;
  4. margin: 3px;
  5. text-align:center;
  6. }
  7.  
  8. div.pagination a {
  9. border: 1px solid #dedfde;
  10. margin-right:3px;
  11. padding:2px 6px;
  12.  
  13. background-position:bottom;
  14. text-decoration: none;
  15.  
  16. color: #0061de;
  17. }
  18. div.pagination a:hover, div.meneame a:active {
  19. border: 1px solid #000;
  20. background-image:none;
  21. background-color:#0061de;
  22. color: #fff;
  23. }
  24. div.pagination span.current {
  25. margin-right:3px;
  26. padding:2px 6px;
  27.  
  28. font-weight: bold;
  29. color: #ff0084;
  30. }
  31. div.pagination span.disabled {
  32. margin-right:3px;
  33. padding:2px 6px;
  34.  
  35. color: #adaaad;
  36. }

Guardado los cambios, ya hemos terminado, nuestra paginación esta funcionando a la perfección y tiene el estilo de Flickr.

BONUS

En mis-algoritmos encontraremos mas codigos CSS para darle un estilo diferente, por ejemplo el estilo de Meneame, Digg, etc.

Ej:

Si aun le quedan dudas en el foro de Mis Algoritmos encontrar una sección para dudas o bien visita el artículo original. Si bien el sitio esta en ingles, no te preocupes porque habla español a la perfección, por lo tanto haz tus preguntas de forma natural.

 

Descarga Plugin Estilos Post Original Foro ayuda

  1. User Gravatar

    Arturo goga said,

    Wrote on May 28, 2007 @ 3:03

    Muy bueno! Acabo de instalarlo en mi blog, y está funcionando genial. Gracias por el dato!

  2. User Gravatar

    Paginación en WordPress | Infected-FX| tutoriales, photoshop brushes y recursos para diseñadores web said,

    Wrote on May 28, 2007 @ 3:32

    [...] Nikko nos explica a detalle la cómo poder ponerle una paginación mucho más eficiente a nuestro WordPress. www.xyberneticos.com [...]

  3. User Gravatar

    WP Digg Style Pagination: Plugin para paginación en WordPress « Cosas sencillas said,

    Wrote on May 28, 2007 @ 7:10

    [...] En el blog de XYBERNETICOS amplia un poco más el tema sobre la Paginación en WordPress. [...]

  4. User Gravatar

    Juan said,

    Wrote on May 28, 2007 @ 8:42

    Que bien, yo ya habia implementado uno así pero sin estilo. a cambiarlo...

  5. User Gravatar

    diarioTHC said,

    Wrote on May 28, 2007 @ 10:09

    Buenas Nikko:

    En las colaboración que te mande hace unos días, también hay un plugin para hacer lo mismo. No lo e probado pero pinta bastante bien.

    URL: http://www.lesterchan.net/wordpress/readme/wp-pagenavi.html

    Saludos.

  6. User Gravatar

    César said,

    Wrote on May 28, 2007 @ 13:37

    Hola que tal, me parece impresionante lo que se puede hacer en wprdPress y pues quisiera saber si es posible hacerlo en Blogger (Blogspot), porque tambien tengo un problema con la paginacion en mi blog!!!

    thanks y felicidades que grandioso blog !! thanks nikko !!

  7. User Gravatar

    ko(onem said,

    Wrote on May 29, 2007 @ 13:52

    Se mira Bonito esto, y es una forma para moverse en el blog mas facilmente, yo modifice un poco los css y me salio bonito ^^

    Saludos

  8. User Gravatar

    Nikko said,

    Wrote on May 29, 2007 @ 19:17

    Arturo goga: lo he visto funcionar en tu sitio, y se ve muy bien ^_^ saludos !!!!

  9. User Gravatar

    Nikko said,

    Wrote on May 29, 2007 @ 19:19

    Cesar: la verdad que nose, es cuestión de averiguar para descubrir que hay para ese sistema..cuando encuentre algo lo escribo

  10. User Gravatar

    Nikko said,

    Wrote on May 29, 2007 @ 19:20

    diarioTHC: si lo he visto, gracias por la colaboración q me envistes por mail ..saludos ^_^ !!!

  11. User Gravatar

    Nikko said,

    Wrote on May 29, 2007 @ 19:21

    ko(onem : genial esa es la idea...que los personalicen..yo deje el de flickr porque hace juego con el sitio...de paso me ahorre trabajo..saludos ^_^

  12. User Gravatar

    Condicionar el uso de plugins en WP | Infected-FX| tutoriales, photoshop brushes y recursos para diseñadores web said,

    Wrote on June 18, 2007 @ 3:21

    [...] para eso utilizaremos ahora el plugin para la paginación tipo Digg. Donde Nikko nos explica como usarlo. A lo que me gustaría [...]

  13. User Gravatar

    Willy said,

    Wrote on June 19, 2007 @ 23:24

    hola como estas no me salio porque mi theme es diferente a lo que han publicado T_T alguien me podria ayudar porfavor

  14. User Gravatar

    Zetman said,

    Wrote on July 15, 2007 @ 15:00

    Muy buen artículo, ya lo implemente en mi página, gracias

  15. User Gravatar

    stencer said,

    Wrote on November 25, 2007 @ 2:28

    muy bueno, pero que mal!!!, ya lo coloque, se ve muy bien, pero yo quiero otro estilo que esta en esa pagina, y no lo pone!!!, mirando me di cuenta de que, es el hilited html y el plain text, puedo con el segundo, pero como paso a plain text los otros para usarlos???

  16. User Gravatar

    Khirr » Archivo Blog » Paginando con estilo en Wordpress said,

    Wrote on December 10, 2007 @ 5:27

    [...] Aquí dejo como hacerlo y diferentes css para poder adaptarlo a tu gusto, espero les ayude. [...]

  17. User Gravatar

    Jack The Ripper said,

    Wrote on January 23, 2008 @ 1:08

    Por más que lo intento no me sale el estilo CSS. ¡¡Qué ocurre???

  18. User Gravatar

    Orlando Gonzales said,

    Wrote on April 6, 2008 @ 5:52

    Hola a todos, quiza lguien pueda ayudarme con este tema, estoy buscando un plugin que Pagine Comentarios y que sea compatible con wordpress 2.x, gracias.

  19. User Gravatar

    Dale estilo a la paginación de tu theme de Wordpress at ZyruS WeB said,

    Wrote on June 8, 2008 @ 17:49

    [...] Fuente: Xyberneticos.com [...]

  20. User Gravatar

    Valver said,

    Wrote on July 4, 2008 @ 4:33

    Lo acabo de instalar en WP 2.5 y no me coge los estilo de la carpeta del plugin, pero lo he solucionado incluyendo el estilo de pagination en la CSS del tema.

    Muchisimas gracias por la informacion y felicidades por tu pagina.

Seguir comentarios por RSS · TrackBack URI

Nombre: (Necesario)

E-mail: (Necesario)

Website:

Comment: