Ad Code

Responsive Advertisement

Comment ajouter un formulaire de contact Blogger dans une page (code HTML)


Vous pouvez ajouter le formulaire de contact Blogger dans une page de votre site Web Blogger. 
Cela fonctionnera parfaitement et ne cassera rien. Laissez moi vous montrer comment ça marche.

Remarque : Pour ajouter un formulaire de contact à une page, vous devez d'abord ajouter le widget de formulaire de contact à la barre latérale de votre Blogger.

Masquer le formulaire de contact de votre barre latérale

Tout d'abord, nous devons masquer le formulaire de contact par défaut du widget de la barre latérale de votre Blogger. Accédez à votre Tableau de bord > Modèle > Modifier le code HTML . Recherchez et collez ce code juste au dessus de ]]></b:skin> :

#ContactForm1{ display: none !important; }

Enregistrez votre modèle.

Ajouter un formulaire de contact à une page

Maintenant, nous allons ajouter le formulaire de contact à une page statique de votre blog Blogger. Accédez à votre Tableau de bord > Messages , cliquez sur Nouvelle page et sélectionnez Page vierge .

Maintenant, dans votre page vierge, cliquez sur l'option HTML pour passer en mode éditeur HTML. Ajoutez le code suivant et publiez votre page :

<form name='contact-form'> <p></p> Name<br /> <input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' value='' type='text' /> <p></p> Email <span style='font-weight: bolder;'>*</span><br /> <input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' value='' type='text' /> <p></p> Message<span style='font-weight: bolder;'>*</span><br /> <textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea> <p></p> <input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' value='Send' type='submit' /> <p></p> <div style='text-align: center; max-width: 222px; width: 100%'> <p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p> <p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p> </div> </form>

C'est ça! Vous pouvez également personnaliser le formulaire de contact avec un style CSS personnalisé ou jQuery.

Si vous avez trouvé cet article utile, partagez-le avec vos amis 👪👨‍👩‍👦👨‍👩‍👧

Enregistrer un commentaire

0 Commentaires

Ad Code

Responsive Advertisement