---
title: "Cómo añadir una imagen a la etiqueta mor de Wordpress"
description: "La etiqueta more es muy conocida por su efecto dentro de Wordpress, es decir, la de poder realizar un salto, tras un determinado texto, imagen, o lo que deseemos para mostrar el resto del contenido de..."
url: https://verasoul.com/como-aadir-una-imagen-a-la-etiqueta-more-de-wordpress-y-cambiar-su-efecto.html
date: 2022-12-25
modified: 2022-12-25
author: "VeraSoul"
image: https://verasoul.com/wp-content/uploads/image480.png
categories: ["Software", "Tutoriales", "WordPress"]
tags: ["blue grace", "CSS", "diseño web", "div class", "etiqueta", "etiquetas", "Howto", "PHP", "raquo", "Software", "Trucos", "Tutoriales"]
type: post
lang: es
---

# Cómo añadir una imagen a la etiqueta mor de Wordpress

![more Wordpress](https://verasoul.com/wp-content/uploads/image480.png) La etiqueta **more** es muy conocida por su efecto dentro de Wordpress, es decir, la de poder realizar un salto, tras un determinado texto, imagen, o lo que deseemos para mostrar el resto del contenido de nuestra entrada.

Si eres nuevo en el mundo de Worpdress, quizás no hayas tenido la oportunidad de comprobar el efecto, pero a modo resumen podemos decir que esta etiqueta es muy útil y de hecho yo la empleo en este blog.

Esta etiqueta puede ser modificada para que el texto sea de nuestro agrado o el de nuestros visitantes, es decir, y para que pueda quedarnos más claro debemos primero fijarnos en el código que podemos encontrar en el fichero **index.php** si dispones de este mismo tema (blue grace).

```
<div class="entrybody">    
   <?php if (is_archive() || is_search()) : ?>    
     <?php the_excerpt(); _e('<p><a href="'.get_permalink().'">Seguir leyendo... '); the_title(); _e('</a></p>');  ?>

                <?php else : ?>

     <?php the_content('Leer el resto de la entrada &raquo;');   ?>                  <?php the_tags( '<p>Etiquetas: ', ', ', '</p>'); ?>    <?php endif; ?>            
                </div>
```

Tras haber encontrado la parte del código en la que se muestra el contenido podemos modificar el texto “Seguir leyendo…” y “Leer el resto de la entrada &raquo;” por otro texto que creamos conveniente, pero el objetivo de nuestra entrada es incluir una imagen que sustituya dicho texto, y para ello lo haremos de la siguiente forma:

1. Buscamos el código que enlaza al contenido, es decir, la siguiente función **the_content()** e incluir la ruta de la imagen que deseamos visualizar.

```
<?php the_content('<img src=http://URL de la imagen" alt="Arrow" title="Leer más…" />'); ?>
```

El código anterior visualizará la imagen para nuestra etiqueta **more** en lugar del texto, aunque ámbos (texto e imagen) pueden estar combinados, pero sino estamos seguros de incluir los atributos **alt** y **title **podemos estilizar la imagen mediante el uso de CSS, como por ejemlo:

```
.more-link img {
	background:url(http://URL de la imagen) no-repeat left center;
	padding: 10px;
	height: 70px;
	width: 250px;
	}
```

Para modificar un poco más esta etiqueta, podemos realizar unos cambios con el propósito de cambiar la acción que incluye por defecto, es decir, la etiqueta **more** suele llevarnos a una entrada simple y justo donde dicha etiqueta ha sido incluida, pero eso podemos cambiarlos, consiguiendo que la entrada podamos leerla por completo en la parte superior de nuestro blog.

Para ello, debemos acceder a nuestro tema y localizar el fichero **functions.php** y pegar el siguiente código:

```
function remove_more_jump_link($link){ $offset = strpos($link, '#more-'); if ($offset) { $end = strpos($link, '"',$offset); } if ($end) { $link = substr_replace($link, '', $offset, $end-$offset); } return $link; } add_filter('the_content_more_link', 'remove_more_jump_link');
```

Con el código anterior eliminamos el salto a una entrada simple y visualizamos el resto de la entrada y permite visualizar el resto del contenido en la misma página principal. Solo funciona en las versiones de Wordpress 2.8 y superiores.