are Looking for free contact form code for blogger like this? if so just follow this step by step tutorial.
Follow the below steps to create a free Contact Form Code For Blogger to a separate page. If you would like to see a demo, you can check out my Demo.
1.First go to Lyout
2.Now find out the unique Blogid of your blog. Where can i find blogID? on the URL bar of your browser when you are on any page on your blog’s dashboard. This blogID is required to generate the code for the new Contact Form page.
The below screenshot explains how you can find out the blogId. Find this number and note it down. This number will be needed to generate code for the contact form.
3.Now create a new page in your blog
Copy and edit the below the free contact form code snippet . Editing the blogId number is mandatory(Use the number which you noted down in step 2)
var blogId = '8123020903950952473';//this number should be mandatorily edited.
//The below Message 5 Strings can also be edited
var contactFormMessageSendingMsg ='Sending...';
var contactFormMessageSentMsg = 'Your message has been sent.';
var contactFormMessageNotSentMsg = 'Message could not be sent. Please try again later.';
var contactFormEmptyMessageMsg ='Message field cannot be empty.';
var contactFormInvalidEmailMsg = 'A valid email is required.'
var widgetLoaded=false;
function sendEmailMsg() {
if(widgetLoaded== false) {
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'sidebar', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': contactFormMessageSendingMsg , 'contactFormMessageSentMsg': contactFormMessageSentMsg , 'contactFormMessageNotSentMsg': contactFormMessageNotSentMsg , 'contactFormInvalidEmailMsg': contactFormInvalidEmailMsg , 'contactFormEmptyMessageMsg': contactFormEmptyMessageMsg , 'title': 'Contact Form', 'blogId': blogId, 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
widgetLoaded=true;
document.getElementById('ContactForm1_contact-form-submit').click();
}
return true;
}
While creating the Page, you have to switch to the HTML mode as shown in the image below. Then paste the above contact form code into the post editor(after proper editing), disable the comments and publish your page.
Once the page is published, go to this new page fill out the contact form, click on the send button and verify that it sends out the email to yours.
