Page d'Accueil .:. Contact .:. Livre d'Or .:. Bannières .:. Amis & Partenaires .:. Tops Sites

Insérer un formulaire créé avec i-services


I-Services : Services gratuits et professionnels pour webmasters !



On ne peut pas toujours gérer nos formulaires en php, soit parce qu'on ne peut pas créer une base de données, soit tout simplement parce que ça peut être un peu complexe (bien que loin d'être sorcier quand même !). Personnellement, j'utilise I-Services que je trouve parfait (tant pour le livre d'or que pour l'annuaire, la newsletter etc...). Il suffit d'avoir un compte, d'activer le service "Form2Mail" et de créer le formulaire ("Gérer les formulaires", puis "Ajouter un nouveau formulaire" et remplir les champs). Allez sur "Installez", sélectionnez le formulaire et vous verrez le code nécessaire.



insersion du code html


Copiez/collez cette partie dans votre page html. Vous pouvez personnaliser ce qui est en rouge.
Attention ne copiez pas le code ci-dessous mais celui fourni par I-Services sinon ça ne fonctionnera pas...

<form method="post" action="http://www.i-services.net/membres/formmail/......" enctype="multipart/form-data" style="margin: 0px;">
<input type="hidden" name="_mail_priority" value="Normal" />
<input type="hidden" name="_mail_subject" value="Sujet du mail" />
<input type="hidden" name="_conform_copy" value="" />





Vous allez ensuite insérer ce qui vous convient. I-Services vous propose un modèle sous forme de tableau à 2 colonnes avec dans la 1ère les indications (Votre nom etc...) et dans la 2ème les champs à remplir. C'est un bon moyen pour présenter vos formulaires proprement mais je ne vais pas détailler cette partie du code qui fait appel aux tableaux. Je vais donc adopter un affichage basic avec un double retour à la ligne (<br><br>)

Champs de saisie (texte court)

Votre nom :



Votre nom :<br><br>
<input type="text" size="30" name="nom" value="" />

size="30" : cette valeur correspond à la largeur du champs
name="nom" : si vous mettez "nom", vous verrez dans votre e-mail : "nom : nom que le visiteur a inséré dans le formulaire"

Ensemble de cases à cocher

C'est compliqué ?

Oui   Non

C'est compliqué ?<br><br>
<input type="checkbox" name="compliqué" value="oui" /> Oui
<input type="checkbox" name="compliqué" value="non" /> Non

name="compliqué" : identification de l'ensemble de cases
value="oui/non" : valeur de la réponse : si le visiteur a coché "Oui", vous verrez "compliqué : oui" dans votre e-mail
Oui/Non : texte affiché à côté de la case à cocher

Ensemble de boutons

C'est facile ?

Oui   Non

C'est facile ?<br><br>
<input type="radio" name="facile" value="oui" /> Oui
<input type="radio" name="facile" value="non" /> Non

name="facile" : identification de l'ensemble de cases
value="oui/non" : valeur de la réponse : si le visiteur a coché "Oui", vous verrez "facile : oui" dans votre e-mail
Oui/Non : texte affiché à côté de la case à cocher

Zone de texte (texte long)

Votre message :



Votre message :<br><br>
<textarea rows="4" cols="50" name="message"></textarea>

rows="4" : nombre de lignes
cols="50" : nombre de caractères par ligne
name="message" : vous verrez dans votre e-mail : "message : message que le visiteur a inséré dans le formulaire"

Liste déroulante

Votre animal préféré :



Votre animal préféré :<br><br>
<select name="animal">
<option value="chat">Chat</option>
<option value="chien">Chien</option>
</select>

name="animal" : identification de la liste
value="chat/chien" : vous verrez dans votre e-mail : "animal : chat ou chien"
Chat/Chien : texte affiché dans la liste

Insérez les champs qui vous conviennent sans oublier de remplacer name="..."





Si vous avez activé la sécurité anti-spam, vos visiteurs doivent recopier le code du pyctogramme.

Recopiez le code :





Recopiez le code :<br><br>
<img src="http://www.i-services.net/membres/......" border="0" /><br><br>
<input type="text" name="code_check" size="10" maxlength="5" value="" autocomplete="off" />

Ensuite, vous insérez le bouton d'envoi.



<input type="submit" value="Valider" onclick="javascript:if(this.value != 'Patientez...') { this.value='Patientez...'; } else { return false; }">

Et bien sûr, on n'oublie pas de refermer le formulaire !

</form>



exemple de formulaire


(Pour des raisons évidentes, j'ai désactivé l'envoi du formulaire. Il est donc normal qu'il ne fonctionne pas ici.)

Votre pseudo :


Votre adresse e-mail :


Avez-vous un site ?
Oui Non

Objet de votre message :


Votre message :


Recopiez le code ci-dessous :







code correspondant en html


<form method="post" action="http://www.i-services.net/membres/formmail/......" enctype="multipart/form-data" style="margin: 0px;">
<input type="hidden" name="_mail_priority" value="Normal" />
<input type="hidden" name="_mail_subject" value="Tutoriel formulaire" />
<input type="hidden" name="_conform_copy" value="" />

Votre pseudo :<br>
<input type="text" size="20" name="Pseudo" /><br><br>

Votre adresse e-mail :<br>
<input type="text" size="30" name="Email" /><br><br>

Avez-vous un site ?<br>
<input type="checkbox" name="Site" value="oui" /> Oui
<input type="checkbox" name="Site" value="non" /> Non<br><br>

Objet de votre message :<br>
<select name="Objet">
<option value="suggestion">Une suggestion pour votre site</option>
<option value="commande">Commande personnalisée</option>
<option value="autre">Je vous contacte pour un autre motif</option>
</select><br><br>

Votre message :<br>
<textarea rows="3" cols="40" name="Message"></textarea><br><br>

Recopiez le code ci-dessous :<br>
<img src="http://www.i-services.net/membres/......" border="0" /><br>
<input type="text" name="code_check" size="10" maxlength="5" value="" autocomplete="off" /><br><br>

<input type="submit" value="Valider" onclick="javascript:if(this.value != 'Patientez...') { this.value='Patientez...'; } else { return false; }">

</form>



l'e-mail de réception


Si le visiteur a rempli le formulaire de cette façon :

Votre pseudo : Monsieur X
Votre adresse e-mail : monsieur.x@domaine.com
Avez-vous un site ? Non
Objet de votre message : Je vous contacte pour un autre motif
Votre message : Bonjour !


L'e-mail se présentera comme ça (et le sujet sera "Tutoriel formulaire") :

Pseudo : Monsieur X
Email : monsieur.x@domaine.com
Site : non
Objet : autre
Message : Bonjour !



A vous de jouer !


Un grand merci à l'équipe d'I-Services pour m'avoir autorisée à publier ce tutoriel

I-Services : Services gratuits et professionnels pour webmasters !


.: Pour savoir comment personnaliser un formulaire, cliquez ici ! :.