CLICK HERE
TO APPLY
ANY JOBS
|
Adding Contact Form In Blogger |
Widget contact form its official version launched by Blogger. But, this contact form only works in the Blogger sidebar. Then, if you have searched several times to discover how to set up a contact form with us or contact us on your blog. Do not worry, this article will easily take you to add Contact Form. UU In blogger As you know, the contact form is very important for any blogger. There are two ways that can be used to add Contact Form In blogger.
Add contact form widget to the Blogger sidebar
Remember that this only works in the Blogger sidebar. Let's move on!
- Log in to your blogger's control panel (which you want to add to the contact form) and go to Layout
- Click on add gadgets
- Choose more gadgets on the left side.
Now, look at your blog, you will see the contact form. You're done. but if you want the Contact Form to appear on a separate page, continue with the following steps below.
Hide contact form in the sidebar
Go to your template to hide this contact form and move it to a separate page.
Click Topic >> Edit Html
Search]]> </ b: skin> and then add the following code just before the previous code
div # ContactForm1 {
screen: none! important;
}
Add contact form to the separate page
1. Go to pages and create a new page.
2. Paste below the Code in the HTML post editor
<div id = "custom_ContactForm1" class = "ContactForm widget">
<div class = "contact-form-widget">
<p> Contact us by filling in the following form. </ p>
<div class = "form">
<form name = "contact-form">
<p> </ p>
First name
<br>
<input type = "text" value = "" size = "30" name = "name" id = "ContactForm1_contact-form-name" class = "contact-form-name">
<p> </ p>
E-mail
<span style = "font-weight: bold;"> * </ span>
<br>
<input type = "text" value = "" size = "30" name = "email" id = "ContactForm1_contact-form-email" class = "contact-form-email">
<p> </ p>
Message
<span style = "font-weight: bold;"> * </ span>
<br>
<textarea rows = "5" name = "email-message" id = "ContactForm1_contact-form-email-message" cols = "25" class = "contact-form-email-message"> </ textarea>
<p> </ p>
<input type = "button" value = "Send" id = "ContactForm1_contact-form-submit" class = "contact-form-button contact-form-button-submit">
<p> </ p>
<div style = "text-align: center; maximum width: 222px; width: 100% ">
<p id = "ContactForm1_contact-form-error-message" class = "contact-form-error-message"> </ p>
<p id = "ContactForm1_contact-form-success-message" class = "contact-form-success-message"> </ p>
</ div>
</ form>
</ div>
</ div>
<div class = "clear"> </ div>
<span class = "widget-item-control">
<span class = "item-control blog-admin">
<a title = "Edit" target = "configContactForm1" onclick = "return _WidgetManager._PopupConfig (document.getElementById (" ContactForm1 ")); "href =" ContactForm1 & action = editWidget & sectionId = sidebar-right-1 "class =" quickedit ">
<img width = "18" height = "18" src = "// img1.blogblog.com/img/icon18_wrench_allbkg.png" alt = "">
</a>
</ span>
</ span>
<div class = "clear"> </ div>
</ div>
3. Now publish your page as a contact page. Well DONE Now Are you ready.
Conclusion: if this article is useful to add the contact form In blogger, be sure to share it through all social networks or leave a comment below.
PLEASE LIKE OUR FACEBOOK PAGE
CLICK HERE
TO APPLY
ANY JOBS