Add an HTML5 Contact Form to Your WordPress Site

Got a brand new HTML5 theme for your WordPress and looking for an HTML5 contact theme to add to it? You’ve come to the right place.

Of course, you could always build your own, but maybe you’re not so handy with the code. No problem! There are a couple of new plugins available which advertise themselves as being made for working with HTML5.

HTML5 Contact Form Plugin

The new HTML5 Contact Form plugin in the WordPress repository includes a basic form with clean CSS. It features:

  • Form validation and detailed UI feedback on error
  • Captcha that should work on most setups with GD library installed
  • Language file for easy localization
  • Admin option page where some basic options can be set
  • Simple to install and use

Here’s what it looks like:

Try out a live demo to see the form in action.

HTML5 Contact Form 7

Are you a long-time fan of the popular Contact Form 7 plugin? HTML5 Contact Form 7 is based on Contact Form 7 and it adds support for the new form features in HTML5. I don’t think it’s available in the plugin repository, but you can download it directly from the developer’s site.

New features include:

  • Ability to add HTML5 “input types” to your input fields.
  • Support for HTML5 Placeholders.
  • jQuery fallback for browsers that don’t support Placeholders.
  • Existing mess involving line breaks and paragraph tags cleaned up. All layout styling now achieved with CSS.

Check out a screenshot:

Please note that use of this plugin requires an HTML5 doctype. Follow the step-by-step tutorial on the plugin’s homepage to make sure you set it up correctly.

Know of any other HTML5-friendly contact form plugins? Leave us a tip in the comments below!

Comments (1)

Participate