BLACK FRIDAY: 50% OFF all Pro plans
Pro from $18 a year or $60 lifetime, no code needed
Ends Cyber Monday, 30 Nov. Lock in the price today
Get 50% Off
Guide

Gravity Forms Styler Free

How to set up and style the Gravity Forms Styler widget in Elementor.

Gravity Forms Styler places one of your Gravity Forms forms on the page and lets you style its labels, fields, checkboxes, button and messages with Elementor controls. It starts from a clean, modern look, so a form matches your design without writing CSS.

Part of: Bright Addons (free). Before you start: The Gravity Forms plugin, active, with at least one form.

Set it up

  1. Install and activate Gravity Forms and create a form there.

  2. Drag the Gravity Forms Styler widget onto the page.

  3. In Form, choose your form under Form.

  4. Keep Starting Style on Clean, or choose Form plugin style.

  5. Set Button Position and Hide Field Labels if you want them.

  6. Open the Style tab and style the Fields, Submit Button and Messages.

  7. Send a test entry on the live page to check the error and success messages.

Content options

Form

Option What it does
Form The Gravity Forms form to show.
Form Title Shows the form title.
Form Description Shows the form description.
Send Without Page Reload Sends the form with AJAX, so the page does not reload.
Gravity Forms Theme Basic (best for styling here), Orbital, or as set in the form. Needs Gravity Forms 2.7 or newer.
Starting Style Clean (rounded fields, bold button) or Form plugin style. Every Style tab option works with both.
Hide Field Labels Hides labels visually. They stay readable for screen readers, so add placeholders to your fields.
Button Position Left, center, right or full width, set per device.
Bright Addons Pro

Like this free widget? Get 80 more with Pro

Pro adds 80 widgets, 10 extensions, a Theme Builder and 32 dynamic tags, and keeps every free widget. From $18 a year, with a 14-day money-back guarantee.

Style options

These sections are in the Style tab.

  • Form Box

    background, padding, border, radius and shadow, form title and description colors.

  • Labels

    color, typography, space below, required mark color, field description color and typography.

  • Fields

    typography, text, placeholder, background, border and focus border colors, border width, radius, padding, space between fields and message box height.

  • Checkboxes and Radios

    tick color, box size, text color and typography.

  • Submit Button

    typography, normal and hover colors, border width, radius, padding and space above.

  • Messages

    field error text and border colors, success message text, background and border.

Tips

  • The form itself, its fields, notifications and entries are still managed in Gravity Forms.

  • Basic is the best Gravity Forms Theme for styling with this widget; Orbital brings more of its own look.

  • In the editor a short note shows when Gravity Forms is not active or no form is chosen. Visitors never see it.

Questions and answers

Do I need Gravity Forms?

Yes. The widget styles forms made with Gravity Forms, so the plugin must be installed and active.

Can I keep the original form look?

Yes. Set Starting Style to Form plugin style. Every Style tab option still works.

Does it support AJAX submit?

Yes. Keep Send Without Page Reload switched on.

Need more help?

Check the troubleshooting guide, or contact support with the page address and what you expected to happen.

Troubleshooting guide
All guides