Ir al contenido

Los botones son elementos importantes de tu sitio web, ya que permiten a los visitantes acceder a otras páginas, consultar productos, solicitar información o ponerse en contacto contigo.

Gracias al constructor visual de Divi 5, podrás modificar fácilmente el texto y el enlace de los botones sin necesidad de conocimientos de programación.

A continuación, te explicamos cómo hacerlo paso a paso.

1. Abre la página que deseas modificar

  1. Accede al panel de administración de WordPress.

  2. En el menú lateral izquierdo, selecciona Páginas → Todas las páginas.

  3. Localiza la página que contiene el botón que deseas modificar.

  4. Abre la página con Divi 5 para acceder al constructor visual.

Una vez dentro, podrás visualizar los diferentes elementos de la página y localizar el botón que quieres actualizar.

2. Localiza el módulo de botón

Las páginas de Divi están formadas por diferentes módulos, como textos, imágenes y botones.

Para localizar el botón:

  1. Desplázate por la página hasta encontrarlo.

  2. Sitúa el cursor sobre el botón.

  3. Selecciona el módulo correspondiente.

  4. Haz clic en el icono del engranaje para abrir su configuración.

Se abrirá el panel de configuración del módulo, desde donde podrás modificar su contenido y funcionamiento.

3. Cambia el texto del botón

El texto del botón indica al visitante qué acción puede realizar al pulsarlo.

Para modificarlo:

  1. Dentro de la configuración del módulo, accede al apartado Contenido.

  2. Localiza el campo Texto del botón.

  3. Sustituye el texto actual por el nuevo.

  4. Comprueba cómo se visualiza el cambio en la página.

Consejo: utiliza textos breves y claros que indiquen la acción que realizará el visitante, como «Contactar», «Ver productos» o «Solicitar presupuesto».

4. Modifica el enlace de destino

Además del texto, cada botón puede tener un enlace que determina qué sucede cuando el visitante hace clic sobre él.

Para cambiarlo:

  1. Dentro de la configuración del módulo, localiza el apartado Enlace.

  2. Busca el campo URL del enlace del botón.

  3. Elimina la dirección anterior.

  4. Introduce la nueva dirección de destino.

  5. Comprueba que la URL sea correcta.

También puedes utilizar enlaces a otras páginas, direcciones de correo electrónico o números de teléfono.

Importante: comprueba siempre que el enlace dirige al destino correcto para evitar que los visitantes encuentren páginas inexistentes o errores.

5. Configura cómo se abre el enlace

Divi permite elegir si el enlace del botón se abre en la misma pestaña del navegador o en una nueva.

Dentro del apartado Enlace, localiza la opción Destino del enlace del botón.

Encontrarás dos posibilidades habituales:

  • En la misma ventana: el visitante accede a la página de destino en la pestaña actual.

  • En una nueva pestaña: la página de destino se abre en otra pestaña del navegador.

¿Cuál deberías seleccionar?

  • Para enlaces a páginas de tu propia web, lo habitual es utilizar la misma pestaña.

  • Para determinados enlaces externos, puede resultar útil abrir una nueva pestaña.

Como norma general, mantén la configuración existente salvo que necesites cambiarla.

6. Guarda los cambios

Una vez que hayas actualizado el texto y el enlace del botón:

  1. Comprueba que el botón muestra el texto correcto.

  2. Revisa que la dirección de destino esté bien escrita.

  3. Confirma las modificaciones del módulo, si corresponde.

  4. Utiliza la opción Guardar del constructor visual de Divi 5.

  5. Espera a que termine el proceso de guardado.

  6. Sal del constructor visual y visita la página publicada.

Recuerda que debes guardar los cambios generales de la página para que las modificaciones queden publicadas.

7. Comprueba que el botón funciona correctamente

Después de guardar, es recomendable probar el botón como lo haría cualquier visitante.

  1. Abre la página desde la parte pública de tu sitio web.

  2. Localiza el botón que acabas de modificar.

  3. Haz clic sobre él.

  4. Comprueba que dirige a la página correcta.

  5. Verifica que se abre en la misma pestaña o en una nueva, según lo configurado.

También es recomendable comprobar que el botón se visualiza correctamente desde un teléfono móvil.

Recomendaciones finales

Para mantener una navegación clara y una apariencia profesional en tu sitio web:

  • Utiliza textos claros: el visitante debe entender qué ocurrirá al pulsar el botón.

  • Evita textos demasiado largos: pueden alterar el tamaño del botón o dificultar su visualización en dispositivos móviles.

  • Comprueba los enlaces: asegúrate de que llevan al destino correcto.

  • Mantén el diseño original: no modifiques colores, tipografías, tamaños o efectos si no es necesario.

  • Revisa la versión móvil: verifica que el botón se muestra correctamente y resulta fácil de pulsar.

  • Guarda siempre los cambios: antes de salir del constructor visual.

Siguiendo estos pasos podrás actualizar los botones de tu sitio web de forma autónoma, mejorando la navegación y facilitando que los visitantes encuentren la información que necesitan.

Importante: este tutorial está pensado para modificar módulos de botón existentes. Algunos botones pueden formar parte de otros elementos, como formularios, cabeceras o módulos especiales, y sus opciones de edición pueden ser diferentes.

Aprende a modificar los botones de tu sitio web de forma sencilla utilizando el constructor visual de Divi 5.
En este tutorial te explicamos paso a paso cómo cambiar el texto de un botón, actualizar su enlace de destino, configurar cómo se abre y guardar los cambios sin alterar el diseño de la página.

No se permite comentar en este curso.