Formulario de Contacto para tu Web 1
En esta ocasión les presento una forma sencilla de implementar un formulario para que los visitantes nos envÃen sus comentarios. No hace falta ningún requerimiento especial ni conocimientos avanzados para implementarlo.
Para nuestro formulario de contacto utilizaremos el servicio Kontactr el cual mediante un registro sencillo y sobre todo gratuito nos permitirá obtener un formulario de contacto para nuestro web o blog según sea nuestra necesidad.
Utilizando Kontactr
Una vez registrados en este servicio tendremos las siguientes opciones, Embed Widget – AJAX el cual permite incluir el formulario con validación y envÃo en AJAX, para es necesario copiar un codigo del tipo:
1 2 | <script type="text/javascript"> id = XXXXX; </script> <script type="text/javascript" src="http://kontactr.com/wp.js"></script> |
La segunda forma de utilizar es Embed Widget el cual nos brinda el código html del formulario para incluirlo directamente, el cual es de la forma:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <form method="post" action="http://kontactr.com/euser.php"> <input name="id" type="hidden" value="XXXXX" /> <table cellpadding="10px" border="0" style="font-size: 13px; font-family: Tahoma, Verdana;"> <tr> <td align="right">Your Name : </td> <td><input name="sender_name" type="text" style="width: 250px;" /></td> </tr> <tr> <td align="right">Your Email : </td> <td><input name="sender_email" type="text" style="width: 250px;" /></td> </tr> <tr> <td align="right">Subject : </td> <td><input name="subject" type="text" style="width: 250px;" /></td> </tr> <tr> <td align="right" valign="top">Message : </td> <td><textarea rows="10" cols="40" name="message" style="font-size: 13px; padding: 3px; font-family: Tahoma, Verdana;"></textarea></td> </tr> <tr> <td align="right" valign="middle">Image (case-sensitive): </td> <td><img src="http://kontactr.com/captcha.php" /> <input type="text" name="captcha_code" style="margin-bottom: 10px; font-size: 13px; padding: 3px; font-family: Tahoma, Verdana;" /></td> </tr> <tr> <td colspan="2" align="center"><input name="send" type="submit" id="send" value="Send" style="font-size: 18px; width: 100px; letter-spacing: 5px;" /></td> </tr> </table> </form> |
Podemos observar en este formulario que tenemos los nombres de los campos, los cuales podemos modificarlos para personalizarlos, por ejemplo podrÃamos tener nuestro formulario en español:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | <form method="post" action="http://kontactr.com/euser.php"> <table cellpadding="2px" border="0"> <tr> <td align="right">Nombre: </td> <td><input name="sender_name" type="text" style="width:250px;" /></td> </tr> <tr> <td align="right">Email: </td> <td><input name="sender_email" type="text" style="width:250px;" /></td> </tr> <tr> <td align="right">Asunto: </td> <td><input name="subject" type="text" style="width:250px;" /></td> </tr> <tr> <td align="right" valign="top">Mensaje: </td> <td><textarea rows="10" cols="40" name="message" style="width:250px;"></textarea></td> </tr> <tr> <td align="right" valign="middle">Imagen: </td> <td><img src="http://kontactr.com/captcha.php" /> <input type="text" name="captcha_code" style="margin-bottom: 10px; padding: 3px;" /></td> </tr> <tr> <td align="center">&nbsp;</td> <td><input name="send" type="submit" id="send" value="Send" style="width: 100px;" /> <input name="id" type="hidden" value="XXXXX" /></td> </tr> </table> </form> |
Pueden ver el ejemplo funcionando:
Tags: blog, Blogger, contacto, gratuito, Wordpress
hola mira y esos comentarios donde los puedo leer