21 octubre 2013

Cómo poner un formulario de contacto en el blog

A ver, me da vergüenza escribir este post jajaj.

Creo que os voy a contar algun chiste o algo primero para adornarlo un poco jaja. En serio, es la cosa más fácil y rápida del planeta.

La cosa es que he recibido la pregunta varias veces en mi formulario de sugerencia de tutoriales y he pensado que ya era hora de contestarla, que al fin y al cabo el cliente siempre tiene la razón.

¿Qué pasa si en realidad es una tontería? No pasa nada. La cosa es que la tontería hay que saberla, así que yo hoy vengo a contárosla :)

Y es que yo misma probé varias webs de formularios para sitios web antes de decantarme por usar esta opción, porque no todas me gustaban.

Por supuesto hay más y os animo a que busquéis en Google, que es muuuy sabio ;P

El que yo uso tanto en mi blog (el que acabáis de ver del buzón de sugerencia de tutoriales) como en los blogs que diseño es Foxyform.



No necesita tutorial creo pero voy a hacerlo para rellenar jajaj.

Venga va, y además os digo un par de trucos o notas que igual sí os son útiles :)

✎ Entramos en Foxyform

✎ Y en la zona de la derecha, donde dice Sus opciones (paso 1: configuración) elegimos qué casillas queremos que muestre:


Por defecto nos vienen marcadas Apellido e E-mail.

✎ Pero veréis que si pincháis en Mostrar más opciones, podéis elegir otras cosas también. Podéis poner por ejemplo Nombre, E-mail y Asunto por ejemplo.


✎ Además veis que podéis marcar a la derecha si es un campo obligatorio o no.

✎ Entonces pasamos al Paso 2: Personalización. Ahí podéis cambiar los colores, la fuente y el tamaño de la fuente también.

Nota 1: No obstante tenéis que tener en cuenta que NO acepta todos los códigos de color hexadecimales.

Tanto al lado del color de fondo como al lado del color de la fuente, viene un link (entre paréntesis: colores) donde si pincháis os abrirá una ventana con los códigos de color que acepta.


✎ Y ya el paso 3 es meter nuestra dirección de correo electrónico.

Porque lo que pasará es que cada vez que alguien rellena nuestro formulario, automáticamente recibimos un email. No como en Google Docs por ejemplo, que se van a una hoja de cálculo (Google Docs yo lo uso para los sorteos, si necesitáis un tutorial me lo decís)

✎ Escribimos el código captcha anti-spam

✎ Y pinchamos en Crear formulario

✎ Entonces nos sale esto:


✎ Y ya lo único que tenemos que hacer es copiar ese código y pegarlo en nuestra página del blog.

✎ Lo pegáis en la vista HTML, y cuando lo publiquéis, se verá (en la vista Redactar no se ve, veréis que pone foxyform)

Nota 2: por defecto viene un poco estrecho. Fijaos que pone 350 px.


Pues sin más, en la vista HTML una vez de que lo habéis pegado, le ponéis un valor un poco mayor. 500 o lo que queráis.

✎ Y ya lo tenéis (este es una foto, eh)


✎ Como veis es muy sencillo y muy rápido. Lo único es acordarse que este formulario de foxyform está genial y es muy rápido, cómodo y efectivo.

Para que no se os olvide... ¡pineadlo en vuestro tablero de recursos y/o ayuda para el blog!

Mil besos y ya sabéis lo que tenéis que hacer si queréis que escriba sobre algo (ojo, puede ser tutorial o no tutorial, un post sobre cualquier otra cosa)

Muaah,

P.D. Si aún algún o alguna despistada por ahí a  la que le guste mi blog aún no me ha votado para los premios Bitácoras, aún puede hacerlo... 

Participo en la categoría educación y eso, no tengo que explicaros lo que significaría para mi poder entrar en la clasificación.. ;)

¡Cuento con vosotros! 

Podéis votarme pinchando aquí o en la propia imagen :)


98 comentarios:

  1. hola Blanca! es posible hacer lo mismo con los formularios de google?

    ResponderEliminar
    Respuestas
    1. Que yo sepa con los formularios de Google tienes que entrar en su hoja de cálculo para ver lo que la gente ha rellenado. Yo los uso para concursos, pero para un formulario de contacto prefiero que me llegue un email directamente, así me despreocupo.... :)

      Eliminar
  2. Hola,
    pues si que es fácil y rápido.
    Gracias por enseñarnos estas cosas..y ver que las cosas que a simple vista nos parece lo más complicado del mundo, al final no es para tanto!!...eso si, una vez que ves como hace.
    Silvia.

    ResponderEliminar
  3. Hola Blanca,

    yo no sé si es que soy un poco burra o qué :) pero pego el código en la página, en la pestaña HTML, y cuando actualizo la página sólo pone en ella "foxyform", del formulario ni rastro...

    ResponderEliminar
    Respuestas
    1. cuando pongas tu codigo en la pagina de blogger hay una parte que dice html en la barra de herramientas pinchas ahi y listo

      Eliminar
  4. Perdóooon! Era sólo en la vista previa que no salía, en la página de verdad sí que se ve. Gracias! Lo único que no me acaba de gustar es la barra de subir y bajar (scroll) y la protección antispam. Pero de todos modos, muy chulo.

    ResponderEliminar
  5. Hola Blanca.
    Este formulario se podría utilizar para poner en la derecha como un gadget para, por ejemplo, ¿pedir sugerencias? ¿se haría igual?
    Gracias!!

    ResponderEliminar
    Respuestas
    1. Nunca lo he probado. Imagino que sí porque al final es un código en HTML. Dale a añadir gadget en la columna, dile que de HTML y pégalo a ver.

      Y luego nos cuentas... :)

      Gracias! Besito!

      Eliminar
  6. Yo antes usaba también el de Foxyform pero ahora uso la opción que da google. Me parece más cómoda. Foxyform, al no ser en castellano, no me aparecían acentos ni ñ, se cambiaba por unos signos.

    Saludos,
    Bea.

    ResponderEliminar
    Respuestas
    1. Hola Bea!

      El link que yo os he puesto es a Foxyform en castellano. En lugar de foxyform.com es es.foxyform.com

      De este me encanta la comodidad de que me llegue por email automáticamente en lugar de yo tener que entrar en una hoja de cálculo para mirar cuando alguien lo rellena!

      Pero para gustos... ;)

      Gracias por tu aportación!

      Muah!

      Eliminar
  7. Ya hace un tiempo que me hice uno y también usé Foxyform!! Facilito y práctico!

    ResponderEliminar
  8. COMO SE HACE PARA TENERLO COMO TU, PORQUE A MI ME SALE EL FORMULARIO ENTERO, ASI EL CUADRITO, PREFIERO QUE PINCHEN Y SE ABRA O ALGO ASI

    ResponderEliminar
  9. No sé, Blanca. Lo he hecho todo y sólo me sale "foxyform" enlazando a su web...

    ResponderEliminar
    Respuestas
    1. Alba princess, eso es lo que ves en el editor de Blogger. Verás que si le das a Publicar, luego en el blog se ve el formulario completo!

      Un besín

      Eliminar
    2. No, una vez publicado me sale "foxyform", no el formulario. Y lo he copiado y borrado varias veces...

      Eliminar
    3. No, precisamente lo he mirado después de publicarlo y sigue saliendo eso. Incluso lo he borrado y vuelto a poner varias veces y nada...

      Eliminar
    4. Creo que se lo que te pasa, porque me pasaba a mi hasta que di con ello.
      Cuando le das a página nueva y después a página en blanco te sale como para escribir una entrada, no? Pues arriba a la izquierda te pone redactar y html. Probablemente le tengas puesto en redactar, y le tienes que dar a html. Después pegas el lo del formulario y le das a publicar. Tienes que tener en cuenta que a la derecha en opciones en modo de redacción tengas puesto interpretar html escrito.

      Espero que ahota se te haya solucionado. Un saludo

      Eliminar
  10. Blanquis yo ya lo tenía puesto, pero con otro, y este me gusta más, me parece mas completo, así que ya me lo he instalado!
    Gracias por tu tutorial, que aunque parezca una tontería, va muy bien!
    Un besazo!

    ResponderEliminar
  11. Que sencillo parece!
    Gracias!
    Un beso,
    Nika
    http://eldenika.blogspot.com

    ResponderEliminar
  12. Gracias por el tuto, aunque parezca una tonteria yo ya lo he hecho y me ha sido muy útil porque antes tenia puesto el email sin mas y esto como que tiene mas presencia ^^

    ResponderEliminar
  13. Cómo más molaaa!! Me lo apunto! Yo solo había utilizado el de google que te sale en una hoja de cáculo en drive.. pero este tiene buena pinta! Gracias mil Blanca! Eres un soleteee!!

    Nuestro blog: Con la realidad en los talones

    Feliz comienzo de semana! :D

    ResponderEliminar
  14. Como soy un poco friki (¿para qué negarlo?) me hice mi propio script para el formulario de contacto, que me permite hacer las modificaciones que yo quiera.
    Claro que yo me he escrito casi todos mis scripts. ¡Menuda rarita!

    ResponderEliminar
  15. Muchas gracias!! Ya lo he instalado, ahora la sección de ponerse en contacto conmigo está más profesional. Quizás así reciba mensajes jeje
    Besos

    ResponderEliminar
  16. Pues yo no se lo útil que puede resultar, yo tengo puesto simplemente el e-mail, ¿Creéis que es necesario un formulario? Si es así lo pondré¡

    ResponderEliminar
  17. Muchas gracias Blanca, me ha encantado. Un beso guapa.

    ResponderEliminar
  18. jo.. está genial!!!! es que asi es mas facil que contacte con una.

    Yo tengo una duda: desde hace un par de años parece que tengo un problema y es que no me llegan todos los comentarios que publican al correo. Llegan los que quieren. He probado cambiando a ventana emergente, sin ella... pero sigue igual. No sé si es un problema de blogger o del correo, aunque me da que es de blogger, porque los correos normales si llegan. A qué puede ser debido?

    ResponderEliminar
  19. jo.. está genial!!! que asi es mucho mas comodo para contactar.

    Tengo una duda. Desde hace bastante, un par de años, no me llegan todos los comentarios que dejan al correo, llegan los que quieren. Unos si, otros no y no sé el motivo. He cambiado a comentar con ventana emergente, sin ella... pero nada. Imagino que será un problema de blogger, porque los correos normales si llegan perfectamente. Sabes como puedo solucionarlo?
    Y referente al post que has escrito.. pues es que ya no me fiaria de que llegaran tambien todos los correos del formulario. Podria darme problemas?

    Gracias!!!

    ResponderEliminar
  20. Aunque parezca una tontería de entrada, no sabes de cuánto me ha servido xDDD Es cierto, llevaba mucho haciéndome esta pregunta ^^

    ¡Un beso!
    HTR.

    ResponderEliminar
  21. Otra mejora para mi blog: http://lasmilyunanubes.blogspot.com.es/

    Gracias Blanca

    ResponderEliminar
  22. :O en un rato pruebo! A ver si me sale que aquí leyendo se ve muy fácil....
    Gracias!!! *

    ResponderEliminar
  23. Me parece muy interesante, seguramente lo incluya en el blog en un futuro no muy lejano ;)

    Muack!

    Amparo
    You Are The One

    ResponderEliminar
  24. Yo estoy planificando un sorteito y he usado el Google Docs, es bastante intuitivo. Y ahí lo tengo preparadito, peeroooo lo que me da miedo es el sorteo, llevo unos días leyendo comentarios por blogs y no quiero meter la pata.... ainsss

    ResponderEliminar
  25. COMO SE PUEDE AÑADIR ENTRADAS YA EXISTENTES EN LAS PESTAÑAS NUEVAS CREADAS?
    ME ESTÁ SIENDO IMPOSIBLE!
    OJALÁ PUEDAS HACER UN TUTORIAL!

    GRACIAS POR TODO!

    ResponderEliminar
  26. ¡Gracias Blanca! Aunque sea fácil, es muy útil :)
    Besos.

    ResponderEliminar
  27. Hola Blanca! Aunque es la primera vez que te escribo, la verdad es que te leo hace mucho tiempo. Con tu blog he aprendido a hacer millones de cosas. Muchas gracias y por supuesto que te voto en Bitácoras! Mucha suerte compañera! :-D

    ResponderEliminar
    Respuestas
    1. Hola Lola!

      Mil gracias por tu comentario y por tu voto!

      Y anímate a comentar más cuando tengas un minutín, que me hace ilu! Así sé que hay gente al otro lado... ;(

      Un besote!

      B.

      Eliminar
  28. Gracias por el post, casualmente estaba pensando en poner un formulario de contacto. Poco a poco voy actualizando mi blog y muchos de tus post me han ayudado! Por eso darte de nuevo las gracias por ayudar ;D un beso

    http://sonia-sonamoda.blogspot.com.es/

    ResponderEliminar
  29. Muchas gracias Blanca, como siempre, todo es genial, muy interesante. Aunque sea sencillo yo no sabía ponerlo, así que te lo agradezco un montón. Que pases una buena semana. Un besico.

    ResponderEliminar
  30. El post está genial, Blanca. Muchas gracias. Pero no consigo que me funcione. Justo hoy acabo de hacer mi primer sorteo en el blog, y lo queria usar, pero al final lo he tenido que quitar. Aun despues de publicar el post, lo único que se veía era el link a foxiform.

    ResponderEliminar
  31. Hola Blanca, millones de gracias por este post, es más, puedes ver tu misma el resultado porque me acabo de crear mi formulario para mi blog y me encanta el resultado

    http://natalialuzentupelo.blogspot.com.es/

    Te sigo desde ya¡ y gracias por todos tus buenos consejos
    natalia

    ResponderEliminar
  32. Blanch!! Eres una crack!! Qué fáciles nos haces las cosas. Yo ya he puesto mi formulario. Mil gracias!!
    Ya te voté para el premio Bitácoras, pero te puedo votar más veces y así ganas más votos? Porque si se puede, te voto todos los días!!
    Un beso enorme!!
    Arantxa

    ResponderEliminar
  33. Yo también lo uso y de momento todos los mensajes llegan bien

    Saludos!

    ResponderEliminar
  34. Pues que no te de vergüenza porque es sùper útil para novatas, que al fin y al cabo somos las que más acudimos por aquí (creo! o se supone! jaja).

    ResponderEliminar
  35. Lo he conseguido en mi nuevo blog, mil gracias fácil y muy bien explicado. Me quedaré por aquí, seguro que aprendo muchas cosas para mi blog. Un saludo

    ResponderEliminar
  36. Nada, Blanca, que no me funciona... lo he vuelto a intentar hoy y nada... Ayns!

    ResponderEliminar
  37. Acabo de descubrir tu blog y no veas que bien, llevaba tiempo intentando saber como hacer ciertas cosas para el mío (sólo lleva 2 meses y poco).
    Muchas gracias!!

    ResponderEliminar
  38. Está fenomenal el tutorial, acabo de cambiar el que tenía por este. Que me gusta más.

    ResponderEliminar
  39. ¡Hola! Está genial el blog, muy útil :D
    ¿Sabrías indicarme cómo puedo quitar ese scroll tan molesto que aparece? He visto que a ti no te sale, y estoy volviéndome loca buscando la forma de quitarlo y nada :(
    ¿Podrías indicármelo? Te lo agradezco mucho :)

    ResponderEliminar
  40. hola hay alguna forma que despues de llenar el formulario este se publique en el mismo blogg instantaneamente??

    ResponderEliminar
  41. hola hay alguna forma de publicar un formulario automaticamente despues de llenar el blogg en el mismo blogg????

    ResponderEliminar
  42. Hola! muchas gracias por el tutorial! me ha venido de lujo! Te invito a verlo

    http://telatelitamarinera.blogspot.com.es/2013/11/fundas-para-moviles.html

    ResponderEliminar
  43. gracias por el tutorial!

    Mi blog: www.etiquetasdepapel.com

    ResponderEliminar
  44. Buenos días!! Que alegria encontrar un blog tan completo y especial, estoy intentando poner al dia mi nuevo y pequeño blog y me gustaria implantar el formulario de contacto, pero al añadir en HTML mi codigo no me sale. La unica opcion que encuentro de editar en HTML es en plantilla y no sale luego el formulario.... algo no hago bien!! alguien que me pueda ayudar??? Thank You!!

    ResponderEliminar
  45. Muchas gracias! Me ha sido de gran ayuda!!!!! Muuuacc

    ResponderEliminar
  46. Gracias por la ayuda, es sumamente rápido y fácil. <3

    ResponderEliminar
  47. Hola! Lo primero que quería decirte es que ¡me encanta tu blog! Pues gracias a tus consejos y las cositas que nos cuentas, el podido mejorar el mío! Asique muchísimas gracias! Y quería aprovechar tambien para comentarte que me ha sido imposible poner el formulario como indicas en este post. Tal vez el error haya sido mío al ponerlo. En que parte debo hacerlo? "Plantilla, Editar HTML?? Gracias, espero que puedas contestarme! Bss

    ResponderEliminar
  48. Hola Blanca! Hay alguna manera de quitar la firma de foxyform? Gracias de antemano :)

    ResponderEliminar
  49. Genial, a la primera. Gracias por compartir tus conocimientos con los que realmente lo necesitamos. besos

    ResponderEliminar
  50. Gracias, pues aunque digas que es muy fácil, yo no tenía ni idea de como se hacia, y no quería poner esas imágenes o banners o como se llamen, de contacto.
    Gracias

    ResponderEliminar
  51. Muchas gracias!! :) ha sido útil, un saludo!

    ResponderEliminar
  52. Muchas gracias, ha salido realmente fácil y útil. Un besazo! :)

    ResponderEliminar
  53. muchas gracias! ha sido muy practico! y facilito :)

    ResponderEliminar
  54. Me encanta tu blog!

    Una pregunta: ¿ puedes enviar boletines de correo con foxyform o solamente te permite formar tus listas de contacto?
    Yo utilizo http://www.sendinblue.com/ para crear ambas formas y enviar mis boletines

    Saludos!!

    ResponderEliminar
  55. Es bueno, pero no no funciona para varios destinatarios :/

    ResponderEliminar
  56. mE HA SIDO DE MUCHA AYUDA!! Mil gracias.

    Cómo se pone el botoncito para que te sigan en facebook?
    besos!

    ResponderEliminar
  57. Yo tengo una duda, lo siento pero alguien me puede decir que es el código captcha anti-spam? soy nuevita en esto jeje Gracias!!!

    ResponderEliminar
  58. lo siento soy nuevita en esto, alguien me podria decir que es el código captcha anti-spam? Gracias a todas!

    ResponderEliminar
  59. Muchas, pero muchas gracias Blanca por tus tutoriales, desde que descubri tu blog configurar el mio es mucho mas facil! besoss :*

    ResponderEliminar
  60. Un tutorial de lo más útil y sencillo, gracias :)

    ResponderEliminar
  61. Muchas gracias Blanca por el tutorial, ya lo he instalado.
    Solo comentarte una cosita, no tiene la opción de adjuntar imágenes ¿verdad?

    ResponderEliminar
  62. El formulario me sale con la barra de desplazamiento en el costado.... se puede solucionar eso?

    ResponderEliminar
  63. nose qué pasa pero el mio no funciona .. probe de escribir con otra cuente en el formulario pero no me deja

    ResponderEliminar
  64. Un tutorial fantástico, como siempre. Llevo 3 años con el blog y aun no había puesto un formulario de contacto. Solo una cosa: Aunque me muestra el formulario completo, me sale una barra desplazadora a la derecha del mismo. ¿Se puede quitar? Es que no encuentro la manera.

    Un saludo.

    ResponderEliminar
  65. Muchas gracias por el dato! Ya lo uso en mi Blog, el de Bogger es una basura XD

    ResponderEliminar
  66. Buenas tardes... Lo he utilizado en mi blog añadiendolo como una pagina nueva, se agrega correctamente pero sale una parte de comentarios despues del formulario.. eso deberia pasar???

    ResponderEliminar
  67. Añadiendo más cositas al blog gracias a tus consejos. Formulario conseguido:
    http://www.radiantedeexito.com/p/contacto.html

    Lo que nos gustaría sería quitar la barra de scroll, por aquí lo han preguntado también pero no visto respuesta ni forma de quitarlo. Nos ayudas?
    Mil gracias Blanca!

    ResponderEliminar
  68. ¡Muchas gracias! Me ha servido de maravilla.

    ResponderEliminar
  69. Muchas gracias por esta entrada! Es justo lo que estaba buscando :-) Y ya he agregado el formulario a mi blogcito.
    Besitos

    ResponderEliminar
  70. Muchas gracias, acabo de hacerlo y me ha salido a la primera. Un blog insuperable que ayuda a mucha gente como yo que queremos tener un blog arregladito y a la última. Felicidades.

    ResponderEliminar
  71. Amo lo que publicas, como lo haces, como es tu blog, es muy femenino, hermoso y muy uti...
    Tengo tu blog anclado en mi google chrome por si tengo algún problema acudo a ti...

    ResponderEliminar
  72. en que parte veo los resultados del formulario?

    ResponderEliminar
  73. hola Blanca. sigo los pasos y me aparece este texto en vez del formulario: "Diese Präsenz ist derzeit nicht verfügbar"

    ResponderEliminar
  74. Enhorabuena por tu blog. Lo he podido hacer, pero a la hora de ponerlo en una página estática, me aparece una barra lateral para bajar. (lo que es el formulario) Hay alguna manera de modificar esto?
    Gracias

    ResponderEliminar
  75. Genial!! lo acabo de instalar y a la primera, gracias, Blanca!!!

    ResponderEliminar
  76. Acabo de descubrir tu blog, y exactamente lo que estaba buscando :) mil gracias por ayudarnos. me tendras por aqui muy seguido este es mi blog http://mujeresproposito.blogspot.com/
    Gracias !!!

    ResponderEliminar
  77. Mira que hace tiempo que quería hacer esto....

    Gracias Blanca! :)

    ResponderEliminar
  78. Muchísimas gracias Blanca, mi Blog se ve mas profesional, gracias a consejos de Bloggers como tu :)

    ResponderEliminar
  79. Muchas gracias Blanca, me funcionó de maravilla.

    ResponderEliminar
  80. Genial Blanca!
    Graciasssssss
    Un saludo
    Carmen

    ResponderEliminar
  81. felicidades por tu blog. probé el formulario y me fue genial. gracias

    ResponderEliminar

Lo tengo que reconocer: soy como una niña.

¡Y muero de felicidad con cada comentario que recibo! Me hacen tanta ilusión o más incluso que el primer día, y leo todos y cada uno de ellos SIEMPRE.

Sin embargo y aunque en general suelen ser bienvenidos todos los comentarios y todas las opiniones, me reservo el derecho de no publicar aquellos que me parezcan malintencionados o cuyo único fin sea la autopromoción. Así como aquellos que contengan direcciones de email para prevenir que os llegue Spam.

Por cierto, si no ves tu comentario al publicarlo es porque al tener que esperar a moderación, a veces tardan un poco en ser publicados.

Besos y ¡gracias de nuevo!

Blanca