Mostrando entradas con la etiqueta formulario. Mostrar todas las entradas
Mostrando entradas con la etiqueta formulario. Mostrar todas las entradas

16.1.10

Formulario de contacto para Blogger


Crear un formalario de contacto con Emailmeform es sencillo. La única dificultad es que esta web está en inglés. Aquí trataremos de explicar los pasos a seguir:
  1. Debemos crear una cuenta en Emailmeform. Para esto ingresamos en la página. En el formulario de ingreso pulsamos en Signup for Free! y llenamos el formulario con los datos que se exigen.

  2. Una vez registrados ingresamos a nuestra cuenta. En el menú que aparece a la derecha pulsamos en Create a New Form y llenamos el formulario que se nos presenta (los asteriscos indican campos obligatorios), así:

    • Nombre del formulario.
    • Dirección a donde queremos que nos lleguen los mensajes.
    • Dirección a donde deben llegar los mensajes considerados spam.
    • Página de agradecimiento. Aquí debemos colocar una dirección a la que se dirigirán los visitantes, una vez enviado el mensaje. Puede ser, por ejemplo, la página principal del blog, o la de una entrada que creemos agradeciendo la visita y el mensaje.
  3. Número de campos que queremos para nuestro formulario. Podemos dejar los cuatro que están por defecto.

  4. Pulsamos en Next para acceder al siguiente paso.

  5. Introducimos los nombres de los campos, que son los datos que se le piden al visitante que nos envía el mensaje, así:

    • Su nombre
    • Su Email
    • Tema
    • Mensaje
    para cada uno de los campos asignamos la obligatoriedad de ser llenados "Yes" o "No", y el tipo de campo: Short text (una línea), para los tres primeros, y Large text (más de una línea), para el último, que es donde se pone el mensaje.
  6. Accedemos al siguiente paso e introducimos los tamaños de los campos. Podemos dejarlos como están. Una vez probado el formulario podemos editarlo y cambiar estos tamaños.

  7. En el siguiente paso, el cuatro, podemos personalizar la apariencia del formulario, seleccionando el color del texto, fuente y tamaño, el color de fondo, etc. Podemos dejar estas opciones tal y como están; posteriormente podemos editarlas en esta página o en Blogger.

    Al final de esta ventana están los filtros antispam. Ahí podemos elegir mostrar una imagen con letras y números (captcha), limitar los envíos para cada IP, etc.

  8. En el último punto de esta ventana definimos el modo en que usaremos el formulario (Display Mode). Dejamos habilitado: Web Form will be inside the web page, visitor never leaves the site ya que lo insertaremos en nuestro blog, como un post más.

  9. El quinto paso son opciones avanzadas y podemos dejarlas como están.

  10. Accedemos al siguiente paso en donde se nos presentará una vista previa del formulario. Si nos parece bien pulsamos Finish, si no, hacemos los cambios deseados volviendo (Back) a los pasos correspondientes.

  11. Al pulsar Finish se nos presentará la opción para acceder al código.

  12. Como el formulario es una tabla debemos eliminar los saltos de línea. Esto lo conseguimos en DiseñoConfiguraciónFormato: aquí en Convertir saltos de línea ponemos la opción No. Debemos tener cuidado porque al eliminar los saltos de línea tendremos que usar en las entradas la etiqueta <br>, una vez para un salto de línea, y dos veces para un salto de línea y un espacio.

  13. Ya dentro del código podemos hacer los cambios que queramos, para personalizar más nuestro formulario: Colores, tamaños de las celdas, idioma Español en los textos que estén en Inglés, etc.

  14. Del block de notas copiamos el código, lo pegamos en una entrada que creamos en nuestro blog de Blogger y la publicamos.
Índice Formularios
Formulario para valorar Web
Formulario de contacto

14.1.10

Crear un formulario para valorar web


Vamos ca crear un formulario sencillo para colocarlo en nuestra web y así las personas que la visiten la valoren sin dificultad.

El formulario nos sugiere valorar la página con puntaje de 1 a 10, dicha valoración se envía, con el botón de la derecha, al webmaster del sitio.

El ejemplo que desarrollamos sólo funcionará si el visitante tiene configurado el correo electrónico en su ordenador.

La valoración se enviará por correo electrónico. Si un usuario no tiene correo electrónico configurado en su ordenador con el Outlook Express, Netscape Composer, Eudora, o similar, el mensaje no podrá ser enviado.

Puede ocurrir que el mensaje se cree pero no se envíe si no tenemos email, en ese caso lo podremos encontrar en la bandeja de salida del programa de correo.

El código es el siguiente:

<form action="mailto:xxx@tudominio.com" method="post" enctype="text/plain">
   Valora esta web<br>
    <select name="Valoracion">
       <option>1</option>
       <option>2</option>
       <option>3</option>
       <option>4</option>
       <option>5</option>
       <option>6</option>
       <option>7</option>
       <option>8</option>
       <option>9</option>
       <option>10</option>
    </select>
    <input type="submit" value="Enviar">
</form>

Si queremos que el formulario nos quede como se muestra abajo, lo insertamos en esta sencilla tabla:

<table border="0" align="right" bgcolor="#fe5a5a">
<tr>
<td>
Código
</td>
</tr>
</table>


poniéndole el color de fondo que deseemos.

Valora esta web
Podemos copiarlo y pegarlo en una entrada o en un gadget HTML/Javascript, de nuestro blog de Blogger, o en cualquier web, haciendo esta única modificación: La línea resaltada en rojo la reemplazamos por la dirección a donde queremos que nos llegue la valoración.

Índice Formularios
Formulario para valorar Web
Formulario de contacto