|
CURSO COMPLETO DE DREAMWEAVER 8
--MEDIOS--
04 - FORMULARIO DE CONTACTO
FORMULARIO SIMPLE - FORMULARIO DE CONTACTO
Un formulario, permite interactuar con los usuarios que visitan nuestro sitio.
Un formulario consta de tres partes:
-El código HTML, con la etiqueta form, abarcando todo el formulario.
-Secuencias de comandos CGI (Common Gateway Interface), una aplicación que se ejecuta en el servidor y que procesa la información enviada por el usuario.
-Elementos del formulario, así como campos de texto, casillas de verificación, listas, etc...
En este tutorial vamos a hacer un formulario simple de contacto.
Lo haremos a través de la barra de Insertar > Formulario
Lo primero que debemos hacer es abrir nuestro formulario, para ello, damos click en el botón de formulario
Vamos a configurar, la forma en que procesará los datos nuestro formulario, esto lo hacemos seleccionando nuestro formulario y en la paleta de propiedades configuramos a nuestro gusto:
Nombre del formulario: Daremos un nombre que distinga nuestro formulario.
Acción: Especificaremos la ruta de una secuencia de comandos de cgi, por ej: http://www.misitioweb.es/cgi-bin/porcess.cgi o bien podemos especificar una dirección de correo electronico para recibir directamente los datos, sin necesidad de utilizar una secuencia de comandos. En nuestro caso esto es lo que vamos a hacer, ya que para usar el CGI debemos solicitarlo en nuestro hosting.
Metodo: Podemos elegir entre tres métodos:
- POST: Para enviar los datos de nuestro formulario en el cuerpo del mensaje, este es el más recomendado y el que vamos a usar en este caso.
- GET: Para adjuntar los valores del formulario al URL y enviar la información al servidor, no está recomendado para formularios largos, ya que tiene las URLS estan limitadas a 8.192 caracteres.
- PREDETERMINADO: Para enviar el formulario con la opción predeterminada del navegador, que suele ser Get.
Para empezar a trabajar en nuestro formulario, situaremos el cursor, dentro del mismo:
Vamos a crear un campo de texto, para que los usuarios ponga su nombre y apellidos, damos click en el botón de campo de texto:
Y se nos abrirá esta ventana:
En etiqueta pondremos el título que le vayamos a dar a nuestro campo de texto, yo pongo Nombre y apellidos, pero puedes poner lo que necesites. Y modificamos si creemos conveniente, la posición que tendrá nuestro título, es decir o delante o detrás del campo de texto. Aceptamos.
Ahora seleccionamos el campo de texto que acabamos de crear y nos vamos a propiedades:
Cambiaremos textfield por algo identificativo, yo por ej. puse nombre.
Ancho car: Indica el tamaño del ancho del texto en carácteres.
Car max: Si especificamos un numero, ese será el máximo de carácteres permitidos para el usuario, al rellenar el área de texto.
Tipo: Puede ser de una sola línea, varias líneas, o una contraseña, en este ultimo caso, se mostraria como asteriscos.
Val inicial: Define un valor inicial a nuestro campo de texto, que sirbe como referencia al usuario, por ej, en nuestro caso, podriamos poner Nombre, Apellidos aunque yo en mi caso lo voy a dejar en blanco.
Del mismo modo vamos a crear los campos: E-mail ,Telefono y Asunto
Creamos un último campo de texto, "Mensaje" Pero este si que lo vamos a hacer, con Varias Lineas, para que nuestros usuarios puedan escribir su texto en él.
Lo configuraremos así:
Ahora vamos a crear el boton de Enviar:
Esta vez no vamos a rellenar el campo de Etiqueta.
Seleccionamos el botón y configuramos así:
Ahora creamos otro botón, que reincializará el formulario a cero, esta vez, le damos los siguientes valores:
Nos falta un último detalle, pero muy importante en el caso de que nuestro formulario funcione via e-mail, es para que podamos visualizarlo en nuestro programa de correo electrónico.
Debemos insertar un código:
en la etiqueta de form:
Y ya tenemos nuestro formulario de contacto, sencillito ¿verdad? En los próximos tutoriales veremos muchas otras opciones de nuestros formularios.
subir
Ir al menú de tutoriales de DREAMWEAVER
Todos los tutoriales son de mi completa autoría,
cualquier parecido con otros, es pura coincidencia.
Queda totalmente prohibida su reproduccion, total o parcial.
Si quieres enlazar mis tutoriales, no hay problema,
solo mandame un e-mail, para comunicarmelo.
Cualquier duda o sugerencia:
Tutoriales registrados
|
