29 de septiembre de 2008

EmailMeForm un Formulario de contacto para blogger

Una de las formas de contacto de cualquier web es el "Formulario de Contacto" pero por alguna razón que desconozco Blogger no lo tiene, al menos por ahora. Para solucionar este problema hay varias paginas que brindan este servicio, una de ellas es EmailMeForm.com que con un código HTML nos ayuda en esta tarea.

Lo primero que hay que hacer es ir la EmailMeForm y registrarnos. Una vez logeados vamos al panel y elegimos "Form Wizard" y seguimos los pasos que nos indican, que a pesar de estar en inlgés son muy intuitivos.

Primer Paso: Web Form Creation Wizard - Step 1

Web form Name: Nombre del formulario (podemos crear mas de un formulario)
Recipients Emails: dirección de correo donde recibiremos los envios de los lectores
Spam Email address: dirección a donde nos enviarán los que ellos consideren spam (puede ser la misma dirección),
Thank you page: dirección de una página donde nos redireccionará al enviar el mensaje (una página de agradecimiento, puede ser la principarl del blog)
Number of fields: cantidad de campos a usar, pueden dejar la opción por defecto.


Segundo paso: Web Form Creation Wizard - Step 2

Donde colocaremos los nombres de esos campos y sus características. Los campos por defecto son:

Your Name: Tu Nombre
Your Email Address: Dirección de EMail
Subject: Asunto
Message: Mensaje

Podemos elegir el tipo de texto, negritas o cursiva. texto largo o corto, conviene dejarlo como está. Y donde dice required es si queremos que los campos sean obligatorios o no.


Tercer paso: Web Form Creation Wizard - Step 3

Definiremos los tamaños de los campos anteriores. Lo mejor es dejarlos como están y una vez obtenido el código e insertado en blogger modificarlo. Cols es columnas y Rows filas.

Cuarto paso: Web Form Creation Wizard - Step 4

Luego en el establemcemos las características estéticas del formulario, es decir fuentes, colores etc. Y algunas opciones mas que podemos dejarlas como están. Pero mas abajo veremos algo muy práctico, los filtros antispam, donde podemos elegir mostrar una imagen con letras y números y también limitar los envios por IP.

Luego en Display Mode marcamos: Web Form will be inside the web page, visitor never leaves the site que nos permite insertar el formulario de contacto como un post mas en blogger.


Quinto paso: Web Form Creation Wizard - Step 5

son opciones avanzadas y podemos dejarlas como están.

Sexto paso: Web Form Creation Wizard - Step 6

Aquí eremos la previsualización del formulario y si nos gusta como quedó hacemos click en Finish. Y nos quedará algo como esto:


Listo, ahora nos queda obtener el código HTML para eso hacemos click en "Get the HTML code." Este código lo copiamos y lo pegamos en un post en nuestro blog al que le pondremos una fecha anterior.

Verlo en funcionamiento en el blog.

A tener en cuentra:

A veces el código no se ve bien en blogger, por lo que conviene pergarlo primero en el blog de notas y desmarcar el Ajuste de línea dentro el menú Formato.

3 comentarios:

Narjes O. dijo...

Muchas gracias por la informacion. Me fue de mucha utilidad, aunque ajuste el formato editando el codigo html aun asi no quedo exacto como yo queria. Desde el titulo hasta el inicio del formulario quedo mucho espacio vacio y no se como eliminarlo. Sin embargo esta funcionando y es lo que importa, ya lo ire acomodando poco a poco.

Anónimo dijo...

a mi me paso lo mismo y nose como arreglarlo me quedo mucho espacio en blanco vacio

Ignacio dijo...

Hola, disculpen la demora, pero estuve desconectado unos días y no podia responder adecuadamente.
El problema es que es una tabla, y debemos eliminar los saltos de línea, es decir, copiar todo en una sola línea, esto lo podemos hacer con el block de notas de Windows. Para esto abrimos el block de notas y desmarcamos Ajuste de línea dentro el menú Formato.
También si se animan con algún editor como el Dreamweaver pueden tener un buen resultado, yo usé ese y pude corregir esos problemas de espacio. Si no lo logran, escríbanme y les paso mi código.

Saludos!!

Ignacio

Publicar un comentario

Muchas Gracias por tu comentario.