Por medio de los comandos de esta sección se pueden definir algunos de los ajustes gráficos referidos al aspecto del Formulario de Contacto que se está creando.
Ante todo es preciso seleccionar el Elemento de formulario sobre el que se desea trabajar: es posible hacerlo a través del menú desplegable de la opción homónima, o bien pulsando directamente sobre el elemento en la ventana de Vista previa disponible.
Los elementos que se pueden modificar son:
|
Etiquetas: es el texto de descripción del campo y sirve para especificar la información requerida o introducir el texto de la pregunta que se desea formular. |
|
Campos: es el recuadro en el que el visitante podrá introducir la información requerida. |
|
Botón de 'Enviar' : son los botones introducidos automáticamente al final del Formulario de Contacto. Sirven, respectivamente, para enviar todos los datos introducidos en los campos y para vaciar los campos de los valores que pudiesen contener. |
|
Descripción y validación de campo: se trata de los mensajes mostrados para dar información adicional sobre cómo rellenar los campos, para invitar a corregir un dato introducido o para exhortar a completar un campo obligatorio dejado vacío. |
En función del elemento del formulario seleccionado es posible modificar diferentes opciones presentadas en la sección Estilo.
Para el elemento Etiquetas las opciones disponibles son las siguientes:
| ▪ | Fuente: define el tipo de carácter, el estilo y el tamaño del texto. El menú desplegable propone: la opción para aplicar la Fuente predeterminada (definida por el estilo del elemento Texto de la página en la ventana Estilo de los textos); la lista de las Fuentes Seguras, es decir fuentes presentes en todos los dispositivos y para las cuales por tanto no es necesaria ninguna publicación; todas las Fuentes Web y las Google Fonts añadidas mediante la ventana Añadir Fuentes Web que se abre con la opción Otros tipos de carácter. |
| ▪ | Color: especifica el color que se utilizará para el texto. |
| ▪ | Repetir: permite definir dónde se debe colocar la etiqueta respecto al campo. Es posible escoger entre tres alternativas: Mostrar etiquetas sobre los campos, Mostrar etiquetas dentro de los campos y Mostrar etiquetas a la izquierda de los campos. Si se escoge colocar la etiqueta a la izquierda de los campos es posible definir el Ancho (%), es decir el porcentaje del espacio de la fila que deberá ser ocupado por la etiqueta misma, y la Alineación del texto de la etiqueta. |
Para el elemento Campos, en cambio, las opciones disponibles son las siguientes:
| ▪ | Borde: especifica el espesor de los bordes y el factor de redondeo de las esquinas, también individualmente. |
| ▪ | Margen: define los valores en píxeles de los márgenes internos aplicados al texto de los campos del módulo. |
| ▪ | Sombra: aplica una sombra dentro de los campos para dar una sensación de profundidad.. |
| ▪ | Colores: una vez definido el estado en el que se quiere trabajar (Campo, Campo seleccionado, Campo con errores), define los colores que se quiere emplear para Fondo, Texto y Borde. |
Para el elemento Botón de 'Enviar' las opciones disponibles son las siguientes:
| ▪ | Contenido: especifica el texto que se debe mostrar en el Botón de Enviar, en lugar de aquel previsto por defecto. |
| ▪ | Fuente: define el tipo de carácter, el estilo y el tamaño del texto. El menú desplegable propone: la opción para aplicar la Fuente predeterminada (definida por el estilo del elemento Texto de la página en la ventana Estilo de los textos); la lista de las Fuentes Seguras, es decir fuentes presentes en todos los dispositivos y para las cuales por tanto no es necesaria ninguna publicación; todas las Fuentes Web y las Google Fonts añadidas mediante la ventana Añadir Fuentes Web que se abre con la opción Otros tipos de carácter. |
| ▪ | Color Texto / Color Fondo: especifican los colores que se deben utilizar para el texto y para el fondo del texto de los botones. |
| ▪ | Borde: especifica el color y el espesor de los bordes además del factor de redondeo de las esquinas de los botones. |
| ▪ | Margen: define los valores en píxeles de los márgenes internos aplicados al texto de los botones. |
| ▪ | Imagen de fondo: selecciona el archivo gráfico (.JPG, .GIF, .PNG.) de la imagen que se utilizará como fondo. |
| ▪ | Alineación: especifica la alineación de los botones añadidos, eligiendo entre Izquierda, Centro y Derecha. |
Finalmente, para el elemento Descripción y validación de campo las opciones disponibles son las siguientes:
| ▪ | Archivo de icono de descripción del campo: permite importar un archivo gráfico (formato .JPG, .GIF y .PNG) para utilizarlo como icono que poner al lado del campo para indicar que hay más información disponible. |
| ▪ | Mostrar la descripción al seleccionar el campo: activando esta opción aparece visualizado automáticamente el mensaje con la información adicional, en cuanto se hace clic dentro del Campo. |
| ▪ | Si se produce un error durante la validación de datos: permite elegir cómo debe ser mostrado el mensaje previsto en el caso en el que un campo no haya sido rellenado correctamente o, si está definido como obligatorio, se haya dejado vacío. Es posible elegir una de las siguientes opciones: Mostrar la ventana de diálogo del navegador, Mostrar ventana de popup interna o Mostrar sugerencia al lado de campo no válido. |
