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:
Create Contact Us Form for Blogspot Step by step Process:
- Login to the dashboard of the website after logging into your Blogger
account. - Open a new page or navigate to the page where the contact form is to be
added. - Go to the HTML mode in the Blogger editor.
- Change the Editor From Text view to HTML View
- Paste the HTML code below into the HTML editor after copying it.
<div class="my-contact-form">
<form
action="https://formsubmit.co/[email protected]"
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/[email protected]”‘ and change
[email protected] 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:
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.
why it not work 🙁
It will must work. I am going to update the video tutorial for that Contact Page. Please Provide your Mail, so that I can inform you about the video update.