what is the importance of contract page?

Contract page make site professional and helps visiters.

How do you create a contact us page in Blogger step by step

Visit the page and read carefully

How do you create a form on Blogger?

it's very easy to create a form just you have to read the article and apply carefully

What should be included in a contact us page?

1.Email address 2.contract info 3.social accouns

create contact us page on blogger । contact form 2022

Hello if you are a new blogger than I am sure you are searching how to create a contact us form for blogger contact us page generator for blogger

And after searching you'd not get the right answer of you question.....

Now I will help you to make a complete contact us form. And when user fill the contact form you will recieve message on your mail box.

This form will be really interesting for you website and for your website visitors.

{tocify} $title={Table of contents}

how contact form works?

I hope you have watch the demo of this form and I also hope you like this form ok I I start.

create stylish contact form for blogger

Firstly I will give you the code downwards

Download the code

Go to your blogger dashboard and click on pages option after that new page .

Then click on up pencil and make HTML VIEW from compose view. Now simply paste the source code in html view.

Now your have to make few change on that html code.

contact form html code edit

Open a new tap and search for www.formsubmit.co. You will get a new interface.

If you are using desktop click on Email link beta. If you are mobile user click on up right side three dot and click on Email link beta. example shown here:

Now click on email beta and then new interface will be open simply on a box enter the email on which email you want to receieve your website contact us message. And click on generate the link.

After clicking on create your link you will get an email. where you have to click on the email given link. After cliking on that link your email is verify now you can close that website and come back to your blog post and then html view. now look down the image and search the place other wise search where my email is written. or search this code

from this code only change your email by which you have login with formsubmit.co For Example anmolpoetry18@gmail.com -- youremail@gmail.com

Now publish your post and see how this looks i know you will see error on recapcta but dont worry now we will solve this.

Add Recaptcha on contact us page

To solve the captcha promblem you have to go to recaptcha sing in page and singh in with your website valid dominname and with same email. www.recaptcha-sing in

After the form submit you will get a key copy the first key

And replace this key in a contact form html no.80-82 form by looking the downwards image <div class="g-recaptcha" data-callback="verifyCaptcha" data sitekey="6Lf_bTMeAAAAACWJl6lnJVHVjxHuMVNx2F3getBv"></div>

exchange up underline site key with your site key.

Now update your page and now preview your page your contact us form is ready. But the process is not complete yet. now try to send a message if the form is done after clicking on send buttom you will get a message active your form submission. When you will get this message open your gmail account you will get gmail from action form submission just click on the mail and open the link given on the mail box. you will be redirected to a new page and if you follow the up process perfectly you will get a message your form is activated. But if you get message unactivated or something else plz check the process is done perfectly or not. I hope you will not get any type of error. and if you need any help from me you can mail me on gmail or with help of contact form you can contact me

Gmail- anmolpoetry18@gmail.com

Activate contact us page for blogger

i have already tell you how to activate your form but after all process is done you observe that the form is redirecting to my thank you page now how to change my thankyou page and add yours

step

1. first create your unique thank you page first you and simply copy mine and custimize or you can make your own page. After your page is ready remember those things before publish go to option and select comment not allowed do the same setting in yur contact form.

After publishing your thankyou page copy the page link adress.

Come to the contact us edit mode change compose mode to html view by looking the downwards image change my link with you link. which code you can get on no. 20-22

you can see this code on the form html view there is my link just exchange with you link

contact us page html code

just click on the link and just copy the code and go to create page and paste your code on html view and follow the upper given process.

<!--Form Code Start Here-->

<div class="widget ContactForm" data-version="2" id="ContactForm1">

<div class="widget-title">

</div>

<div class="contact-form-widget">

<div class="form">

<form action="https://formsubmit.co/anmolpoetry18@gmail.com" method="POST" name="contact-form" onsubmit="return submitUserForm();">

<input name="_template" type="hidden" value="table" />

<input name="_subject" type="hidden" value="hack the item Submission" />

<input name="_captcha" type="hidden" value="false" />

<input name="_next" type="hidden" value="https://hacktheitem.blogspot.com/p/thank-you-for-contacting-h-t-he-i-tem.html" />

<p></p>

Name

<span style="font-weight: bolder;">*</span>

<br />

<input class="contact-form-name" id="" name="Name" required="" size="30" type="text" value="" />

<p></p>

Phone

<span style="font-weight: bolder;">*</span>

<br />

<input class="contact-form-name" id="" name="Phone" required="" size="30" type="phone" value="" />

<p></p>

Email

<span style="font-weight: bolder;">*</span>

<br />

<input class="contact-form-email" id="" name="Email" required="" size="30" value="" />

<p></p>

Message

<span style="font-weight: bolder;">*</span>

<br />

<textarea class="contact-form-email-message" cols="25" id="" name="Message" required="" rows="5"></textarea>

 <p></p>

<button class="contact-form-button contact-form-button-submit" id="" style="margin-bottom: 10px;" type="submit" value="Send">Send Message</button>

<p></p>

<div style="max-width: 222px; text-align: center; width: 100%;">

</div>

</form>

<!--Form Code End Here-->

<!--reCaptcha Code Begin Here-->

<div id="g-recaptcha-error"></div>

<div class="g-recaptcha" data-callback="verifyCaptcha" data-sitekey="6Lf_bTMeAAAAACWJl6lnJVHVjxHuMVNx2F3getBv"></div>

<br /><br /><br /> <br /><br /><br /><br /><br /><br />

<div id="g-recaptcha-error"></div>

<br /><br /><br />

<script src="https://www.google.com/recaptcha/api.js"></script>

<script>

function submitUserForm() {

    var response = grecaptcha.getResponse();

    if(response.length == 0) {

        document.getElementById('g-recaptcha-error').innerHTML = '<span style="color:red;">Solve below reCAPTCHA.</span>';

        return false;

    }

    return true;

}

function verifyCaptcha() {

    document.getElementById('g-recaptcha-error').innerHTML = '';

}

</script>

<!--reCaptcha Code Ends Here-->

</div>

</div>
 
</div> {codeBox}