A la hora de diseñar tu propia página web o Landing Page, el uso de enlaces, botones y CTAs para dirigir la acción del usuario es esencial.
Normalmente, estos botones dirigen directamente a tus productos o a otra página dentro de tu web, pero hay ocasiones en las que lo que necesitas es incluir saltos dentro de una misma página, para pasar de una sección a otra de más abajo, por ejemplo.
En este caso, añadir enlaces internos dentro de una misma página con la plantilla Divi, es muy sencillo y lo puedes hacer en menos de 1 minuto gracias a su constructor. ¿Quiéres saber cómo?
Enlazar dos puntos dentro de una misma página con Divi en tan solo dos pasos
Supongamos que estás diseñando la Home para tu web y quieres añadir un botón de «Contratar Servicios» que lleve directamente a la tabla de precios que incluyes unas secciones más abajo.
O imagínate que tienes una Landing Page muy extensa con una información muy detallada de tu producto y quieres incluir botones de «Comprar» a lo largo de ella, pues quizás no todo el mundo llegue hasta el final del contenido.
Para estos dos casos y para otros en los que necesites crear anclajes internos dentro de una misma página web y que sea posible desplazarse de un punto a otro de forma directa, tan solo tienes que seguir estos pasos:
Entra en la edición de la página donde deseas incluir los enlaces internos o «saltos de página». Es decir, el ancla que quieres crear.
Entra en los ajustes del módulo, fila o sección hacia el que quieres enlazar y clica en el apartado de «Avanzado».
Asígnale un nombre en la casilla de «Identificador CSS» (id). Puedes asignarle el nombre o id que quieras. En nuestro ejemplo lo hemos llamado botondecompra, porque lo queremos enlazar al botón de compra final de una página de venta.
Guarda cambios.
Ahora entra en los ajustes del módulo desde donde deseas crear el enlace. En el apartado de «Contenido» incluye el nombre o id anterior tras el símbolo de enlace «#», en la casilla «URL del botón»
Tal y como puedes ver en la siguiente imagen.
Guarda cambios.
Si previsualizas cambios, podrás comprobar que el enlace interno que has creado para esta página, funciona correctamente.
Fácil, ¿verdad?
En este ejemplo se ha hecho con un módulo de botón de Divi, pero también se pueden incluir enlaces internos en un página con los módulos de icono (anuncio), imagen…
Aunque es una técnica de la que se recomienda no abusar, sí es cierto que en ciertas páginas webs o páginas de venta, estos anclajes internos, ayudan a que el usuario web encuentre fácilmente lo que anda buscando.
Estos enlaces también se pueden crear de forma manual con anclajes en HTML, pero como habrás visto, si ya tienes la plantilla Divi instalada, añadir enlaces internos dentro de una misma página es extremadamente sencillo. Esta es otra de las ventajas de diseñar una web con el constructor Divi 😉
Claro, sencillo y fácil de entender. GRACIAS
Grac ias por tu explicación. Mis enlaces al interno de la página funcionan bien, sólo que ocurren con un estilo de desplazamiento suave. Qiuisiera cambiar al estilo de salto directo al ancla, sin que se vea el scrolling. debe ser cuestion de CSS, pero ¿dónde iría esa especificación de estilo?
Gracias por el aporte, pero ¿sabes cómo se hace cuando has utilizado el módulo de pestañas de divi y quieres crear un enlace para cada una de las pestañas?
Perfecto, muchas gracias.
Recordad que en Avanzados escribimos la id del css, tipo: Ejemplo
y después hay que modificar los elementos del menú añadiendo la # y debemos escribirlo exactamente igual que el id del Css utilizado: #Ejemplo
Me funcionó perfecto, aunque el anclaje es muy brusco sería bueno saber de alguna animación para la transición del anclaje.
Slds a todos. Mi problema es que cree una pagina de inicio partir de una plantilla Divi, le asigne el nombre a la pagina (INICIO) y la agregue al menú que nombre «menú principal», pero cuando busco mi pagina como https://mipagina.com/ me manda a una pagina sin nada, solo se ve el logo arriba y como si no hubiera hecho nada, algo que no ocurria antes ya que este es un re-diseño de la pagina. Pero ahí se ve en el menú arriba INICIO, lo toco y entonces se va al contenido que hice, entonces la dirección se convierte en esto https://mipagina.com/inicio. O sea que el dominio solo, no me lleva a mi sitio. Les hago saber que visualmente en PAGINAS solo tengo activa la pagina de nombre INICIO que es donde esta mi pagina hecha, no tengo nada mas y no tengo nada mas que INICIO agregado apariencia/menú. Porque me manda a este apartado https://mipagina.com/ sin nada?, que es donde debe verse mi sitio. Se que algo hago mal, pero no se que? Me pueden indicar mi error por favor.
hola, no me funciona…. lo ingreso correctamente pero al presionar el boton no baja y se recarga nuevamente la pagina.
hola, tengo este error en wordpress,con el tema de divi instalado
Warning: «continue» targeting switch is equivalent to «break». Did you mean to use «continue 2»? in /homepages/11/d592176699/htdocs/clickandbuilds/PAGINANUEVACREIXA/wp-content/themes/Divi/includes/builder/functions.php on line 5753
Warning: Cannot modify header information – headers already sent by (output started at /homepages/11/d592176699/htdocs/clickandbuilds/PAGINANUEVACREIXA/wp-content/themes/Divi/includes/builder/functions.php:5753) in /homepages/11/d592176699/htdocs/clickandbuilds/PAGINANUEVACREIXA/wp-includes/pluggable.php on line 1265
Warning: Cannot modify header information – headers already sent by (output started at /homepages/11/d592176699/htdocs/clickandbuilds/PAGINANUEVACREIXA/wp-content/themes/Divi/includes/builder/functions.php:5753) in /homepages/11/d592176699/htdocs/clickandbuilds/PAGINANUEVACREIXA/wp-includes/pluggable.php on line 1268
Gracias por el aporte, son cosas que uno va aprendiendo
Un saludo
Como puedo hacer un link para que habra un archivo que tengo en mi ordenador a través de DIVI?
Gracias