Acerca del Elemento Botón de Envío
El Botón de Envío es un elemento clave utilizado exclusivamente dentro de formularios de contacto para permitir a los visitantes enviar su información o respuestas.
El botón de envío está diseñado específicamente para enviar y remitir datos de formularios. No puede funcionar como un botón para redirigir a otro enlace o como un Añadir al Carrito Botón.
¿Cómo Agregar un Elemento Botón de Envío a su Página?
Para agregar el botón Enviar a su página, siga estos pasos:
Paso 1: Acceda al Panel de Control de GemPages > Páginas, luego haga clic en la página de destino para ubicar el editor.
Paso 2: Desde la barra lateral izquierda, busque “botón de enviar”, luego arrástrelo y suéltelo en un elemento de boletín informativo o de formulario de contacto.
Si aún no tiene ninguno de ellos, agregue uno en su página primero, luego anide el Botón de Envío dentro.
Paso 3: Haga clic en el elemento para abrir su configuración para una mayor personalización.
Configurar la pestaña Configuración
En la sección pestaña de Configuración, puede ajustar las siguientes secciones:
Tamaño
Ancho: Elija cómo se escala el botón horizontalmente:
- Ajustado al contenido (Auto): El botón se ajustará al tamaño de su contenido (texto e icono).
- Completo (100px): El botón se expandirá para llenar todo el ancho de su contenedor.
- Ancho personalizado: Si prefiere otros valores, ingrese un número específico en el cuadro (en %) para ajustar el ancho del botón a su gusto.
Altura: Establezca la altura en Ajustar al contenido (Automático) o un valor de píxel fijo.
Relleno: Define el espaciado interno dentro del botón.
Fondo
Establezca un sólido or fondo de color degradado para el botón Enviar. Puede ajustar el color mediante:
- Ingresar el código de color
- Arrastrando o seleccionando de las muestras de color
- Usando el selector de color para seleccionar cualquier color en su página actual
- Eligiendo un color desde la lista Colores recientes or Colores sugeridos liza
Ícono
Para agregar un ícono en el elemento Botón Enviar, active el Ícono sección y personaliza el icono a su manera en la configuración.
- Icono: Elija un ícono de las opciones disponibles de GemPages o puede cargar el suyo propio (solo archivo .SVG).
- Posición: Seleccione la posición del ícono para que esté a la izquierda o a la derecha con el texto del botón.
- Brecha: Ajuste el espacio entre el icono y el texto del botón.
Estilos de texto
En la sección Estilos de texto , modifique el texto del botón como prefiera:
- Contenido: Cambie el texto del botón como forma de incitar a los clientes a realizar una acción.
- Estilo: Elija el estilo de texto de Encabezado 1-6 or Párrafo 1-3 como estilo global.
- Fuente: Seleccione un estilo de fuente que coincida con la identidad de su marca.
- Tamaño: Ajuste el tamaño de fuente para hacer el texto prominente.
- Color: Elija un color que complemente su diseño.
Haga clic en Mostrar más para ampliar la configuración completa de la sección Estilos de texto :
- Grosor de Fuente: Controle qué tan grueso o delgado aparece el texto.
- Altura de Línea Ajuste el espacio entre líneas para mejor legibilidad.
- Espacio entre letras: Cree un aspecto más moderno o compacto cambiando el espacio entre letras.
- Transformación: Convierta el texto a mayúsculas, minúsculas o capitalice la primera letra de cada palabra.
- Sombra: Aplique efectos de sombra paralela para mejorar la profundidad visual.
Efecto
Personalice cómo reacciona su botón de Envío cuando se pasa el cursor sobre él:
FondoSeleccione el color de fondo al que cambiará su botón cuando pase el cursor sobre él.
Color de TextoCambie el color del texto al pasar el cursor sobre él.
Forma: Personalice la forma del botón cuando pases el cursor sobre él:
- BordeAgregue o personalice el estilo del borde cuando pasas el cursor sobre él (color, grosor, trazo).
- Esquina: Ajuste el radio de las esquinas al pasar el mouse para hacer que los bordes sean más redondeados o cuadrados.
- Sombra: Aplique un efecto de sombra para darle más profundidad al botón cuando pasas el cursor sobre él.
Alineación
Cuando el ancho del botón se establece en 100% o mayor, la alineación horizontal se desactivará. De lo contrario, puede alinear el botón a la izquierda, al centro o a la derecha.
Configurar la pestaña Avanzada
Para una personalización más avanzada, navegue a la pestaña Avanzada y siga las instrucciones en este artículo.
