Learn How to Give Your Gravity Forms Some Pizzazz with CSS Classes [Exclusive Video]

Written by Jean Galea
Written by Jean Galea

Last updated on 13 Sep 2022

Everybody loves Gravity Forms and for a good reason!  It works great and looks awesome... but what if you wanted to change the appearance of some of those form fields? Maybe putting a phone field to the right of an email field? How about splitting a ton of checkboxes into three columns or making a scrollable agreement box?  It's all possible! Using CSS Ready Classes for Gravity Forms (click that link to open it in a new tab) will help you do all that and more!

WP Mayor is supported by its audience. If you purchase through a link on our site, we may earn a commission. Here’s why you can trust us.

Table Of Contents

Table of Contents

Before We Get Started

We found a fully managed WordPress host with fantastic speed, security, and support that has performed consistently for many of our sites.

WP Engine’s longevity and reputation speak for themselves. They offer a hosting platform that allows you to build, test, and deploy faster, along with built-in performance optimizations, backups, and much more.

Try it today and save $100+ in your first year.

With that said, let’s get started…

Introduction

As a way of saying thank you to our loyal WPMayor readers, we’ve managed to get an exclusive Gravity Forms video for you from from the Learn Gravity Forms course that is launching today February 24th!  The full course includes 25 lesson videos and we’ve got exclusive access to one of them… Lesson 16! 


Everybody loves Gravity Forms and for a good reason! It works great and looks awesome… but what if you wanted to change the appearance of some of those form fields?

Maybe putting a phone field to the right of an email field? How about splitting a ton of checkboxes into three columns or making a scrollable agreement box?  It’s all possible!

Using CSS Ready Classes for Gravity Forms (click that link to open it in a new tab) will help you do all that and more!

Watch this exclusive video below from the Learn Gravity Forms course and if you want to get the entire course, we’ve negotiated a 25% discount on any package for WP Mayor readers!

WP Mayor readers get 25% off any Learn Gravity Forms package!

<span style="font-weight: 400">Written by: </span>Jean Galea
Written by: Jean Galea

Jean Galea is an investor, entrepreneur, and blogger.

He is the founder of WP Mayor, the plugins WP RSS Aggregator and Spotlight, as well as the Mastermind.fm podcast.

His personal blog can be found at jeangalea.com.

BionicWP

Quick Links

Did you find this article helpful?

Share Your Discovery

2 Responses

  1. Hi Sameer,

    Using a plugin (like the one you are using) is by far the easiest way to style Gravity Forms… the other option would be to use something like FireBug (http://getfirebug.com/) to find the class you are looking to change then add some custom CSS classes to your themes styles.css file to override it.

    If all that sounds terrible to you (and it is!), continue using the plugin! 🙂

    Ian Anderson

Leave a Reply

Your email address will not be published. Required fields are marked *

Discover more tips and tools.
Join 5000+ designers, developers, and site builders who follow us to receive the best guides, tools, and services for their website builds every week.

Hey, design enthusiasts...

Elevate your website designs with our free transformative guide on the 60-30-10 rule.

Discover how this simple, yet powerful, principle can make your designs infinitely better!

By downloading this guide, you are opting in to our email list. We don’t send spam. You may unsubscribe any time.

What's missing?