Cómo hacer un botón flotante en Elementor

Rifat Elementor Jul 29, 2022

¿Quieres saber cómo hacer un botón flotante con el generador de páginas de Elementor ? ? Un botón flotante es el que aparece delante de toda la información de la pantalla. La mayoría de los propietarios de sitios web incluyen un botón flotante procesable que dirige al usuario a un objetivo específico, como suscribirse a una lista de correo electrónico o navegar por la página de una tienda. redes sociales, entre otras cosas

Puede crear rápidamente un botón flotante para su sitio web con Elementor de varias maneras. En este tutorial, le mostraremos cómo hacerlo de la manera más sencilla posible utilizando el generador de páginas Elementor .

Hacer un botón flotante en Elementor

Aquí configuraremos el índice z para construir nuestro botón flotante. Con la versión gratuita de Elementor, puede crear un botón flotante para una página específica siguiendo este procedimiento. Si desea agregar el botón flotante a todo su sitio, debe agregar manualmente el botón a cada página si está utilizando la versión gratuita de Elementor.

Ahora, abra el editor de Elementor y navegue a la página donde desea agregar el botón flotante. Tienes la opción de crear una nueva página o editar una existente. Para agregar una sección, haga clic en el ícono "+" y seleccione el diseño de una sola columna.

Create Amazing Websites

Con el mejor generador de páginas gratuito Elementor

Empezar ahora

Agregue el widget de botón a su columna recién creada desde el panel de widgets.

Ahora debe elegir la acción del botón. En este caso, estamos usando el botón para navegar a la URL de la página de la tienda. Para lograr esto, vaya al campo de enlace y agregue el enlace a la página. La ubicación del botón se puede cambiar usando la opción de alineación. Haz el botón lo más pequeño posible.

Nuestro botón ahora está listo para flotar cuando un usuario se desplaza hacia abajo en la página. Para ello, vaya a la pestaña Avanzado y seleccione la opción Diseño. Establezca el ancho y la posición en En línea (Auto). También debe configurar las orientaciones Horizontal y Vertical, así como el desplazamiento.

Ahora debe especificar el índice z para que el botón siempre sea flotante. Rellene la ranura del índice z con 800. Siempre hará que el botón flote.

Vista final

Así es como se ve nuestro diseño final.

Terminando

La función de elementos flotantes de Elementor ha despertado nuestro interés. Ayuda en la resolución rápida de problemas de diseño. Creemos que tendrá el mismo efecto en usted. Si es así, por favor comparte tu diseño en el área de comentarios. Queremos difundir tu trabajo por todo el mundo. Echa un vistazo a nuestros otros tutoriales de elementor también.

Divi WordPress Theme