How to make your Blog Professional with “Contact Form widget”

Published by kelvin Ehiozefe on

The appearance of your blog/ website surely determines the kind of attention people will attribute to it. Starting from the kind of theme or blog design you use along with the pages will determine the credibility of your blog.

Now when we talk about blog credibility we want you to understand that when a visitor lands their search on your blog/ website the first thing that caught their attention is the design/ layout of your site and the content within the pages of your site. Adding the contact form widget to your blog/ website is one way to improve the credibility of your blog.

contact form

How to add contact form widget to BLOGGER?

·    Sign in to your blogger account and navigate to your website/ blog

On the left sidebar click on Pages and click on create a new page and add the following code (don’t forget to change your input style to HTML before adding the code)


var blog I’d = ‘8694494030520005341’; //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

var contactFormEmptyMessageMsg =’Message field cannot be empty.’;

var contactFormInvalidEmailMsg = ‘A valid email is required.’

var widgetLoaded=false;

function sendEmailMsg(){

false) {

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’:
‘’}, ‘displayModeFull’));




return true;




Name : </div>

class=’contact-form-name’ id=’ContactForm1_contact-form-name’ name=’name’
size=’30’ type=’text’ value=”/>

Email: <em>(required)</em></div>

class=’contact-form-email’ id=’ContactForm1_contact-form-email’ name=’email’
size=’30’ type=’text’ value=”/>

Message: <em>(required)</em></div>

class=’contact-form-email-message’ id=’ContactForm1_contact-form-email-message’
name=’email-message’ rows=’5′></textarea>


class=’contact-form-button contact-form-button-submit’
id=’ContactForm1_contact-form-submit’ type=’button’ value=’Send’

style=’text-align: center; max-width: 450px; width: 100%’>

class=’contact-form-error-message’ id=’ContactForm1_contact-form-error-message’></p>





‘8694494030520005341’;                 Replace with your blog id (your BlogiD is the number that is attached

                                                                     with blog URL when you open it in a browser)

Delete these two messages;            //this number should be mandatorily edited.

                    //The below message 5 Strings can also be edited

Note; this contact form widget will deliver all emails sent directly to the Gmail account you used in creating your blog which appears as your admin mail. But if you want to receive your emails on a separate mailbox or with your webmail then you may use any of these platforms. They are free and easy to set up;

How to add Contact Form widget to your Blog


Kontactr blog


Kontactr is a one-click free contact form service which allows you create highly customize-able contact forms on the fly.

How to create contact form with Kontactr?

Step 1; Go to kontactr form site or click here

Step 2; sign-up with kontactr form

Step 3; fill in the required information (Name, Username, Email address, and Password)

Step 4; validate your email address

Step 5; sign in and a contact form is created

Step 6; copy the code to embed your contact form widget

Step 7; Go to Blogger create a new page (in HTML) and add code.

Note; when choosing a username bear in mind that a hosted version of your contact form will be made available in the format: Also only one contact form can be created for one email address.



Foxyform contact form service is one of the most easiest and straight to the point contact form service to use on your website with anti-spam protection. No sign-up required..!!

How do I create a contact form with Foxyform?

Step 1; Go to

Step 2; select all that you want or how you want your contact to appear as well as the email you want to receive all your mails.

Step 3; finally click on create formula button, copy code, and add to your contact us page on Blogger.

Step 4; Save and publish

The contact form widget makes your blog more professional and more convenient for users of your site to reach you.

If you have any question please contact me or leave a comment in the comment area. You may also share this post with friends on social media


Leave a Reply

Avatar placeholder

Your email address will not be published. Required fields are marked *

%d bloggers like this: