Supportive Bloggers Community Join Now!

How to create contact us page in Blogger [Easy Method]

How to create contact us page in Blogger Blogspot.com for Free step by step easy method setup
BloggerBoosted
Please wait 0 seconds...
Scroll Down and click on Go to Link for destination
Congrats! Link is Generated

Hi dear professionals! Ever wonder what a "Contact Us" page is all about and why having it on your website is so crucial? Allow me to explain everything to you in detail. Any company website must have the Contact Us page. It is a basic yet crucial element for business growth. It acts as a direct channel of contact for you to interact to customers or potential clients. 

In order to make it easier for people to contact you, this page often contains information about your company, like your address, phone number, and email. In addition to increasing the legitimacy of your website, having a contact us page enhances customer support and may even bring in additional revenue. Therefore, if you haven't already, be sure to include a Contact Us page on your website right away! I guarantee it's worthwhile. 

Now I will Tell you how to create Stylish contact form for Blogger HTML. No error of blogger contact form not working. Just you need to copy and paste the code in HTML Mode and Ready to go for Free Lifetime.

Blogger contact us page generator:

Custom Blogger Contact Us Page Generator

Create Contact Us Form for Blogspot Step by step Process:

  1. Login to the dashboard of the website after logging into your Blogger account.
  2. Open a new page or navigate to the page where the contact form is to be added.
  3. Go to the HTML mode in the Blogger editor.
  4. Change the Editor From Text view to HTML View
  5. Paste the HTML code below into the HTML editor after copying it.
Contact Us Form Code:
<div class="my-contact-form">
  <form
    action="https://formsubmit.co/youremail@email.com"
    method="POST"
    id="contact-form"
  >
    <div>
      <label class="my-contact-form-label" for="name">Name:</label>
      <input class="my-contact-form-input" type="text" id="name" name="name" required />
    </div>
    <div>
      <label class="my-contact-form-label" for="email">Email:</label>
      <input class="my-contact-form-input" type="email" id="email" name="email" required />
    </div>
    <div>
      <label class="my-contact-form-label" for="message">Message:</label>
      <textarea class="my-contact-form-input" id="message" name="message" required></textarea>
    </div>
    <input type="hidden" name="_captcha" value="false" />
    <input type="hidden" name="_template" value="table" />
    <input
      type="hidden"
      name="_next"
      value="https://www.bloggerboosted.com/"
    />
    <button class="my-contact-form-btn" type="submit">Send</button>
  </form>
</div>

<style>
.my-contact-form{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}
.my-contact-form form{
  	width: 100%
}
.my-contact-form-label{
    display: block;
    font-weight: 600;
    font-size: 16px;
    color: #07074d;
    margin: 12px 0;
}
.my-contact-form-input{
    width: 100%;
    padding: 12px 0px !important;
    text-indent: 10px !important;
    border-radius: 6px !important;
    border: 1px solid #e0e0e0 !important;
    background: white !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    color: #6b7280 !important;
    outline: none !important;
    resize: none !important;
}
.my-contact-form-input:focus{
  border-color: #6a64f1 !important;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.05) !important;
}
.my-contact-form-btn {
    text-align: center;
    font-size: 16px;
    border-radius: 6px;
    padding: 14px 32px;
    border: none;
    font-weight: 600;
    background-color: #6a64f1;
    color: white;
    width: 100%;
    cursor: pointer;
  	margin-top: 12px;
}
.my-contact-form-btn:hover {
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.05);
}
  
  </style>

Now Find ' action="https://formsubmit.co/youremail@email.com"' and change youremail@email.com and replace with your Email.

Now you are all done. Just Save the code and Test the form. you will find Email in your Inbox. Also you can change your naked email with a encrypted code that will give you in the activation Email.

Video Tutorial Link:

Link is coming soon!

Custom Contact Us Form Faq:

Is It Free for Lifetime?

Yes. It's Free for Lifetime. It's a Non profit Form Builder.

Is Helpful for my Business or Blog?

Yes. Of Course.

Is there any security issues?

No. Not at all.

Post a Comment

Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.