Saltar al contenido principal

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

file-1mo4pysbrb-6166085


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
R Marketing Digital