Having a contact form is a vital part of every blog/website. It enables your readers to have an indirect link with you regarding your products or services. In such manner this gives all visitors a path in which to open a good communication with you and to your clients. There are many types of contact forms that can be used in variuos occasions like survey questions, polling visitors on various topics, or allowing visitors to join your newsletter. In this tutorial, I will show you on how to add contact form via 123contact form since I used this also in my contact page.
How to Add 123 Contact Form in Blogger
Step 1. Go to 123 contact form.
Step 2. Create an account there for free.
Step 3. Then follow all the steps that the requested from you.
Step 4. Get or copy the codes for your contact form. The codes may look like this:
<!-- 123ContactForm.com script begins here -->Step 5. Go to your Blogger Dashboard >> Click New Post or you may use New Page (static page).
<script type="text/javascript">var servicedomain="www.123contactform.com"; var frmRef=window.top.location.href; var cfJsHost = (("https:" == document.location.protocol) Some Codes Here.................................................; </script>
Report it!">Report abuse
<!--123ContactForm.com script ends here-->
Step 6. In your Blogger Post Editor's Page, paste the code that you have got from 123contact form (in step 5). You may put a title (Contact Us or Contact).
Note: In putting the contact form codes, your Blogger Post Editor's Page must be in HTML mode.
Step 7. Publish it in an earlier period of time so that it will not appear at your home page but if you're using a new page, just simply hide it.
Bonus Tip
If you want to appear your contact page like mine in a manner that it occupies the whole page of your blog. Please follow the steps below:
1. Go to Blogger Dashboard >> Click Template (have a backup of it as your reference)
2. Hit the Edit HTML buttom
3. Locate or Control F the tag below
]]></b:skin>
4. Just below the code "]]></b:skin>", you paste the code below
<b:if cond='data:blog.url == "
http://bloggingtipsandtrix.blogspot.com/2012/12/about-me.html"'><style>
.main-inner .columns {
padding-left: 0px !important;
padding-right: 0px !important;
}
.main-inner .fauxcolumn-center-outer {
left: 0px !important;
right: 0px !important;
}
.main-inner .fauxcolumn-left-outer, .main-inner .fauxcolumn-right-outer, .main-inner .column-left-outer, .main-inner .column-right-outer {
display: none !important;
}
</style>
</b:if>
Customization:
- Replace the URL (red bold text) with the URL of your Contact page.
<center><style>#sidebar-wrapper, #midsidebar-wrapper, .gapad2, .blog-pager, .post-header-line-1, .post-footer { display:none !important;} #main-wrapper { width:900px!important;} .post { width:900px!important; }
</style></center>
6. Save your template and you are done!
If you some questions regarding this post,feel free to leave it at the comment box below or please contact me. I will try to answer it as time allows.
Thank you and have peace in your heart and mind! Enjoy!!!
About the Author:
Hello folks! This is GOLDEN WORKS TV, the admin of this blog. No words could described my grateful appreciations to all newbie and professional bloggers around the world and most especially to Almighty God who gave me the wisdom...Read More
No comments :
Post A Comment!
We love to hear your feedbacks and suggestions. We will try our best to reply to your queries as soon as time allows. Please keep in mind that all comments are moderated manually by our editors team to minimize spamming, and all the links are nofollow.
Note:
1. To add HTML code in the box, please use our HTML editor generator.
2. Please do not spam. Those type of comments will be deleted upon our review.
3. We should appreciate an individual and suggestive discussion.
Best Regards,
GOLDEN WORKS TV