Widget de botón

los Widget de botón le ayuda a diseñar y personalizar botones fácilmente sin la necesidad de otros complementos o códigos cortos.

Contenido

1. Tipo: Seleccione entre 5 estilos de botones para comenzar su diseño. Escoge de Defecto, Información, Éxito, Advertenciao Peligro
2. Texto: Ingrese el texto del botón
3. Enlace: Establezca la URL del enlace del botón. Haga clic en el engranaje para configurar el enlace para que se abra en una nueva ventana o para agregar rel = nofollow al enlace
4. Alineación: Alinee el botón a la izquierda, al centro, a la derecha o justificado en relación con su columna.
5. Talla: Seleccione los tamaños de botón preestablecidos, de Extra pequeño a Extra grande (consulte los detalles predeterminados del relleno al final de este documento)
6. Icono: Seleccione un FontAwesome icono para mostrar en el botón
7. Icono Posición: Configura el icono para que aparezca antes o después del texto del botón
8. Icono Espaciado: Ajusta la cantidad de espacio entre el icono y el texto del botón
9. Botón CARNÉ DE IDENTIDAD: (Opcional) Asigne un ID de botón único para usar en situaciones como Eventos de Google Analytics

Estilo

1. Tipografía: Cambia las opciones de tipografía predeterminadas para el texto del botón
2. Sombra de texto: Agrega una sombra y desenfoque al texto del botón
3. Texto Color: Seleccione el color del texto del botón
4. Color de fondo: Seleccione el color de fondo del botón para ambos Normal y Flotar estados
5. Animación de desplazamiento: Haga clic en el Pestaña flotante para establecer un Animación de desplazamiento
6. Tipo de borde: Seleccione el tipo de borde que se utilizará alrededor del botón
7. Anchura: Controla el grosor del borde alrededor del botón
8. Color: Elige el color del borde
9. Frontera Radio: Establece el radio del borde para controlar la redondez de las esquinas
10. Caja Sombra: Establece opciones para aplicar una sombra de cuadro en el botón
11. Relleno: Cambia la configuración de relleno del botón

Cómo rastrear el evento «Button onClick» (para Facebook Pixel, Google Analytics o Google Tag Manager)

Siga estos pasos para rastrear eventos de botón onClick:

1. Editar Botón > Avanzado > establecer CSS ID = My_Button
2. Agregar al widget HTML de la página (después de que el botón esté bien)
3. Pegue el siguiente código en el campo Código HTML:

   <script> 
   document.addEventListener("DOMContentLoaded", function(event) { 
   	jQuery('#My_Button a').click(function(){ 
   	// tracking code here
   	// for example Facebook Pixel: 
   		fbq('track','AddToCart'); 
   	}); 
   	}); 
   </script>
   	

4. Actualizar página, vista previa, prueba

Avanzado

Establecer las opciones avanzadas que son aplicables a este widget

Cómo hacer un botón Descargar PDF

1. Agregar un widget de editor de texto
2. Sube tu PDF a través del Widget de editor de texto
3. Publicar la página
4. Vaya a la página en vivo y copie el enlace URL que apunta al PDF
5. Ahora, en otra página, agregue un widget de botón y configure el enlace a la URL

Tamaños predeterminados de botones: valores predeterminados de relleno

Arriba a la izquierda, abajo a la derecha

• Extra Pequeño: 10 px, 20 px, 10 px, 20 px
• Pequeña: 12px, 24px, 12px, 24px
• Medio: 15px, 30px, 15px, 30px
• Grande: 20px, 40px, 20px, 40px
• Extra grande: 25px, 50px, 25px, 50px