CREA FORMULARIOS WEB CON COFFEECUP WEB FORM BUILDER

Lo primero que siempre encuentra uno en la web, es que para crear un formulario de inscripción se debe saber algo sobre programación, manejo de Html, CSS, así como otros canales para no solamente crear dicho formulario, sino también para un espacio donde se almacenara dicho trabajo. Yo personalmente lo intente y me fue bien, pero en realidad no quería algo tan sencillo en donde solo se pusiera el nombre y el correo, sino también quería mostrar imágenes, tener una introducción, bueno tener bastantes cosas que aunque yo se que las personas que manejan estos temas lo pueden lograr en un instante, para personas que estamos empezando en este medio se hace mas complicado.

Por eso buscando, me encontré con un excelente programa que me ha ayudado a crear un formulario de la nada, y de una manera tan sencilla, que es difícil de creer, y lo mejor de todo es que con todas sus funciones el trabajo se hace mas fácil, tanto que lo único que hay que hacer es mover algunos números, montar imágenes, hacer la descripción de lo que se hace, y listo. Este programa que se conoce como CoffeeCup Web Form Builder Lite es completamente gratuito, y aunque es en ingles, contiene unas funciones tan sencillas de reconocer y manejar, que prácticamente será cosa de minutos para crear tu primer formulario. Lo que me parece genial es que este programa se puede asociar con MailChimp, que es un programa que aunque permite crear formularios, no permite montar la estructura de este en una web cualquiera, lo único que nos aparecería es el formulario básico, sin colores, ni imágenes…por eso es que CoffeeCup es la mejor herramienta que puedes usar para esto, porque genera el formulario y lo puedes unir con cualquier lista que tengas, para empezar a trabajar.

Como ya dije antes este programa por su diseño profesional, y su forma tan sencilla de trabajar, es un gran programa, que me ayudo a simplificar un trabajo que llevaba haciendo un para de meses. Ahora bien, a continuación encontraran la forma de crear un formulario para publicarlo en tu blog o tu web, ya el ingenio se los dejo a ustedes y sus gustos.

1.     Descargar el programa de CoffeeCup web Form aquí, el programa funciona tanto para Windows como para OS X (Apple), ya ustedes escogen el que mas les convenga.

2.     Despues de la descargar, simplemente lo instalamos, y empezamos a trabajar. Este programa es gratuito y no ocupa mucho espacio en disco por lo que es genial.

CREANDO TU PRIMER FORMULARIO

1.     Ya que tenemos abierto nuestro programa, encontraremos una columna a mano izquierda de nuestra computadora, donde encontraremos tres semi-columnas (Elements, Properties y Form Options). Abrimos Elements allí hay tres títulos Basic, Magical y Status, con estas tres crearemos nuestro formulario. Solo es arrastrar o dar click sobre lo que deseamos en nuestro formulario y listo.

                                            

                                                                                  

1.     Luego de agregar lo que deseemos para nuestro formulario, nos vamos a Properties y hacemos los cambios que queramos, eso si, antes escogemos la categoría que vamos a cambiar.

 ·       Label: Escogemos el nombre o la categoría que vamos a poner (comentarios, nombre, correo electrónico…) Enseguida encontraremos un cuadro para colorear este nos dará el color del texto que ponemos.

 ·       Name, Placeholder, y los tamaños los podemos dejar así, si lo queremos

 ·       Field Options: Este punto es muy importante; en este determinamos si el campo que se hizo es obligatorio o no, ustedes lo pueden dejar como en lectura (read only) o obligatorio (Required).

·       Width: Presenta un porcentaje de ancho del área que estamos trabajando, aquí se puede adecuar a lo que vayan a hacer.

·       Padding: pueden mover hacia arriba, abajo, derecha e izquierda el área que se este organizando. Inténtelo es muy bueno y les puede dar ideas, jueguen con los números.

·       Los demás elementos Friendly Hint, Error Message y Show elements, lo pueden dejar tal cual, no hay problema.

·       Delete: les aparecerá en todos lados, es para desaparecer dicho campo instalado, aunque también pueden marcar el área, y dar Suprimir.

·       Reset Styles: si deseas volver todo a como era antes de empezar con los cambios puedes dar click allí, para comenzar de nuevo.

2.     Por ultimo encontramos Form Options ques es lo que determinara el fondo de nuestro formulario y sus funciones. Par esto tenemos varias opciones:

·       Color: Este determinara el color del fondo de nuestro formulario, lo podemos cambiar y adecuar a nuestro gusto.

·       Background: No hay problema lo pueden dejar tal como esta.

·       Border: Nos determinara el marco de nuestro formulario, tienes varias opciones de bordes, además que podemos determinar su ancho y el color que este llevara.

·       Font: Permite cambiar el tamaño de la letra, el color y el tipo de letra que deseemos.

·       Label Position: Con esta opción podremos cambiar la ubicación de la letra, pasándola de derecha a izquierda, o dejarla encima de cada casilla de llenado.

·       Item Width: Este lo pueden dejar al 100%, no hay problema ya que no produce muchos cambios, igualmente pueden ensayar con esta opción.

·       Form Width: La opción permite ampliar o reducir el tamaño de nuestro formulario.

·       Max. Width: permite complementar la opción de reducir el formulario, dejándolo aun mas angosto de lo que se tenía previamente.

Customize margins: dentro de esta opción también tenemos la posibilidad de cambiar las márgenes de nuestro proyecto, llevándolo de arriba abajo o de derecha a izquierda.

·       Autofocus, Max. Errors, y Hidden Fields, se pueden dejar como están, si desean pueden modificar lo que deseen allí, pero no es necesario.

Listo, después de haber terminado con nuestro formulario, lo que vamos a hacer y lo que deseamos realmente es montarlo en nuestra pagina o blog, por eso, nos dirigiremos a Settings, allí nos abrirá un cuadro de dialogo. Entre las múltiples opciones buscamos Email Notices, encontraremos dos opciones, una Notification Message, donde solo pondremos el correo electrónico en la casilla "To" que es en donde queremos que lleguen las correos de las personas que se inscriben en el formulario. La segunda opción sirve para las personas que quieren agregar un auto-responder donde simplemente las personas que se unen a ti, recibirán un correo de vuelta con un mensaje de bienvenida, o alguna pagina para descargar, o lo que deseen agregar ustedes para los nuevos integrantes que envían sus datos. Todo dependiendo si ya tienen un programa o una herramienta que trabaje sobre esta función. En ambos casos después de hacer esto, le damos Configure mail massage y luego en OK para confirmar la acción.

Nota: Si desean unir el formulario de Mailchimp con el de CoffeeCup, pueden ingresar en esta pagina para aprender como hacerlo. Así podrán subir su formulario con este formato, y no con un formato vacío, como se presenta en Mailchimp.

Acto seguido, ingresamos nuevamente en Settings, y damos click en Form Publishing, encontraremos la opción de ingresar un nombre y una contraseña, pero como todavía no tenemos estos datos, nos dirigimos a Get an account, que esta subrayado en azul. Luego de haber dado click allí, este nos abrirá una pagina en CoffeeCup.com esta pagina es grandiosa porque si queremos también podemos crear un blog gratuito. Ya estando allí, lo que hay que hacer es dar click en Sing Up, en la cuenta que aparece en cero, así crearemos una cuenta gratuita, y que necesitamos solo para nuestro formulario. Llegando allí, en la parte superior izquierda de nuestra pantalla, encontraremos Sing In, ahí solo ponemos el correo electrónico, una contraseña y un código de verificación, estos datos lo llenamos, y luego de darle en Sing in, esta pagina nos enviara un mensaje de confirmación al correo dado, solo lo confirmamos en Validate Your Account Now y listo.

Ya que tenemos confirmado el correo y la contraseña, llegamos a la página nuevamente de CoffeeCup.com y le damos en Login now, e ingresamos los datos que pusimos para registrarnos. Ahora que estamos en la página en la parte de arriba de nuestra pantalla dice S-DRIVE, desplegamos esta opción y damos click en Web Form Hosting. Con esto podremos llegar a crear una pagina web, le ponemos el nombre que queramos, miramos si esta disponible y le damos continuar. Por ultimo escogemos un tema de plantilla y le damos en Apply.

                             

COMO PUBLICAR NUESTRO FORMULARIO

Ya que tenemos todos los datos que necesitamos, nos vamos nuevamente al programa de CoffeeCup Web Form Builder Lite, y nos dirigimos a llenar los datos que faltan en Form Publishing con el correo y la contraseña que tenemos. Automáticamente nos abrirá una ventana donde nos muestra la pagina que hicimos (sino es así solo le damos en Refresh), seleccionamos la pagina y le damos en OK.

Por último, nos dirigimos a Publishing donde hay un pequeño mundo y le damos click, si les aparece un cuadro de dialogo le dicen OK o SAVE dependiendo del caso. Ya con esto nos dará un código en CSS, HTML, bueno en realidad es un codigo que funciona para muchas plataformas en Blogs y paginas web. Solo copiamos el código que aparece allí, y lo pegamos en nuestra página, y listo, ya tenemos nuestro formulario listo para trabajar. Ensáyenlo primero para ver que todo este en orden.

                                       

                                       

Bueno espero que lo disfruten bastante, y que creen un gran formulario, lastimosamente podemos solo crear un formulario de forma gratuita, pero si les gusta simplemente pueden pagar por algunos de los servicios que ofrecen en la página de CoffeeCup.com, dependiendo de lo que necesiten. Aunque esta larga la explicación, es muy sencillo hacer este procedimiento. Al principio a mi me costo bastante porque no tuve a alguien o algo que me guiara, pero con esto, ustedes pueden hacer sus formularios hasta con los ojos cerrados. Nuevamente disfrútenlo y sean creativos, ya que esto atraerá mas inscritos en el formulario.

Twittear