En este tutorial veremos cómo modificar el texto del link "Read More" o "Leer Más" en un child theme de Genesis Framework.
Añadir el enlace "Leer Más" a una entrada
En este caso vamos a centrarnos en Genesis, pero estos pasos son similares si usamos otras plantillas.
Seguramente habréis visto más de una vez en algún blog de WordPress el texto "Leer Más", "Seguir leyendo", "Read More" o similares. Esta etiqueta puede añadirse desde el editor de entradas de WordPress, y nos sirve para mostrar un resumen o extracto de un artículo, seguido del enlace para continuar leyendo.
Para agregarla a una entrada, abriremos la misma en modo edición, posicionaremos el cursor detrás del texto que corresponda, haciendo clic, y pulsaremos sobre "Insertar la etiqueta 'Leer más'".
Insertar etiqueta "Leer Más" en una entrada
Esta etiqueta tendrá un texto concreto que podríamos modificar de varias formas, en este caso vamos a ver cómo sustituirlo en (más sobre este fantástico framework en el Curso Genesis) usando un pequeño fragmento de código PHP. Así que, ¡vamos allá!.
Link "Read more" en entrada del tema Genesis Sample
Modificando el texto del link "Read more" en Genesis
Antes de ponernos manos a la obra con el código, vamos a revisar que el campo "Genesis/Theme Settings/Content Archives/Display" tenga seleccionado el valor "Entry content", y que esté deshabilitado el límite de caracteres en "Limit content to".
Una vez hecho, podemos continuar. El código que vamos a usar en esta ocasión es muy simple, por lo que no es necesario instalar ningún plugin con funcionalidades extras. De hecho, podremos añadir este fragmento de código directamente en un plugin de utilidades que hayamos creado previamente en WordPress, o si usamos Code Snippets crear un snippet.
Como hemos comentado en otras ocasiones, la solución más extendida es añadirlo al archivo function.php del tema, pero no es la más adecuada en estos casos porque podemos perder los cambios al actualizar a una nueva versión. Hablamos de ello en el tutorial sobre añadir código a WordPress.
Pues bien, vamos entonces a agregar el código a nuestro plugin de utilidades. Recordad que primero es conveniente desactivarlo desde el escritorio de WordPress, "Plugins", para evitar que puedan surgir errores mientras realicemos los cambios.
Una vez lo hayamos desactivado, tendremos que acceder al plugin a través del administrador de archivos del hosting donde esté alojada la web, o bien mediante un programa FTP como Filezilla.
Este plugin estará en el directorio dentro del directorio "/plugins/nombre_plugin", dentro de la carpeta "wp-content" de nuestro sitio. Y ahora, vamos por fin con el código. Será similar al siguiente:
add_filter( 'the_content_more_link', 'bld_mod_read_more' );
function bld_mod_read_more() {
return '<a class="more-link" href="' . get_permalink() . '">[Continuar...]</a>';
}
Una vez incluimos el código en el plugin, normalmente hacia el final, simplemente debemos guardar los cambios y volver a activarlo desde el panel de administración de WordPress.
Enlace "Read More" modificado en Genesis Sample
Comentaros también, que la expresión que aparece en negrita corresponde al texto, el anchor text o texto ancla, del link "Read more", es decir, lo que escribamos ahí se va a sustituir por ese texto.
Podemos hacerlo realmente como queramos, de forma que modifiquemos el texto a nuestro antojo. Aunque os recomendamos sustituirlo por un texto que resulte intuitivo para que los lectores del sitio sepan que el enlace les llevará al resto del artículo, que al final es lo que nos interesa.
Analizando el código
El código, como veis, tiene solo cuatro líneas si contamos la llave de cierre. Consta de dos partes, por un lado tenemos el filtro, "add_filter", y por otro la función personalizada, "bld_mod_read_more".
Los filtros son similares a los action hooks, pero se utilizan para modificar el contenido antes de ser usado, en este caso particular, antes de mostrarse en el blog. Si queréis saber más sobre filter y action hooks, se explican y ven con detalle en el curso de Genesis básico, concretamente en la cuarta lección vemos los Action Hooks y en la quinta los Filter Hooks en Genesis. Si trabajáis con Genesis Framework, conocer estas funciones os será tremendamente útil a la hora de añadir o cambiar funcionalidades en una plantilla.
Retomando el código, y concretamente el filtro, vemos que lo que estamos haciendo es asociar la función "bld_mod_read_more" al hook "the_content_more_link", para que se ejecute en el mismo.
A continuación, simplemente tenemos que definir la función personalizada "bld_mod_read_more", que en este caso devuelve el link modificado con el texto que queramos.
Por último, comentar que este mismo código puede servir para child themes de Genesis Framework así como para otros themes. El siguiente es un ejemplo de cómo quedaría si lo hacemos en la plantilla Twenty Seventeen.
Link "Leer más" modificado en Twenty Seventeen
¡Y ya está! Como veis, personalizar el anchor text del link "Read more" es muy fácil y os llevará poquísimo tiempo.
Resumen y conclusión
El link "Leer Más" nos permite mostrar un resumen o entradilla de un posts en la página del blog. Podemos añadirlo fácilmente desde el editor de la entrada, pulsando sobre el botón correspondiente. Tendremos que tener marcada la opción "Entry content" en la configuración de Genesis Framework tal como explicamos en el tutorial.
Si queremos modificar el texto que aparece en la misma usando código, debemos añadir un pequeño fragmento a WordPress.
¡Y esto es todo! Si queréis aprender más sobre Genesis, os recomendamos el curso de Genesis básico, el curso de Genesis intermedio y el curso de Genesis avanzado. Si os suscribís a boluda.com, tendréis acceso al framework, a estos cursos, y a muchos otros. Hay más de 6752 vídeos que podréis realizar de forma inmediata, ¡os esperamos dentro! :)