¿Qué es el Loop de WordPress y como usarlos? – vertegrande ®
Copyright © Vertegrande. 2023. Agencia de Marketing & Diseño Web en Puerto Madryn / Contanos tu Proyecto. Esto puede ser el principio de una gran aventura.
vertegrande ® » Snippets » WordPress » ¿Qué es el Loop de WordPress y como usarlos?

¿Qué es el Loop de WordPress y como usarlos?

El Loop es una porción de código que usa WordPress para mostrar contenido.

Publicado el 23 febrero, 2023 - Categorias: Snippets, WordPress

El loop es básicamente un código PHP usado para mostrar información de un post, lo que significa que podemos extraer cualquier pieza de contenido del post que creaste desde el administrador, esto incluye:

  • Título
  • Contenido (texto, imágenes, video)
  • Fecha de creación
  • Fecha de modificación
  • ID del post
  • Slug
  • Categoría
  • Etiquetas
  • Imagen destacada
  • Extracto
  • Comentarios
  • Campos personalizados
  • y mucha más información

El loop funciona dependiendo de un contexto, por ejemplo, si el loop es llamado en una plantilla single.php que es la encargada de mostrar un post, el loop funcionará en el contexto del post trayendo la información específica de ese post.

El Loop se ve más o menos así:

<?php 
if ( have_posts() ) {
	while ( have_posts() ) {
		the_post(); 
		//
		// Etiquetas de template
		//
	} // end while
} // end if
?>

El método have_posts() revisa en la base de datos si hay información para el post que queremos mostrar y si hay alguna, comienza a iterar en ella. El método the_post() prepara toda la información del contenido desde la base de datos respetando un índice.

Modificando el Loop de WordPress con WP_Query()

Si deseamos mostrar los post de la categoría “Android” por ej, el código se vería más o menos así:

<?php $android_query = new WP_Query( 'category_name=android' );

if ( $android_query->have_posts() ) {
	while ( $android_query->have_posts() ) {
		$android_query->the_post(); 
		echo ‘<h1>’;
                the_title();
                echo ‘</h1>’;
	} // end while
} // end if
?>

Obtener los 3 post más recientes de una categoría – ref

<?php
$args = array(
    'category_name' => 'news',
    'posts_per_page' => 3
);
 
$my_query = new WP_Query( $args );
 
if ( $my_query->have_posts() ) {
 
    while ( $my_query->have_posts() ) {
 
        $my_query->the_post();
 
        // Etiquetas de template: ej: the_title().
 
    }
}
 
wp_reset_postdata();
?>

Obtener todos los post del año actual para un autor

<?php
 
// Obtiene el año actual.
$current_year = date( 'Y' );
 
$args = array(
    // Consulta por el nombre de autor “John”.
    'author' => 'john',
    // Obtiene los post de este año.
    'year'   => $current_year
);
 
$my_query = new WP_Query( $args );?>

Mostrar los post ordenados por cantidad de comentarios

<?php
 
$args = array(
    // Ordena por cantidad de comentarios.
    'orderby' => 'comment_count'
);

$my_query = new WP_Query( $args ); 
?>

Loop con las últimas entradas del blog – ref

<?php
 global $post;

$last_posts = get_posts(array('posts_per_page' => 3));

foreach ( $last_posts as $post ) :
 setup_postdata( $post );?>

<div class="last-posts-wrap">
 <?php the_post_thumbnail();?>
 <h3><?php the_title();?></h3>
 <p><?php the_excerpt();?></p>
</div>

<?php endforeach;
 wp_reset_postdata();
?>

Mostrar publicaciones de blog en cualquier página (con navegación) – ref

Como mostrar las publicaciones nuestro blog en cualquier página estática usando un bucle WP_Query personalizado que funciona a la perfección con la navegación de publicaciones.

Es bueno porque la navegación posterior funciona de manera intuitiva , así:

  • http://vertegrande.com/blog/— muestra las últimas publicaciones del blog
  • http:// vertegrande.com/blog/page/2/— muestra la segunda página de publicaciones
  • http:// vertegrande.com/blog/page/3/— muestra la tercera página de publicaciones

Plantilla de página

<?php 
/*
	Template Name: Blog
*/
?>
<?php get_header(); ?>

	<article>

		<?php // Display blog posts on any page @ https://m0n.co/l
		$temp = $wp_query; $wp_query= null;
		$wp_query = new WP_Query(); $wp_query->query('posts_per_page=5' . '&paged='.$paged);
		while ($wp_query->have_posts()) : $wp_query->the_post(); ?>

		<h2><a href="<?php the_permalink(); ?>" title="Read more"><?php the_title(); ?></a></h2>
		<?php the_excerpt(); ?>

		<?php endwhile; ?>

		<?php if ($paged > 1) { ?>

		<nav id="nav-posts">
			<div class="prev"><?php next_posts_link('« Previous Posts'); ?></div>
			<div class="next"><?php previous_posts_link('Newer Posts »'); ?></div>
		</nav>

		<?php } else { ?>

		<nav id="nav-posts">
			<div class="prev"><?php next_posts_link('« Previous Posts'); ?></div>
		</nav>

		<?php } ?>

		<?php wp_reset_postdata(); ?>

	</article>

<?php get_footer(); ?>

Mostrar una imagen, que podría ser un banner publicitario, cada dos artículos – Ref

<?php
if ( have_posts() ) :
	$i = 0;  
	while ( have_posts() ) : the_post();

		get_template_part( 'template-parts/post/content', get_post_format() );

		//Muestra código HTML cada dos entradas
		if ( ++$i % 2 == 0) echo'<img src="https://unsplash.it/600/200/">';

	endwhile;
else :
	get_template_part( 'template-parts/post/content', 'none' );
endif;

Blog

Instagram @holavertegrande