Divi

Personalizar el mensaje «Older Entries o Next Entries» de nuestro blog con Divi

Jefferson Maldonado
Por Jefferson Maldonado 9 Ago 2021 10 min de lectura

¿No te ha pasado que entras a tu blog, tienes varias entradas publicadas, y abajo del todo aparece ese "Older Entries" u "Next Entries" en inglés para ir a las entradas anteriores o siguientes? Es un detalle pequeño, pero rompe la coherencia de un sitio que tienes íntegramente en español. Y a mí esos detalles me molestan, porque la profesionalidad de una web está justamente en cuidar lo que casi nadie nota.

En este tutorial te voy a mostrar cómo personalizar el mensaje "Older Entries" o "Next Entries" de la paginación de tu blog con Divi, para que diga exactamente lo que tú quieras: "Entradas más antiguas", "Entradas siguientes", "Ver más artículos", o lo que mejor le calce a tu sitio. Es un cambio sencillo, pero hay que hacerlo de la forma correcta para que no se pierda con cada actualización del tema. Vamos paso a paso.

¿Por qué aparecen estos textos en inglés y por qué hay que tocar código?

El tema Divi viene con muchos textos de interfaz que, dependiendo de tu configuración de idioma y de la versión, a veces no se traducen completamente. La navegación entre páginas del blog ("Older Entries" / "Next Entries") es uno de esos casos clásicos que se quedan en inglés. Estos textos no están en un campo del panel de administración que puedas editar con un clic: están escritos directamente en un archivo PHP del tema, llamado navigation.php. Por eso, para cambiarlos, hay que editar ese archivo.

Acá viene lo importante, y es la parte que mucha gente se salta: nunca debes editar directamente los archivos del tema Divi original. Si lo haces y luego actualizas Divi (cosa que vas a hacer tarde o temprano, porque las actualizaciones traen mejoras y parches de seguridad), todos tus cambios se van a borrar. El instalador sobrescribe los archivos del tema con las versiones nuevas, y tu personalización desaparece como si nunca hubiera existido.

La solución correcta es usar un tema hijo (child theme). Un tema hijo es una capa que se monta sobre Divi y que sobrescribe solo lo que tú quieras, dejando intacto el tema padre. Cuando actualizas Divi, tu tema hijo y todas sus modificaciones permanecen seguros. Si todavía no sabes cómo crear uno, te dejo el tutorial completo acá:

Para hacer este cambio de forma segura necesitas primero crear un tema hijo de Divi. Sin él, perderás esta personalización en la próxima actualización del tema.

Dentro del tema hijo, lo que vamos a hacer es copiar el archivo navigation.php del tema Divi original y pegarlo en la misma estructura de carpetas dentro de nuestro tema hijo. WordPress es inteligente: cuando encuentra un archivo en el tema hijo que existe también en el tema padre, da prioridad al del hijo. Así, nuestra versión modificada del navigation.php es la que se va a usar, sin tocar el original.

Paso 1: copiar navigation.php al tema hijo

Vamos a entrar al administrador de archivos de nuestro hosting para mover el archivo. Sigue estos pasos con calma, que no tiene ninguna ciencia, solo hay que ubicar bien las carpetas.

  1. Vamos al cPanel de nuestro hosting y entramos al administrador de archivos.
Administrador de archivos del hosting en cPanel

Ahora vamos a la carpeta de nuestro tema hijo, siguiendo la ruta public_html > wp-content > themes > Divi Child.

Carpeta del tema hijo Divi Child en el administrador de archivos

Dentro de la carpeta del tema hijo, creamos una carpeta nueva llamada includes. Este nombre no es opcional: tiene que llamarse exactamente igual que la carpeta del tema padre donde vive el archivo original, porque WordPress respeta la misma estructura de rutas para hacer el reemplazo.

Crear carpeta includes dentro del tema hijo de Divi
Carpeta includes creada en el tema hijo Divi Child

Ahora vamos a la carpeta del tema padre, en la ruta public_html > wp-content > themes > Divi > includes, y copiamos el archivo navigation.php hacia la carpeta includes de nuestro tema hijo. Hacemos clic derecho sobre el archivo y elegimos "Copy".

Copiar el archivo navigation.php del tema Divi
cPanel Personalizar el mensaje "Older Entries o Next Entries" de nuestro blog con Divi
Ruta de destino para copiar navigation.php al tema hijo

Acá tenemos que escribir la ruta de la carpeta destino. En nuestro caso es la carpeta includes de nuestro tema hijo. Asegúrate de escribir la ruta completa y correcta, porque un error de tipeo acá hace que el archivo termine en el lugar equivocado.

Como podemos ver, el archivo navigation.php se ha copiado dentro de la carpeta includes de nuestro tema hijo. Ya tenemos nuestra propia copia editable, lista para modificar sin tocar el original.

Personalizar el mensaje "Older Entries o Next Entries" de nuestro blog con Divi

Consejo: Antes de editar cualquier archivo PHP, haz una copia de seguridad. Descarga el navigation.php original a tu computadora o duplícalo con otro nombre (por ejemplo navigation-backup.php) dentro de la carpeta. Si algo sale mal y la página se rompe, restaurar el archivo original te toma 10 segundos en lugar de horas de angustia.

Ahora viene el siguiente paso: editar ese archivo. Lo podemos hacer de dos formas, ya sea desde el cPanel del hosting o directamente desde WordPress. Te muestro las dos para que uses la que te resulte más cómoda.

Editando el archivo navigation.php desde cPanel para personalizar el mensaje "older entries"

  1. Ubicamos el archivo navigation.php dentro de nuestro tema hijo, le damos clic derecho y elegimos "Edit".
Personalizar el mensaje "Older Entries o Next Entries" de nuestro blog con Divi
Editor de cPanel abierto con el archivo navigation.php

Una vez abierto el editor, buscamos las líneas donde aparecen los textos "Older Entries" y "Next Entries". Vas a encontrar algo muy parecido a esto dentro del archivo:

Código
'prev_text' => __( '« Older Entries', 'Divi' ),
'next_text' => __( 'Next Entries »', 'Divi' ),

Lo único que tienes que hacer es reemplazar el texto que está entre las comillas simples por el que tú quieras. Por ejemplo, dejándolo así:

Código
'prev_text' => __( '« Entradas más antiguas', 'Divi' ),
'next_text' => __( 'Entradas siguientes »', 'Divi' ),
Personalizar el mensaje "Older Entries o Next Entries" de nuestro blog con Divi

Podemos poner por ejemplo:

Older Entries --> Entradas más antiguas.

Next Entries --> Entradas siguientes.

Un detalle importante al editar: respeta toda la estructura que rodea al texto. No borres las comillas, los paréntesis ni la parte del __( ... , 'Divi' ). Eso es la función de traducción de WordPress, y si la rompes, la página de tu blog puede dejar de cargar. Solo cambia las palabras que están entre las comillas simples, nada más.

Después de editar el archivo, damos clic en "Guardar cambios" (Save Changes) y luego en "Cerrar". Listo, ya quedó guardado en el servidor.

Guardar cambios en el editor de cPanel

Y con eso ya hemos editado nuestro archivo y personalizado los mensajes desde el cPanel. Si recargas tu blog, deberías ver los textos nuevos en la paginación.

Editando el archivo navigation.php desde WordPress

Si no quieres entrar al cPanel, también puedes hacer el mismo cambio directamente desde el panel de WordPress, usando el editor de temas integrado. Te muestro cómo.

  1. Entramos a nuestro WordPress y vamos al menú Apariencia > Editor de temas. Verificamos que esté seleccionado nuestro tema hijo Divi Child y entramos a includes > navigation.php.
Editor de temas de WordPress con el tema hijo Divi Child seleccionado

Editamos las mismas líneas que vimos antes, reemplazando el texto en inglés por el que quieras en español:

Personalizar el mensaje "Older Entries o Next Entries" de nuestro blog con Divi

Podemos poner por ejemplo:

Older Entries --> Entradas más antiguas.

Next Entries --> Entradas siguientes.

Con esto podremos personalizar el mensaje "Older Entries" o "Next Entries" de nuestro blog con Divi al texto que nosotros queramos. Después de editar, damos clic en "Actualizar archivo" para guardar los cambios en el servidor.

Personalizar el mensaje "Older Entries o Next Entries" de nuestro blog con Divi

Así ya hemos editado nuestro archivo y personalizado los mensajes desde WordPress. El resultado final será el siguiente:

Personalizar el mensaje "Older Entries o Next Entries" de nuestro blog con Divi

cPanel o WordPress: ¿cuál método conviene más?

Te mostré los dos caminos porque cada uno tiene su momento. Editar desde el editor de temas de WordPress es lo más rápido y cómodo cuando solo quieres hacer un cambio puntual y todo está funcionando bien. No tienes que salir del panel, no necesitas credenciales de hosting, y en dos clics estás editando.

Sin embargo, el editor de temas de WordPress tiene un peligro: si cometes un error de sintaxis en el PHP y guardas, puedes dejar tu sitio inaccesible, incluso el propio panel de administración. Y si eso pasa, ya no puedes entrar a WordPress para arreglarlo. Por eso, para trabajos serios o si no te sientes 100% seguro con el código, yo prefiero el cPanel. Desde el administrador de archivos siempre tienes acceso al servidor para revertir el cambio, pase lo que pase con WordPress.

Consejo: Si vas a tocar archivos PHP con frecuencia, considera deshabilitar el editor de temas de WordPress por seguridad (se hace con una línea en el wp-config.php) y trabajar siempre vía cPanel o FTP con una copia de respaldo a mano. Es la práctica que recomiendo a todos mis alumnos cuando empiezan a personalizar temas.

Preguntas frecuentes

¿Por qué no puedo editar directamente el archivo del tema Divi original?

Puedes hacerlo técnicamente, pero es un error que vas a lamentar. Cada vez que actualices el tema Divi (algo que debes hacer regularmente por seguridad y mejoras), el instalador sobrescribe todos los archivos del tema padre con las versiones nuevas, borrando tus cambios. Usando un tema hijo, tus personalizaciones quedan en una capa separada que las actualizaciones no tocan. Es la única forma profesional de personalizar Divi.

Edité el archivo y se rompió mi blog. ¿Qué hago?

Tranquilo, tiene solución. Casi siempre el problema es un error de sintaxis: borraste una comilla, un paréntesis o un punto y coma sin querer. Entra al administrador de archivos de tu hosting vía cPanel, abre de nuevo el navigation.php de tu tema hijo y compáralo con la estructura original. Si tienes la copia de respaldo que te recomendé hacer, simplemente reemplaza el archivo dañado por el de respaldo y todo vuelve a la normalidad. Esta es justamente la razón por la que insisto tanto en hacer backup antes de editar.

¿Puedo cambiar otros textos de Divi con este mismo método?

Sí. La misma lógica de copiar el archivo del tema padre al tema hijo y editarlo aplica a muchos otros textos y plantillas de Divi. Eso sí, tienes que identificar en qué archivo vive el texto que quieres cambiar. Para textos de interfaz repartidos por todo el tema, muchas veces es más práctico usar un plugin de traducción como Loco Translate, que te permite cambiar las cadenas de texto sin tocar archivos PHP. Pero para casos puntuales como este, editar el archivo en el tema hijo es directo y efectivo.

¿Este cambio afecta el SEO de mi blog?

De forma directa, no cambia tu posicionamiento. Pero tener toda la interfaz en un idioma coherente sí mejora la experiencia de usuario, y una mejor experiencia se traduce en visitantes que se quedan más tiempo y navegan más páginas, señales que Google valora. Además, textos descriptivos como "Entradas más antiguas" son más claros para el usuario que un genérico "Older Entries" en inglés, sobre todo para una audiencia hispanohablante. Es un detalle de calidad que suma.

Conclusión

¡Y listo! Con esto ya puedes personalizar el mensaje "Older Entries" o "Next Entries" que aparece en la paginación de tu blog con Divi, para que luzca exactamente como tú quieras en tu instalación de WordPress. Es un cambio pequeño en apariencia, pero de esos que elevan la percepción de profesionalidad de un sitio. Cuidar el idioma y la coherencia de cada elemento es lo que separa una web cuidada de una hecha a la rápida.

Lo más valioso que te llevas de este tutorial no es solo cambiar dos textos, sino entender la metodología del tema hijo: una técnica que te abre la puerta a personalizar prácticamente cualquier cosa de Divi sin miedo a perder tu trabajo en la próxima actualización. Esa base te va a servir para muchísimos otros ajustes a futuro.

Si quieres aprender a personalizar Divi a fondo, dominar los temas hijo, el código y todas las técnicas que uso para crear sitios profesionales, te invito a conocer la membresía premium y los cursos en uxdivi.com/planes. Ahí tienes la formación completa, paso a paso, desde cero hasta nivel avanzado.

¿Te gustó este tutorial? Si te sirvió, no olvides compartirlo con tus amigos y conocidos. Y recuerda que puedes dejarme el enlace de tu creación en los comentarios para que todos veamos los resultados que conseguiste. Nos vemos en el próximo Divi Snippet.

// ¿Te sirvió este tutorial?

Imagina lo que aprenderás
con los cursos completos

En UXDivi llevamos los tutoriales del blog al siguiente nivel: proyectos reales de principio a fin, recursos descargables y soporte directo conmigo. Todo por menos del costo de un curso individual en otra plataforma.

+44 cursos +1113 alumnos 4.7 en Trustpilot Garantía 7 días
Jefferson Maldonado
// Escrito por

Jefferson Maldonado

UX Director · Founder UXDivi, MUX Studio y UXDivi Templates

UX Director | fundador de UXDivi y MUX Studio

Comentarios

Para dejar un comentario, accede a tu cuenta de UXDivi.

Acceder a mi cuenta