Insertar imagenes thumbnail en Wordpress

No hay comentarios, deja el tuyo!

- Concepto y funcionalidad de las imagenes thumbnail

- Como insertar el código HTML/PHP.

-  Configurar las entradas de wordpress para trabajar con thumbnail.

- Necesitamos Adobe Dreamweaver y Adobe PhotoShop CS3 +.

Una imagen thumbnail es la imagen que aparece en el index de nuestro blog wordpress y que intenta dar más información al usuario sobre lo que encontrará dentro del artículo.

Un ejemplo muy claro lo encontráis en mi web:

1 Insertar imagenes thumbnail en Wordpress

Como podéis ver es un recurso muy usado en el mundo de los blog y que cada vez está teniendo más y más importancia.

¿Insertar una imagen mediante código?

Usaremos esta línea de código “mágica” y válida para cualquier theme en wordpress.

<img src=”<?php $values = get_post_custom_values(“thumb”); echo $values[0]; ?>” ” />

La traducción de este código es la siguiente:

<Insertar la imagen que aparece en la ruta del campo personalizado de la entrada del blog>

Lo que quiere decir que cuando escribimos una entrada en el blog, le debemos asignar un campo personalizado con un valor personalizado “thumb” y que contenga la ruta de la imagen a mostrar.

2 Insertar imagenes thumbnail en Wordpress

Cuando insertemos esto en el campo personalizado de nuestra entrada en wordpress, nuestra imagen que enlazamos desde la ruta aparecerá donde hayamos colocado el código anterior en el theme.

Donde insertar la línea de código:

Esta línea de código se puede insertar donde queramos que aparezca la imagen en cuestión, aunque se suele colocar normalmente debajo del título del post, osea en el archivo index.php de nuestro theme wordpress.

Ejemplo:

3 Insertar imagenes thumbnail en Wordpress

1 Insertar imagenes thumbnail en Wordpress

Como veis debe de ir justo debajo de la etiqueta <h1> o <h2> donde está incluida la etiqueta <?php the_title(); ?>


<h2><a href=”<?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to <?php the_title_attribute(); ?>”><?php the_title(); ?></a></h2>

Justo entre esta línea y la de <?php the_content(”); ?> insertamos nuestro código.

Ahora cuando agregemos una entrada al blog tenemos que añadir un campo personalizado, con título “thumb” y de valor la ruta del archivo de imagen que queramos insertar.

Siempre debemos tener los thumbnails editados para que sean del tamaño adecuado al theme que estamos usando y que al insertarlo no se nos descuadre nada.

Deja tu comentario