Un formulaire de contact sur une seule page

25/10/2014

Finie l'utilisation d'un service externe pour ajouter un formulaire de contact sur son blog, il y a maintenant un widget pour ça !
Seul bémol, le widget s'affiche sur toutes les pages du blog, et n'est pas adapté à une utilisation classique.
Vous souhaitez afficher le formulaire de contact uniquement sur une page de votre blog ? Voici comment le faire, en 3 minutes.

Etape 1 : ajouter le widget à votre blog

Dans le menu de Mise en page, ajoutez juste en bas de la zone Articles du blog le widget de formulaire de contact, que vous trouverez dans la section "plus de gadgets".

A ce stade, nous avons un formulaire de contact géré par Blogger, qui fonctionne, et qui s'affiche en bas de toutes les pages. Et ça, c'est plutôt moyen...

Etape 2 : masquer le widget sur toutes les pages

Le widget a été automatiquement nommé par Blogger ContactForm1. Dans le code HTML de votre modèle, juste avant la ligne 

]]></b:skin>

Ajoutez le bloc ci-dessous

#ContactForm1{
display: none;
}

Résumons : on a maintenant un formulaire de contact, mais on ne l'affiche plus du tout sur le blog. Pas exactement ce qu'on souhaite, mais vous verrez qu'on en est proche.

Etape 3 : n'afficher le widget que sur la page de contact

Créez une page Blogger, avec le texte d'introduction de votre choix. Passez au mode d'édition HTML de votre page, et ajoutez le bloc ci-dessous dans votre page :
<style type="text/css">
 #ContactForm1 {
 display: block;
}

#blog-pager, .blog-feeds, .post-footer,  #ContactForm1 .title {
 display: none;
}
</style>
Voilà, le formulaire ne s'affiche que sur cette page (c'est le but de la ligne display:block, et les éléments superflus (pieds de page article, flux, etc. sont masqués sur cette page.
Simple non ?

8 commentaires:

Caftan Marocain 2015 a dit…

Bonne explication bonne continuation

Christophe Guibert a dit…

Bonjour. la première partie fonctionne bien mais le code à coller sur la page de contact ne fait rien apparaitre. Une idée ?

pinguinalité a dit…

Bonjour
oui, c'est sympa de mettre une page "contact" dédiée et en plus facile a réaliser. je vais le faire manu-militari ;)
par contre, tant que je suis la, j'ai une petite question au sujet des balises h
je viens de lire un article très explicite pour changer les h sur un article et ça fonctionne très bien!
malheureusement, je voudrais avoir une h1 différente pour chaque article et non comme en natif une h1 qui soit toujours la même (celle du blog)
une idée?

Joshua deherratt a dit…
Ce commentaire a été supprimé par un administrateur du blog.
Yushi a dit…
Ce commentaire a été supprimé par un administrateur du blog.
Formation Excel a dit…

Merci pour ces infos

Teddy VELAYANDOM a dit…

Génial!!!

admin a dit…



Merci beaucoup pour ce post, après exellent, Votre blog est une mine d'information précieuse. félicitations
: e-bloguer www.e-bloguer.blogspot.com

Enregistrer un commentaire

Contact

Nom

E-mail *

Message *