Crear formulario con FormCraft es muy sencillo, solo tendremos que ir al panel de nuestro escritorio y dirigirnos a FormCraft > Forms.

Para crear un nuevo formulario, tendremos que hacer click en [New Form]. Desde aquí podremos seleccionar una plantilla, importar un template, duplicar un formulario existente o crear una nueva.

Para este ejemplo, utilizaremos uno en blanco, crearemos el formulario indicando un nombre (obligatorio) y una vez dentro se nos presentarán las siguientes herramientas:

Veamos cada una de las herramientas disponibles en nuestra barra lateral derecha:

• Heading: Agrega un encabezado de texto dentro del formulario como título.
• One Line Input: Campo de texto corriente (genérico) que puedes ocupar para campos como Nombre, Apellido, Teléfono u otro.
• Email Input: Campo exclusivo para registro de correo electrónico.
• Textarea: Campo utilizado para texto extendido, generalmente utilizado para que el usuario realice comentarios.
• Checkbox: Campo de opciones seleccionables, que pueden ser múltiples o únicas.
• Dropdown: Campo desplegable de selección unica.
• Datepicker: Calendario para seleccionar fechas, comunmente utilizado para reservas de hospedaje. Para agregar hora, usar More Fields > Timepicker.
• Custom text: Similar al encabezado, permite agregar texto en formato plano y HTML.
• Submit: Botón que procesa el formulario finalmente.
• Password: Campo para ingresar exclusivamente claves.
• File Upload: Campo para carga de archivos de cualquier tipo. Puedes también definir especificamente qué formatos de archivo aceptar.
• Slider: Agrega un deslizador que puede ser utilizado comunmente para definir nivel de satisfacción.
• Timepicker: Al igual que Datepicker, puedes habilitar la posibilidad de que el usuario defina un horario. Comunmente utilizado para reserva de horas.
• Address: Ideal si quieres que el usuario defina su dirección y además la confirme con la visualización de un mapa en el mismo formulario de contacto.
   
• Survey (Encuestas):
  • Thumb Rating: Le permite al usuario definir si le gustó o no el servicio desplegando iconos de dedo arriba y abajo.
  • Star Rating: Le permite al usuario poner nota a algun serivicio, puntuando con cantidad de estrellas.
  • Choice Matrix: A través de una matriz, puedes definir en distintos aspectos cómo fue la experiencia del usuario.

Solo tendremos que en cada tipo de campo, definir sus límites o forma de funcionar haciendo click en cada uno de ellos.

Podrás especificar si quieres que el campo sea de solo lectura, requerido, aceptar espacios, ocultar, agregar condiciones, etc.

Una vez definido los campos que estarán en nuestro formulario, debemos configurar a qué correo llegarán y con qué información. Para ello debemos ir a la pestaña Settings > Email > Email notifications y definir cada campo: Hacia qué correo, el asunto y el cuerpo del mensaje que recibirás.

En el cuerpo del mensaje ya vienen shortcodes predefinidos, que puedes mantener o eliminar. Los shortcode básicamente nos muestran información asociada, como por ejemplo, hora en la que se envió el formulario, fecha, desde qué pagina, su ID, etc.

Más abajo tendremos (de forma opcional) la pestaña Email Autoresponders por si queremos que el cliente o usuario reciba un email de confirmación. Es importante obviamente que tu formulario contenga un campo de tipo email, ya que ese mensaje automático será enviado al email especificado por el usuario.

¿Cómo modificar el aspecto de mi formulario?

Para modificar el aspecto del formulario, vamos a la pestaña Styling donde, en la subpestaña General, podremos definir elementos generales como eliminar margenes, bordes, esconder los asteriscos (*) de los campos requeridos, esconder los iconos que vienen con algunos tipos de campos, modificar fuentes, muestra de los elementos del formulario, entre otras cosas.

En la pestaña Logic podremos agregar lógica al formulario para determinados campos, como por ejemplo, cuando el campo nombre se complete, que se muestre un campo que estaba anteriormente oculto.

Para guardar los cambios realizados, hacemos click en la pestaña SAVE.

Ahora, lo más importante, ¿cómo mostrar este formulario en alguna página o pie de página?

Muy simple, solo tendremos que copiar el shortcode del formulario y pegarlo como texto en alguna de nuestras páginas o Widgets. Para ello, en la pestaña Settings, hacemos click en EMBED y damos click en Shortcode, como se muestra en la siguiente imagen:

Basta con copiar el código y pegarlo en nuestra página, y eso sería todo, ya podremos ver nuestro formulario funcionando.