Guía para Principiantes sobre el Loop de WordPress

Spanish (Español) translation by Eva Collados Pascual (you can also view the original English article)

El Loop forma parte imprescindible de los cimientos de WordPress. Es la primera cosa (y posiblemente la más fácil) que la mayoría de las personas que desarrollan temas intentan modificar... y puedes conseguir una increíblemente creatividad con él una vez conozcas lo básico. Hoy, vamos a exponer las bases para que todo aquel que sea novato en el loop o hay querido alguna vez saber algo más sobre cómo funciona exactamente.

Resumen para los Profanos

El núcleo de la funcionalidad de WordPress reside en lo que se llama El Loop. Es un concepto muy simple de entender, comprenderlo te posiciona en la vía idónea hacia el desarrollo de temas. Puedes (y deberías) visitar la página oficial del codex sobre el loop, pero la instrucción de hoy se dirige a aquellas personas que no disfrutan necesariamente hurgando en el códice.

En términos más generales, el loop es un simplemente un bloque de código que muestra toda la información que tiene WordPress sobre entrada(s) o página(s). Como su nombre indica, recorre secuencialmente cada post que encuentra en la base de datos (uno, luego otro, luego otro), de forma que puede gestionar la entrega de información relativa a varios posts.

Antes de profundizar en el código, vamos a mostrar qué hacen los loops. Existen tres partes cruciales en él:

Iniciar el loop.
Hacer algo con cada entrada/página encontrada en el loop.
Cerrar el loop.

Es bastante sencillo, ¿no? El bucle, por defecto, recuperará todo lo que le sea posible encontrar... así que hay una pieza más que vale la pena destacar: la consulta. La consulta es qué usaremos para filtrar toda la pila de posts para simplemente lo que estamos buscando. Así, nuestro "modelo de laico" cuando queremos tirar un conjunto específico de puestos se ve así:

Definir lo que estamos buscando.
Iniciar el loop.
Hacer algo con cada entrada/página encontrada en el loop.
Cerrar el loop.

Si nunca has trabajado con PHP antes, podría estar familiarizado con el tiempo la función que se utiliza comúnmente para bucle a través de una consulta de base de datos y dinámicamente Mostrar la información de la base de datos sin tener que introducir manualmente cada fila de la base de datos única. Para los no-PHP'ers por ahí, pensar en el tiempo como un bibliotecario poco ingenioso que recupera todo lo que desee de la base de datos, una entrada a la vez.

Ahora echemos un vistazo a lo que parece que "modelo de laico" en el código real:


<?php 
query_posts( 'tag=apples' );
if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
// DO SOMETHING WITH EACH POST THAT WE FOUND
<?php endwhile; else: ?>
// DO SOMETHING IF NOTHING WAS FOUND
<?php endif; ?>

Aprendo mejor por ejemplo, ¡sólo sumergirse en veinte diez tema de WordPress por defecto y mirar lo que el bucle está haciendo allí.

Sección 1 Tema Twenty Ten de WordPress

WordPress tiene un tema por defecto que viene con cada instalación de WordPress y se activa por defecto. Este año se llama veinte once, pero utilizaremos el tema de pasado año, veinte diez, como nuestro ejemplo porque aísla el lazo en su propio archivo (lo que hace que ilustran nuestra lección un poco más fácil). Si al navegar wp-contenidos/temas/twentyten notará una estructura de archivos como vemos a continuación:

Twenty Ten separa el loop de los demás archivos del tema. Abre index.php y observa el siguiente código:


  		<?php
			/* Run the loop to output the posts.
			 * If you want to overload this in a child theme then include a file
			 * called loop-index.php and that will be used instead.
			 */
			 get_template_part( 'loop', 'index' );
			?>

Vamos a diseccionar el código que se está solicitando en breve, pero es importante saber que lo que todo esto hace es solicitar la página loop-index.php. Si ya estás familiarizado con PHP, include() es similar a la función get_template_part() de WordPress. Es perfectamente aceptable también extraer todo el código de loop-index.php y ponerlo en el lugar del código anterior. Lograrás lo mismo. Un loop puede existir dentro de una página y no tiene que ser una página independiente.

Lo siguiente que vamos a hacer es abrir el loop.php y ha examinar lo que consigue el núcleo.

La primera parte del loop.php crea una paginación, pero si te desplazas hasta la línea 31 - notarás un elemento clave: una instrucción "if" que pregunta si existen entradas. Este código declara "si no existen entradas, muestra un mensaje indicando que no hay ninguno".

1
2	<?php if ( ! have_posts() ) : ?>
3	Your code or HTML that states there is no content for the query.
4	<?php endif; ?>

Desciende hasta la línea 56 y verás otro elemento crucial del loop:

1
2	<?php while ( have_posts() ) : the_post(); ?>

Se trata de la declaración "while" (mientras) que he mencionado anteriormente. Básicamente puede ser leído en voz alta como "mientras existan entradas, haz este bucle". A continuación, inmediatamente puedes ver the_post(). Esta función extrae toda la información del post para que nosotros podamos mostrar la información de la entrada con las etiquetas estándar de WordPress (más sobre esto más adelante).

Después para cerrar el loop en la línea 173, verás un simple "endwhile". La verdadera magia y la utilidad del loop es lo que sucede entre estas líneas.

Imagina tener que actualizar el HTML cada vez que desees publicar una entrada en el blog. Esto sería increíblemente engorroso e imagino que te desalentaría a la hora de crear nuevas publicaciones en tu blog. Ni siquiera te molestarías. El bucle le permite introducir un blog en una base de datos y extraer el contenido en un formato de diseño una vez que va a seguir siempre. Lo único que necesita es saber cómo manipular el bucle para mostrar lo que quiere y cómo mostrar el contenido que desea.

Sección 2 Mostrar El Contenido

Para el resto de este tutorial, toda la magia que vas creando será después el tiempo y antes la endwhile.

Es realmente muy fácil mostrar la información que desees en el Loop de WordPress. Te sugiero la lectura del artículo del Codex sobre las Etiquetas de Plantilla en WordPress; te mostrará todas las etiquetas que puedes usar en el loop. Te muestro algunas de las cosas que WordPress ha incluido en el tema Twenty Ten.

1
2	<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

Primero está the_ID(). Este es el ID único para ese post, ninguna entrada o página compartirán un ID. Si no tienes activa la reescritura de las URLs, podrás descubrir este ID en la URL de la entrada. En este ejemplo, es útil añadirlo en el id del div de forma que puedas aplicar estilo mediante CSS a esa entrada sin afectar el formato del resto. Lo siguiente es el post_class que agregará una clase CSS que hace referencia a cual es el tipo de post.. Si se trata de una entrada, tendrás una clase post. Si es un archivo adjunto, tendrás la clase attachment. Lee el Codex para obtener más información sobre post_class();

En la línea siguiente, verás dos etiuetas ampliamente utilizadas. En primer lugar tenemos

1
2	<?php the_permalink(); ?>

Esto generalmente está contenido en un elemento ya que imprime el enlace permanente o permalink en bruto: http://yoursite.com/?p=123 Se puede acceder al enlace del post siempre - lo que en ocasiones no es bonito - y se refleja automáticamente cuando se utiliza la etiqueta the_permalink().

Después de esa etiqueta, verás:

1
2	<?php the_title(); ?>

Esto es, como su nombre sugiere, el título del post. Al hacer crear el post, cualquier cosa que introduzcas como título será mostrada aquí.

Bajando a la línea 109, verás algunas etiquetas condicionales que nos ayudarán a desfragmentar.

1
2	<?php if ( is_archive() \|\| is_search() ) : // Display excerpts for archives and search. ?>

Esto puede ser entendido como "Si estamos en la página de archivo o en la página de búsqueda, muestra el contenido de la siguiente forma". A esto le sigue poco después

1
2	<?php the_excerpt(); ?>

Pero espera - en el "else" de esta condición verás:

1
2	<?php the_content( __( 'Continue reading <span class="meta-nav">→</span>', 'twentyten' ) ); ?>

¿Cuál es la diferencia? the_excerpt() va a extraer una definida cantidad del texto del post determinada por WordPress o por el usuario. Lo cual es útil en las páginas de archivo o de búsqueda de manera que no se muestre el post entero cuando el usuario está simplemente ojeando para ver si les gustaría seguir leyendo un artículo concreto. the_content() extraerá el post entero con su formato hasta la etiqueta . Lo cual es apropiado cuando se está mostrando el artículo en algunas páginas en las que no se compite para captar la atención

1
2	get_the_category_list( ', ' );
3	$tags_list = get_the_tag_list( '', ', ' );

Lo que ves arriba son algunas otras etiquetas que pertenecen al loop y que también deberías conocer. La primera línea obtendrá cada categoría con la que el post esté asociado y las mostrará con un separadas entre sí mediante una coma. La segunda hará lo mismo con las etiquetas asociadas con el post.

Sección 2 Manipulando el Loop

Ahora que sabemos cómo mostrar nuestro contenido en el loop, veamos como ensuciarnos con el loop para conseguir que nos devuelva exactamente lo que queremos.

La primera forma de manipular el loop, consiste en editarlo directamente. Antes de "while" deseas añadir la función query_posts() cualificadora de forma que se vea como sigue:

1
2	<?php query_posts('category_name=baseball&posts_per_page=10'); ?>
3	<?php while (have_posts()) : the_post(); ?>

En query_posts, puedes definir argumentos que te darán más control respecto a lo que vas a mostrar. Con la anterior condición, he indicado que sólo quiero obtener las entradas pertenecientes a la categoría denominada béisbol y que además sólo quiero mostrar en la página 10 a la vez. Esto es verdaderamente sencillo de usar, sólo estás añadiendo una línea de código.

Otra forma de hacerlo sería definir una variable que cree una nueva consulta a la base de datos y esencialmente un nuevo loop.

1
2	$my_query = new WP_Query('category_name=baseball&posts_per_page=10');

Nuestra declaración "while" entonces solicitará las clases al objeto $my_query, por lo que ahora se verá así:


$my_query = new WP_Query('category_name=baseball&posts_per_page=10');
 while ($my_query->have_posts()) : $my_query->the_post();
	//code
 endwhile;

Esto puede ser útil si deseas añadir un segundo loop a tu página. Usa un loop para mostrar las entradas de una categoría a la izquierda y los de otra categoría a la derecha. Hay un montón de usos prácticos de esto y es muy probable que lo vayas a necesitar en algún momento.

WordPress incluye un tercer ejemplo de alteración del loop en su Codex y creo que es un artículo lo suficientemente pertinente como para dejarlo pasar. Se llama anidación. La anidación consiste básicamente disponer un loop dentro de otro. El Codex de WordPress menciona que podría ser útil cuando se utilizan códigos cortos. Yo a seguir adelante y hacerle saber, sí es útil en los códigos cortos y campos personalizados. Imagina un campo personalizado que pueda rellenarse con los IDs de las entradas que forman parte de la misma serie (IE: wp.tutsplus.com tiene un tutorial que consta de varias partes, la 1, la 2 y la 3), y después el loop extraerá el título, el extracto y otra información sobre la entrada. Esta es una manera de lograr esa tarea.

El loop anidado es exactamente igual que el que hemos creado anteriormente y que está definido mediante una variable, con una pieza importante de código al final del mismo:


$my_query = new WP_Query('category_name=baseball&posts_per_page=10');
 while ($my_query->have_posts()) : $my_query->the_post();
	//code
 endwhile;
wp_reset_postdata();

Observarás la presencia de wp_reset_postdata() en este loop. Esto restablece la variable global $post a la entrada actual en la consulta principal... lo que es útil para los loops anidados, así como en cualquier momento que desees que $post funcione después de los hechos. ¡Gracias a Rarst por la aclaracion sobre esto!

~~Por desgracia, no existe mucha documentación de WordPress sobre la funcionalidad de wp_reset_postdata() en este momento. Parece que el único uso de la función es reiniciar el loop.~~

Conclusión

¿Te sientes ahora como un maestro del loop? Esta fue una revisión bastante extensa sobre el loop. El loop en sí mismo no es muy difícil de entender, pero es muy importante para todo lo demás con lo que te vas a ir encontrando en WordPress. El loop es donde todo empieza, donde se genera todo el contenido del post. Espero que hayas aprendido algo. ¡No dudes comentar si necesitas más ayuda!