Pubblicato il 01/08/10 - aggiornato il  | 29 commenti :

Come creare una pagina di contatto, un sondaggio o un qualunque modulo con 123 Contact Form.

Per creare una pagina del blog come tramite con i lettori si può usare una pagina statica e incollare il codice prelevato dal servizio Response-O-Matic. Voglio adesso illustrare un'alternativa che mi sembra complessivamente migliore e che anch'io ho inserito nel mio modulo di contatto.

123 Contact Form permette infatti non solo di creare dei moduli per l'invio di messaggi ma riesce anche a gestire dei sondaggi, moduli per la vendita di prodotti, ecc; c'è solo il limite dettato dalla fantasia.

Dopo una rapida e gratuita registrazione si va New Form per creare il nostro modulo che comunque può essere sempre modificato in seguito andando su My Form. L'opzione gratuita permette di creare cinque moduli che comunque sono ampiamente sufficienti per le esigenze di un blog, senza contare che possiamo anche creare un secondo account.

123-contact-form

Si riempiono i campi del servizio che concernono tra l'altro in

  1. Nome del modulo
  2. Indirizzo email collegato
  3. Testo da visualizzare dopo l'invio del messaggio
  4. La famiglia di caratteri da usare (Verdana, Trebuchet, Arial, ecc)
  5. Il colore del testo
  6. Il colore di background
  7. L'inserimento di una Captcha per il controllo visivo
  8. Il risponditore automatico che può essere personalizzato solo per chi ha un account a pagamento 
  9. L'inserimento di un limite massimo di un solo messaggio al giorno per ogni IP
  10. L'opzione se inserire il modulo in una pagina web o in una finestra separata
  11. L'inserimento di fogli di stile (CSS) per la personalizzazione del modulo
  12. Il testo da mostrare nel bottone di invio
  13. La dimensione dei caratteri (da 1 a 5)

modulo di contatto

Dopo tutte queste personalizzazioni in fondo alla pagina si clicca su Save Form. Si aprirà una nuova finestra in cui dovremo inserire i campi che ci servono

123-contact-form-modulo

Si possono variare i nomi di default presenti sostituendoli con quelli italiani semplicemente cliccandoci sopra; è possibile indicare un campo come obbligatorio scegliendo Yes o come facoltativo andando su No. Per aggiungere un altro campo si clicca in basso su Add. Si può andare direttamente su Save o in basso su Next. In questo caso sarà possibile aggiungere anche la personalizzazione dei colori di sfondo del modulo. In ogni caso dopo occorre ritornare indietro per salvare il modulo, andare su Preview per l'anteprima e su Get HTML code per acquisire il codice

modulo-di-contatto-123-contact-formNella finestra successiva possiamo addirittura impostare delle opzione di crittografia. Per Blogger si va su Option 2a e si copia il codice HTML 

codice-html-concat-form

Si crea una pagina statica per il modulo di contatto, si va su Modifica HTML e si incolla il codice, quindi si pubblica

modulo-di-contatto-html

Per sicurezza prima di pubblicare si può andare su Scrivi per dare una controllata. Per moduli di altro genere ricordo che per ogni voce inserita possiamo scegliere tra Testo, Textarea, Checkbox, Radio, Lista a discesa (Dropdown list) e Extra info.



29 commenti :

  1. Grazie infinite per le tue guide.
    Ho inserito questo bel modulo di contatto nel mio blog, solo che, sarà l'ora tarda, sarà che ho litigato anni fa con l'html e ancora non ci parliamo, ma ho un problema.
    Vorrei eliminare quella inguardabile tabella che porta dietro di sè questo form.

    Tu ce l'hai fatta.. :)
    Aiuti anche me?

    RispondiElimina
  2. @Sarù
    A me il tuo modulo pare molto carino, hai anche inserito il logo e il controllo visivo!
    Il problema è che hai scelto di visualizzare il modulo nel sito del servizio e non nel tuo blog.
    Devi selezionare l'opzione di vedere il modulo in una pagina web e quindi copiare il codice in un post o in una pagina statica.
    Personalmente ho anche eliminato il collegamento alla homepage del sito e i due tag center e /center per avere un allineamento a sinistra. Spero di esserti stato di aiuto,
    Ciao

    RispondiElimina
  3. Wow, che velocità nel rispondermi!
    Grazie!


    Nella pagina statica, il modulo contatti, proprio non veniva bene. C'era una sorta di tabella intorno ai campi. Togliendo <table cellspadding="4=> rendevo incliccabile i primi 3 campi.

    Dopo averti scritto il commento, ho fatto altre prove.

    Alla fine ho optato per l'iconcina cliccabile. Credo sia l'unico modo per avere aggratise ;) il logo e i colori personalizzati!
    Ho utilizzando un'immagine giù presente su internet e ho cambiato l'indirizzo racchiuso tra <a href=ecc..ecc.> con quello scritto all'inizio dell'opzione 1a.

    Ma sicuramente lo sapevi già :D
    Pensi possa essere un problema una pagina sul loro server?

    RispondiElimina
  4. @sarù
    finché il servizio non fallisce non ci sono problemi. Se dovesse fallire ti rivolgi a Response-O-Matic :-)...

    RispondiElimina
  5. ciao come posso inserire sul mio blog il form che hai sull'home page in basso a destra cioe:"ISCRIVITI ALLA NEWSLETTER"
    grazie in anticipo

    RispondiElimina
  6. @Amministratore
    Leggiti questo post generico su FeedBurner
    http://www.ideepercomputeredinternet.com/2010/11/come-iscrivere-il-blog-su-feedburner-e.html
    In quest'altro post, nella scheda Publicize > Email Subscription, ci sono le istruzioni
    http://www.ideepercomputeredinternet.com/2008/09/feeburner-come-iscriversi-le-sue.html
    Ciao

    RispondiElimina
  7. ok l'avevo già fatto volevo solo togliere una scritta e lasciarlo pulito come il tuo cmq lo fatto grazie

    ora vorrei creare una pagina "mioblog.blogspot.com/contatti" e all'interno mettere solo il form di contatto (già in mio possesso), come si crea la pagina??

    RispondiElimina
  8. @Amministratore
    Pubblichi una pagina statica con il codice del form.
    Puoi personalizzare l'aspetto della pagina statica
    http://www.ideepercomputeredinternet.com/2010/01/come-non-visualizzare-la-sidebar-nelle.html

    RispondiElimina
  9. ciao parsifal a proposito di form di contatti volevo segnalarti questo sito http://wufoo.com/ permette di crearli in maniera intuitiva e semplice...ecco il risultato sul mio blog http://marcoparrilla.blogspot.com/p/contatti.html

    che ne pensi???

    RispondiElimina
  10. Ho trovato uno veramente geniale: http://www.jotform.com/

    RispondiElimina
  11. Ciao parsifal,ti chiedevo se c'è la possibilità di inserire questo modulo dei commenti in automatico sotto i miei post.perchè molte persone si lamentano di non riuscire a inserire il nome per postare i commenti in blogger.Ciao anna

    RispondiElimina
  12. @Anna
    Si può fare. Dopo aver acquisito il codice da 123Contact Form, vai su Design > Modifica HTML e salva il modello completo. Poi metta la spunta a espandi modelli widget e cerca la riga
    <data:post.body/>
    Questa riga rappresenta la fine del post. Sotto di essa puoi incollare questo codice

    <b:if cond='data:blog.pageType == &quot;item&quot;'>

    Codice di 123 Contact Form convertito in XML con l'utilizzo di questo strumento http://blogcrowds.com/resources/parse_html.php

    </b:if>

    Potrebbe funzionare anche senza la conversione in XML ma non è detto. Con questo codice il modulo dei contatti sarà visibile alla fine di tutti i post.
    Ciao

    RispondiElimina
  13. Grazie Parsifal,anche perchè stava cominciando a diventare un problemi.Molti commentano su facebook e non sul blog.Appena l'ho provato ti mando il lik così ci dai un'occhio.Grazie di cuore

    RispondiElimina
  14. Ciao parsifal,è tutta mattina che provo,ma purtroppo quando apro il sito 123 per creare il mio modulo,mi dice che devo aggiornare il browser.allora ho provato nel sito http://www.jotform.com,che ti ha inviato una persona nei commenti in alto;creato,incollato,ma con alcuni problemi:non sò che fine fanno i commenti,e in più rimane sempre anche il posta commenti di blogger.Io vorrei che i commenti si vedessero subito.ma nulla...Va bhè non importa.Ciaooo

    RispondiElimina
  15. grazie mille! l'ho messo in una pagina adatta. Che te ne pare? http://dituttoedipiu-erika.blogspot.com/p/contattami.html

    RispondiElimina
  16. grazie! se non ci fossi tu il mio sito sarebbe spazzatura!

    RispondiElimina
  17. @erika99lali
    Ottimo lavoro con la pagina dei contatti. Io metto solo a disposizione dei lettori un po' di esperienza che mi deriva da 4 anni di blogging ^^

    RispondiElimina
  18. solo per segnalare che response-o-matic mi ha bruciato 3 mail e solo per caso ricevendone una quinta mi sono loggato sul sito e ho constatato che avevo 3 messaggi non recapitati e quindi non letti
    non erano contrassegnati spam e quindi regolari
    il perchè non saprei proprio forse tu puoi dirci qualcosa sul perchè mi è stato recapitato il primo e poi il quinto tralasciando 2-3-4 ??? boh!!

    RispondiElimina
  19. Questo commento è stato eliminato dall'autore.

    RispondiElimina
  20. però è un bel guaio se ci affidiamo al form della posta e questi poi la tiene a casa come certi postini .. ;-))
    :((

    RispondiElimina
  21. @Tex Willer
    Io uso 123Contact è per il momento non mi ha mai dato problemi, speriamo bene ...

    RispondiElimina
  22. Ma sembra che 123Contact non sia più gratuito.
    Vado sul sito e poi dopo "Iscriviti gratis"
    compaiono tre offerte a pagamento !
    Dove ho sbagliato ?

    RispondiElimina
  23. Ciao vorrei sapere una cosa, io ho inserito il contact 123, nel mio blog, pensando di fare una cosa simile a ebay, con i feeback per intenderci, purtroppo però dopo che le persone commentano non appare nella pagina, come mai?

    RispondiElimina
    Risposte
    1. @ Cheryl Kristine
      123 Contact Form serve solo per i contatti email e non lascia nulla sul blog

      Elimina
  24. È possibile inserire il modulo ottenuto nelle dinamiche. Grazie, so di essere un tuo tormento su questo tema . ;)

    RispondiElimina
  25. È possibile inserire il modulo ottenuto nelle dinamiche. Grazie, so di essere un tuo tormento su questo tema . ;)

    RispondiElimina
    Risposte
    1. Il sito di cui hai incollato l'URL c'è riuscito quindi è possibile. Segui questo tutorial
      http://www.ideepercomputeredinternet.com/2012/05/come-creare-un-modulo-di-contatto-con.html
      e incolla il codice nell'HTML di una pagina statica
      @#

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy