Langsung ke konten utama

How To Create A Contact Form For Blogger Using Kontactr

Contact forms enable visitors to our sites to send us emails without having to expose our email address to potential spammers.

I've been using Kontactr to embed a contact form in this site for years now, and still believe it is the most ideal solution for those using the Blogger platform. However, it seems my previous tutorial is now out of date!

Recently, Kontactr added CAPTCHA functionality to their forms which makes even more difficult for spammers to abuse the facility. We can also now customize the appearance of the form to match the design of our sites.

Here is a comprehensive tutorial to help Blogger users embed a functional, customizable contact form for their blog using Kontactr.

Create your free Kontactr account

Go to Kontactr and click the "Sign Up Now" button to create your free account:


You will need to type your name, choose a username, type your email address and choose a password.

When choosing a username, bear in mind that a hosted version of your contact form will be made available in the format kontactr.com/user/yourusername.

Once you've signed up you'll need to validate your email address before you can begin using your account. Then simply sign in using your username and password.

A contact form is created for your account as soon as you register to use Kontactr's free service. Only one contact form can be generated for each email account, so if you need to use more than one for whatever reason, you will need to sign up again using a different username and email address.

Grab the code to embed your contact form

Once you've logged into Kontactr, the embed code you'll need for your contact form will be available right away!


Highlight all of the code in the "Ajax Widget" box and copy this to your clipboard. We can add this code to a static page to generate our contact form.

Create your Contact Page

In your Blogger dashboard, create (or edit) a "contact" page in which you would like to embed your contact form.

Add an introductory paragraph or any other content you like, then switch to "Edit HTML" mode before pasting your Kontactr code.

You can preview your page if you like and the contact form will show up in the area where you pasted the Kontactr code.

On slower connections, it may take a few seconds for the contact form to show up. This is because your contact form is rendered in an iframe (rather than within the page content), and also because CAPTCHAs are in place to deter spammers.

Here's a screenshot of a Kontactr form in use in the contact page:



Once you're happy with your page, simply save and enjoy your new contact form!

Customizing your Kontactr form

By default, the Kontactr form uses a white background and black text, which may not be compatible with your Blogger template.

Luckily, within the Kontactr dashboard there is a link to customize the Ajax widget used to render your form. On this page you can change the colours used for your contact form to better match the appearance of your blog:


If you change the appearance of your contact form, you will need to paste the custom code found on this page instead of the default code to render the form correctly in your site.

What happens when a visitor uses the contact form?

The details used to submit the contact form will be emailed to the address you used when signing up to use Kontactr. It will appear as though the email originated from the sender so you'll easily be able to reply to their message.

Form submissions are not stored by Kontactr, so be sure to keep any important submissions sent via your form!

Final thoughts

So far as I'm aware, there are no limits on the number of submissions which can be made using Kontactr forms. The service is completely free, and has proved to be reliable.

Other contact form services I have looked at limit the number of submissions each month, which poses problems for those who require anything more than around 100 form submissions each month. 

I hope this tutorial has helped you create our own free contact form with Kontactr to embed in your Blogger site. Please feel free to leave your thoughts and comments below.

Komentar

Postingan populer dari blog ini

How To Add A Music Player In Blogspot

Since this archived post was written in 2007, web design and Blogger templates have changed immensely. The development of HTML5 and <audio> tags enable us to add music to our Blogspot websites and posts far more simply, and with improved control. In preparation for explaining how to podcast with Blogger, this tutorial explains how to easily add an HTML5 mp3/audio player to your blog posts or layout. No JavaScript, Flash or plugins are required, and with a fallback for older browsers which don't support the player. I've even created a simple form to generate basic tags for you! Adding music to your Blogspot site has never been so easy! Basic HTML5 Audio Tags Explained The <audio> tag is a new feature of HTML5 which we can use to natively embed audio playback in our sites. It is supported in Internet Explorer 9, Firefox, Opera, Chrome, and Safari, and can be set to play the linked audio file automatically (autoplay) or loop if required. Here...

Import Blogs From Another Service To Blogger With The Google Blog Converters Project

A few months back, Blogger announced the ability to import and export Blogger hosted blogs. At the time, it was not possible to import blogs from any other service to Blogger, which left many of us a little disappointed though wondering when this service could be made available. Well it seems there is hope that Blogger can make such a service available through our Blogger dashboards soon enough! Today the the Google Blog Converters project : an open source project which aims to make available the ability to import/export feeds from many different blog platforms: This new Open Source project provides the ability to easily move blog posts and comments from service to service. This initial release provides Python libraries and runnable scripts that convert between the export formats of Blogger, LiveJournal , MovableType , and WordPress . In addition, the source code includes templates for hosting these conversions on Google App Engine . Future additions to the project will includ...

Download Mp3 - Parodi Blackpink - dududu At D&#;Academy Indonesia Dance Solo by Ivonne Rose (Anak Indonesia)

download lagu 123 Parodi Blackpink - dududu At D&#;Academy Indonesia Dance Solo by Ivonne Rose (Anak Indonesia) - download lagu terbaru blackpink lisa moments i think about a lot- free download lagu mp3 Blackpink Lisa - Lili [FMV] Alan Walker, K- & Emelie Hollow - Lily- download lagu mp3 full 【BLACKPINK】Gaon Chart Kpop Awards -download lagu 123 MP3 bts & blackpink | mma , Semua Lagu-Lagu, Video dan Lyrics tersedia disini, Semua Musik ini berasal dari Youtube.com dan gratis untuk didownload. Belilah Lagu Parodi Blackpink - dududu At D&#;Academy Indonesia Dance Solo by Ivonne Rose (Anak Indonesia) dan kasetnya di Toko Terdekat Maupun di iTunes atau Amazon secara legal, ini hanya sebagai Review dan Promosi saja. Video Terkait Video Download MP3 Parodi Blackpink - dududu At D&#;Academy Indonesia Dance Solo by Ivonne Rose (Anak Indonesia) Download MP3 blackpink lisa moments i think about a lot Download MP3 Blackpink Lisa - Lili [FMV] Alan Walker, K- & Emelie Ho...