Gravity Forms: Three Handy Tips

Home/Gravity Forms: Three Handy Tips

Today was essentially my first experience of Gravity Forms, the WordPress forms plugin and it would be fair to say it came with its fair share of use niggles, but nothing that I couldn’t overcome.

Here’s the three things I found that may help users facing the same problems.

Gravity Forms and On Focus

Having no onfocus with Gravity Forms (where you click in a text field and the default is removed) was slightly annoying, but a simple JQuery snippet added to the head of your site template and some CSS will fix this.

Step one is to add the following code to your header area.


Once this is in place, it’s simply the case of adding ‘focusfix’ as a Gravity Form CSS class on any field you would like to use the onfocus method. As easy as that.

Gravity Forms and Inline CSS

Making your forms look as intended can be a pain, especially if you’re like me and don’t read instructions. Fortunately, a quick Google search and I came across this guide. It helps alot.

Gravity Forms Adding Extra Spacing

The third and final tip is simple to anyone familiar with WordPress and shortcodes, but could leave you scratching your head otherwise. Should your form add additional spacing at the top or bottom, simply wrap the form’s shortcode in raw tags like so:

[raw][gravity_form_shortcode][/raw]

That’s it. Three simple tips that may help other Gravity Forms noobs like myself.

2013-10-21T15:48:29+00:00 October 11th, 2012|WordPress Snippets|0 Comments

About the Author:

Warren Chandler is a freelance web programmer and web developer, based in Frinton on Sea, Essex. Warren specialises in web programming, web design, corporate identity, copy writing, SEO, logo and print media for home, work, and mobile platforms.

Leave A Comment