En este tutorial, voy a repasar El Bucle, y cómo WordPress lo usa para mostrar tus publicaciones y páginas. Ten en cuenta que esto es un poco más avanzado que nuestros tutoriales anteriores. Espero que encuentres esta guía definitiva más fácil de entender que lo que está disponible en la documentación de WordPress. Esto es lo que cubriremos:
- Una definición de El Loop.
- Flujo básico de El Loop.
- Etiquetas de plantilla usadas en El Loop
- Qué hacer después de El Loop
- Jerarquía de archivos de plantilla
Si deseas comprender mejor cómo funciona realmente un tema de WordPress detrás de escena, sigue leyendo.
Nota: Este tutorial asume que estás usando un tema estándar de WordPress, como el tema predeterminado Kubrick. Nada de cosas avanzadas de múltiples bucles... todavía.
¿Qué es El Bucle?
Probablemente todavía te estés preguntando qué es El Bucle. Básicamente, es lo que muestra el contenido que ves en tu página de inicio, tus entradas individuales, páginas, archivos, resultados de búsqueda y más.
Si un usuario accede a tu página de inicio, archivos o resultados de búsqueda, por defecto, el Bucle mostrará un cierto número de publicaciones según lo definido en tus Opciones de Lectura.
En este momento, mi página de inicio muestra 10 publicaciones por página, que es lo que definí en Mostrar como máximo * publicaciones. En publicaciones y páginas individuales, el mismo código básico del Bucle solo mostrará solo esa página específica.
Flujo básico del bucle
Vamos a dividir El Bucle en 3 partes.
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
1. Lo que quieres que se muestre en El Bucle
<?php endwhile;?>
2. Lo que se muestra cuando El Bucle termina
<?php else : ?>
3. Si no hay nada que mostrar
<?php endif; ?>
Si hay entradas disponibles en la consulta, comenzará a mostrarlas en un bucle while, lo que se define en la parte 1. Cuando el while termine, mostrará lo que está en la parte 2. Si no se encuentran entradas, o hay algún otro error 404, se mostrará la parte 3.
Etiquetas de plantilla usadas dentro de El Bucle
A menos que quieras que *1. Lo que quieres que se muestre en El Bucle* se repita 10 veces en la página de inicio de tu blog de WordPress, probablemente deberías aprender algunas de las etiquetas de plantilla básicas. Echemos un vistazo al código de *index.php* en la plantilla predeterminada de WordPress.
Como puedes ver, hay bastantes etiquetas de plantilla dentro del Bucle que mostrarán cosas como el título de la publicación, el permalink, el contenido, etc. Desglosaré cada una de las etiquetas de plantilla en el tema predeterminado de WordPress.
- <?php the_permalink() ?> – Esto mostrará el enlace permanente de la entrada, es decir, http://www.themelab.com/?p=1
- <?php the_title(); ?> – Esto muestra el título de la entrada, es decir, ¡Hola Mundo!
- <?php the_time(‘F jS, Y’) ?> – Esto mostrará la fecha, es decir, 4 de abril de 2008. Una lista completa de formas de formatear la fecha se puede encontrar en php.net
- <?php the_author() ?> – Esto mostrará el nombre del autor, es decir, Leland. Esto está comentado en el tema predeterminado.
- <?php the_tags(‘Tags: ‘, ‘, ‘, ‘<br />’); ?> – Esto mostrará las etiquetas asignadas a la entrada, separadas por comas y seguidas de un salto de línea
- <?php the_category(‘, ‘) ?> – Esto mostrará las categorías de manera similar a las etiquetas anteriores.
- <?php edit_post_link(‘Editar’, ”, ‘ | ‘); ?> – El enlace para editar la entrada solo será visible para aquellos con permiso.
- <?php comments_popup_link(‘Sin comentarios »’, ‘1 comentario »’, ‘% Comentarios »’); ?> – Mostrará el enlace a los comentarios. Esto no se mostrará en entradas o páginas individuales.
Hay muchas más listadas en la página de Etiquetas de Plantilla en WordPress.org. Algunas de estas pueden funcionar en el Bucle, mientras que otras puede que no.
Después del Bucle
Echemos un vistazo al código después de que el bucle deje de iterar en el tema predeterminado.
<div class="navigation">
<div class="alignleft"><?php next_posts_link('« Entradas Anteriores') ?></div>
<div class="alignright"><?php previous_posts_link('Entradas Nuevas »') ?></div>
</div>
Como habrás adivinado, esto mostrará la paginación que ves en la página de inicio, archivos y resultados de búsqueda. Estas no se mostrarán en publicaciones y páginas individuales. Por supuesto, podrías reemplazar esto con algo como PageNavi, pero eso depende de ti.
Si no hay publicaciones para mostrar (posiblemente debido a un error 404), se mostrará lo siguiente después del else
<h2 class="center">No encontrado</h2><br>
<p class="center">Lo sentimos, pero estás buscando algo que no está aquí.</p><br>
<?php include (TEMPLATEPATH . "/searchform.php"); ?>
Eso mostrará el mensaje No encontrado junto con el formulario de búsqueda. En este caso, tendría que haber un código de formulario de búsqueda ubicado en un archivo llamado searchform.php en el directorio de la plantilla, lo cual existe en el tema predeterminado.
Jerarquía de plantillas
Algunos archivos de plantilla tendrán prioridad sobre index.php para ciertos tipos de páginas si están presentes en el directorio de la plantilla. A continuación se muestran algunos ejemplos de jerarquía de plantillas, enumerados en orden de prioridad.
Página de inicio
- home.php
- index.php
Publicación individual
- single.php
- index.php
Resultados de búsqueda
- search.php
- index.php
Página 404
- 404.php
- index.php
Hay algunas técnicas más avanzadas listadas en la página de Jerarquía de Plantillas en WordPress.org.
Entonces, ¿cuál es el propósito de la jerarquía de plantillas? Básicamente, puedes usarla para crear nuevos diseños para diferentes tipos de páginas de WordPress sin modificar demasiado tu archivo index.php.
Conclusión
Así que ahora (con suerte) tienes una mejor idea de qué trata el Bucle de WordPress. Siéntete libre de dejar un comentario si te gustó, lo odiaste, no lo entendiste, lo que sea, acepto todos los comentarios. Suscríbete a el feed para todas las últimas actualizaciones sobre lanzamientos de temas de Theme Lab y nuevos tutoriales. Gracias por leer.
[…] ¡suscríbete a nuestro feed! También puedes recibir actualizaciones de este blog por correo electrónico. Todos sabemos qué es el Loop de WordPress, ¿verdad? Si no, hay muchos tutoriales geniales en la web que explican el Loop de WordPress […]
Guía realmente útil, lo intentaré de inmediato.
@Fernando: Gracias por avisarme…
Es una guía muy buena y la he traducido al español aquí para compartirla con gente que no habla inglés 🙂
Gracias 😉
[…] La Guía Definitiva del Loop de WordPress: El Loop resulta ser muy desafiante. Este enlace te ayudará a superarlo. […]
[…] Un gran área para comenzar es aprender cómo funciona el Loop de WordPress. Esta es una función básica de blogging que se utiliza para mostrar los X posts más recientes en la página principal de tu blog (para blogs tradicionales). En lugar de entrar en mucho detalle aquí, me gustaría dirigirte a una nueva publicación de Themelab que está diseñada para ser la Guía Definitiva del Loop de WordPress. […]
[…] dos artículos recientes que he encontrado útiles son: La Guía Definitiva del Loop de WordPress y otro llamado Variables Globales y el Loop de WordPress […]
@RSS Filter: Eso es posible… pero lo guardaré para un tutorial futuro.
[…] enséñale todo lo que necesitas saber sobre el Bucle de WordPress. Qué es, cómo usarlo y más.leer más | digg story Compartir y disfrutar: Estos iconos enlazan a sitios de marcadores sociales donde los lectores pueden […]
Entonces, ¿cómo le dirías al bucle que muestre solo la última publicación en una página de inicio estática o archivo de índice?
¡Excelente guía sobre un aspecto importante del desarrollo de temas de Wordpress. ¡Gracias!
[…] La guía definitiva del Loop de WordPress […]
[…] La guía definitiva del bucle de WordPress (etiquetas: wordpress) […]
[…] propaganda press el 6 de abril de 2008 ok, muy parecido a combolombo, acabamos de descubrir un nuevo sitio con un artículo increíble sobre el bucle de wordpress. definitivamente quieres leer y marcar este. Etiquetado con: wordpress « African […]
[…] Guía definitiva del bucle de WordPress… Conoce todos los globales y qué […]
[…] La guía definitiva del bucle de WordPress | Theme Lab (etiquetas: wordpress howto php guide programming theme blog) […]
[…] Guía del bucle de WordPress […]
[…] La Guía Definitiva del Bucle de Wordpress – Theme Lab […]
[…] La Guía Definitiva del Bucle de WordPress (etiquetas: loop wordpress) […]
Vaya, esto es para guardarlo. En serio, me habría servido cuando intentaba ajustar algunos plugins.
Decían constantemente: “coloca este código fuera del bucle”.
Y ahora sé qué demonios es un bucle 🙂
[…] es una guía del Bucle de Wordpress. Especialmente útil para creadores de temas de Wordpress principiantes y desarrolladores de wordpress. Comparte y […]
Oye Leland, fuera de tema, ¡pero felicidades por tu aumento de suscriptores!
– Sean Pollock
guía muy útil.. ¡gracias!
[…] La Guía Definitiva del Bucle de WordPress – Este sitio realmente desglosa el Bucle para que lo entiendas. […]
[…] Wordpress. Adelante, ¡suscríbete a nuestro feed! También puedes recibir actualizaciones de este blog por correo electrónico. La Guía Definitiva del Bucle de WordPress: Ah, el famoso bucle de WordPress que lo ejecuta todo. Ronald ha hecho un muy buen trabajo identificando […]