¿Quieres valorar este artículo? Gracias

1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (2 votos, promedio: 5,00 de 5)
Cargando…

Última modificación: 18 octubre 2017

Mostrar entradas en miniatura en WordPress

El objetivo del código que vamos a ver hoy, es conseguir que al pie de cada entrada individual de nuestro blog WordPress se vea una selección de entradas de otros post con una imagen en miniatura. Vamos a editar nuestra plantilla del tema single.php para conseguir esto:

carrusel entradas miniatura WordPress

En mi caso las entradas miniatura están situadas debajo de cada entrada al final de los comentarios en las páginas de entradas individuales, es decir en single.php pero el código que te voy a mostrar puedes colocarlo en cualquier plantilla de tu tema, por ejemplo en el index.php o portada… Para ello sólo debes abrir en lugar de la página single.php que indico yo, la plantilla que tu deseas.

Cómo mostrar 4 entradas en miniatura en tu WordPress

Paso 1 – buscar y abrir la template donde queremos realizar los cambios

Vamos a localizar la plantilla de tu theme para entradas individuales en wp_content/themes/tutema/single.php y nos vamos a situar en el código, en el lugar donde queramos que aparezca el carrusel de entradas en miniatura, como puedes ver en mi caso ha sido debajo de los comentarios.

Paso 2 – copiar el código en el lugar de la template que deseemos

Vamos a crear una nueva wp_query, lo tienes explicado en este artículo del blog, antes de copiar el código si no entiendes lo que quiero decir con nueva wp_query repasa el artículo “Cómo crear bucles personalizados con wp_query”, y mediante un bucle recorrer el nuevo array y mostrar miniaturas en imágenes y título.

Parte 1 del código: nueva wp_query

Con este código creamos un nuevo array de post_type: post que muestra 4 post en orden aleatorio.

Parte 2 del código: bucle

Parte 3 del código mostrar datos

Parte 4 del código: cerrar bucle y resetear query

Código completo para copiar en tu plantilla

Guarda los cambios en tu plantilla y guarda la plantilla.

Paso 3 – añadir estilos a nuestro archivo .css

El código css depende mucho del diseño de tu web, voy a orientarte un poco con los estilos aunque deberás ajustar los estilos que yo defina aquí a tu blog.

Nerea Liebana

Lph by Nerea Liébana

¿Quieres suscribirte al Newsletter?