lunes, 9 de julio de 2012

CÓMO AÑADIR UN FORMULARIO DE CONTACTO

En este tutorial voy a indicar cómo añadir un formulario de contacto a nuestro blog utilizando las herramientas que proporciona Google docs. Una vez más es necesario que estemos dentro de la cuenta de blogger asociada al blog. Utilizaré más adelante la pestaña que generé en el anterior tutorial, que será donde incluya el formulario.

En primer lugar, para hacer el formulario hay que ir a nuestra cuenta de correo y hacer clic en Docs, ver Figura 1.

Figura 1
Hacemos clic en CREAR y dentro del desplegable seleccionamos formulario (Figura 2).

Figura 2
En la ventana de formulario que aparece debemos rellenar los campos, título de formulario algún comentario y lo que se quiere pedir (Figura 3). Es importante marcar la casilla de obligatorio en los campos críticos, que serán los que pongamos inicialmente, nombre, e-mail y el comentario, (se pueden poner los que se deseen).

Figura 3
En la Figura 4 ya hemos introducido los tres campos que queríamos haciendo uso de la duplicación de campos que se ve en la Figura 3 a la derecha. No hay que olvidarse finalmente de hacer clic en Guardar.

Figura 4

Con la operación de guardar se habrá creado una hoja de cálculo (Figura 5) en nuestra página de Docs que vimos al principio, con el nombre del título que hemos dado al formulario (en este caso "Para contactar").

Figura 5
Si hacemos clic en "Para contactar", obtendremos el documento de la Figura 6.

Figura 6
Se ven los campos que hemos puesto en el formulario junto con una marca temporal que indicará la fecha y la hora en que nos pusieron un comentario. Cuando alguien realice un comentario utilizando el formulario, la tabla de la Figura 6 aparecerá con todos los datos.

Hemos creado el formulario, ¿cómo hacemos que aparezca en el blog?. Volveremos a la página de la Figura 4 (conviene que las sucesivas pantallas que abramos no las cerremos, para poder hacer cambios y modificaciones) y hacemos clic en Más acciones y seleccionamos insertar, aparecerá en un cuadro de diálogo un código, lo copiamos (CTRL-C).

Iremos al blog y en la pestaña CONTACTO editaremos la entrada (ver Figura 2 de esta entrada), seleccionamos la pestaña de HTML y pegamos el código copiado (CTRL-V). En ese código cambiamos el valor de width a 550 (está puesto a 770 o similar). Guardamos lo que hemos hecho, hacemos clic en la pestaña CONTACTO y obtenemos el resultado deseado (Figura 7).

Figura 7

No hay comentarios: