lunes, 7 de diciembre de 2009

Formulario de contacto con HTML

En un post vimos cómo hacer un formulario de Acceso o Login. Hoy vamos a ver cómo hacer un formulario de contacto.

1.§ Lo que hacemos es copiar el siguiente código, ya sea en la sidebar (Diseño- Elementos de la página- Añadir un gadget- HTML/Javascript Añadir) o en una entrada (Creación de entradas- Nueva entrada). El código mencionado es el siguiente:

<FORM action="mailto:tucorreo@correo.com" method="post" enctype="text/plain"><TABLE BORDER="0" CELLSPACING="0" CELLPADDING="4" WIDTH="90%"><TR><TD width="30%"><DIV align="right"><B>Name:</B></DIV></TD><TD width="70%"><INPUT type="text" name="name" size="20"></TD></TR><TR><TD><DIV align="right"><B>Email:</B></DIV></TD><TD><INPUT type="text" name="email" size="20"></TD></TR><TR><TD><DIV align="right"><B>Comment:</B></DIV></TD><TD><TEXTAREA name="comment" cols="30" wrap="virtual" rows="4"></TEXTAREA></TD></TR><TR><TD>&nbsp;</TD><TD><INPUT type="submit" name="submit" value="Submit"><INPUT type="reset" name="reset" value="Reset"></TD></TR></TABLE></FORM>


2.§ Cambiamos donde dice tucorreo@correo.com por nuestro correo. Damos click a Guardar o Publicar, dependiendo si lo pegamos en un gadget o en una entrada.

3.§ Este paso no es obligatorio, con los pasos anteriores ya tendremos nuestro formulario de contacto. Este paso es sólo para darle algún estilo al formulario como color de borde, color del botón, etc.

Entonces, personalizarlo, vamos a Diseño/ Edición de HTML, con ayuda de Ctrl+F buscamos ]]></b:skin> y antes de éste, pegamos el siguiente código:

textarea {
background: #F6F4DA;
border: 1px solid #B07C3F;
}

input {
background: #F6F4DA;
border: 1px solid #B07C3F;
margin-right: 5px;
}

Si desemos podemos cambiar los colores. Damos click a guardar y listo.

El resultado será el siguiente:

Nombre:
E-mail:
Mensaje:
 

No hay comentarios:

Publicar un comentario