The Bundle Up! Black Friday Sale Is Live!
Countdown timer
How to... embed your Gravity Forms in WordPress

How to Embed Gravity Forms in WordPress: All You Need to Know

Written by Casey Burridge

Last updated:

Categories Gravity Forms

Are you looking to embed a Gravity Form on a WordPress page or post?

Gravity Forms is the most well-known and trusted form plugin for WordPress. With a host of impressive features, including a powerful drag and drop interface, Gravity Forms allows you to create beautiful web forms with ease. 

In this post, we’ll show you all the different ways to embed Gravity Forms on your website 👇

Why Use Gravity Forms Above Other WordPress Form Plugins?

Apart from being one of the oldest and most trusted WordPress form plugins available, there are several other reasons why you should consider using Gravity Forms above other form plugins.

Leaders in Accessibility

The term “accessibility” refers to creating websites that are usable by people with physical, visual, or cognitive impairments. Gravity Forms are the leaders in web form accessibility, allowing you to build forms that are WCAG compliant.

Accessible web forms improve the user experience and allow you to reach a larger audience.

Well-supported

As stated previously, Gravity Forms is one of the oldest WordPress form plugins. The plugin is supported by a team of designers and developers that continually work to add new features and improve existing functionality.

Rich Features

What are the features of Gravity Forms, you ask? Quite simply, Gravity Forms contains everything you need in a form plugin and more! This includes:

  • Integrations with popular third-party applications (including email marketing software, CMS platforms, and more)
  • AJAX form submit
  • A range of advanced field types
  • Email notifications
  • Conditional logic
  • File uploads
  • The ability to import and export forms

To learn more about Gravity Forms and the features it contains, check out our ultimate guide on how to use Gravity Forms.

A Wealth of Powerful Add-Ons

Gravity Forms is more than just a form plugin, it resides at the core of an entire ecosystem of plugins, add-ons, and developers.

One of the reasons users choose Gravity Forms over other WordPress form plugins is due to its extensive library of both first and third-party add-ons. At GravityView, our add-ons allow you to display form data on the front end, perform advanced calculations, import entries via a CSV file, export data to remote storage, and much more!

Check out our toolkit of essential Gravity Forms add-ons.

Using Gravity Forms in WordPress

Are you new to Gravity Forms and wondering how to get started? Here’s how you can integrate Gravity Forms into your WordPress website.

  1. Download the Gravity Forms plugin
  2. Upload the Gravity Forms plugin to WordPress
  3. Install and activate Gravity Forms
  4. Activate your license key
  5. Create your first form
  6. Add the form to your site

After purchasing a license from the Gravity Forms website, head over to your account page and click on the downloads tab at the top. Now click on the Download link next to Gravity Forms to download the plugin ZIP file to your computer.

An arrow pointing to the 'Download' link on the Gravity Forms Account page

The next step is to upload the plugin file to WordPress. To do this, log in to your WordPress website, hover over Plugins and click Add New. Now click Upload Plugin at the top, then click on Choose File and select the plugin file you downloaded previously.

An arrow pointing to the 'Choose File' button

Finally, click Install Now. When Gravity Forms has finished installing, click Activate. Now that Gravity Forms is active on your website, you’ll need to activate your license key.

You can find your license key in your Gravity Forms account under Your Licenses.

Gravity Forms license key

Simply copy the key and paste it into the license key box on the Gravity Forms Settings page inside WordPress.

The license key box on the Gravity Forms settings page in WordPress

After activating your license, you’re ready to create your first form! 

To create a new form in Gravity Forms, hover over Forms in your sidebar menu and select New Form. Now give your new form a name and click Create Form.

Creating a new form in Gravity Forms

You can now start constructing your new form using the Gravity Forms drag and drop builder.

Okay, now comes the most important step – adding the form to your website.

How Do You Embed Gravity Forms?

Creating a form is pointless if you can’t display it on your website. Here’s how to embed Gravity Forms in a WordPress page.

Embed Gravity Forms Using the WordPress Block Editor (Gutenberg)

The easiest way to embed Gravity Forms in WordPress is by using the Gravity Forms Gutenberg block. Needless to say, this method will only work for you if your website uses the block editor. If not, you’ll need to use one of the other methods outlined below.

Start off by creating a new page or post by hovering over Page/Post and clicking Add New. Now click the ‘+’ icon and search for the “Gravity Forms” block.

The Gravity Forms Gutenberg block

After adding the block to your page layout, you’ll need to select the form you want to embed from the dropdown menu.

An arrow pointing to the 'Select a Form' dropdown menu

After choosing the form you want to embed, you’ll see a preview of your form load inside the editor. On the right-hand side, you’ll also see various form settings allowing you to customize the way your form is displayed on the front end by enabling or disabling the Form Title and Description.

The Form Settings with the options to disable or enbale the Form Title and Description

By opening the Advanced tab you can turn the form preview on and off and enable or disable AJAX.

Gravity Forms Advanced Settings allowing you to enable AJAX

When you’ve finished configuring the form settings, save your page/post and open it on the front end. 

A Gravity Forms on the front end showing the following fields: Website, First Name, Last Name, Email Address and Comments/Questions

So what if you’re still using the WordPress Classic editor? Or what if you want to embed your shortcode inside a widget or a custom post type that doesn’t use Gutenberg? That’s where the Gravity Forms embed shortcode comes in.

Embed Gravity Forms Using a Shortcode

WordPress shortcodes are small bits of code that allow you to display information or create objects that would usually require programming skills.

The Gravity Forms embed shortcode allows you to embed forms anywhere on your website! The shortcode takes several parameters allowing you to customize the look of your form and prepopulate field values dynamically.

A typical shortcode looks like this:

[gravityform id="7" title="false" description="false" ajax="true"]
  • id – Your form ID
  • title – allows you to hide or display the form title, either true or false
  • description – allows you to display or hide the form description, either true or false
  • ajax– use AJAX to submit the form without reloading the page, either true or false

If you’re using the WordPress classic editor, you can insert the embed shortcode without having to construct it yourself. To do this, click the Add Form button above the text editor.

An arrow pointing to the 'Add Form' button

Now, select your form from the dropdown menu and configure the form settings. When you’re done, click Insert Form.

The Insert Form options, alowing you to display the form title, form description and enable AJAX

Your shortcode will now automatically be added to your page layout.

The Gravity Forms shortcode

Now let’s look at how this process works for different page builders, like Divi, Elementor, or Beaver Builder.

Embedding Gravity Forms in Other Page Builders

Here’s a quick overview explaining how to embed Gravity Forms using different page builders:

Elementor

You can either manually embed your forms using the Gravity Forms embed shortcode or you can use the Gravity Forms widget that comes with the free PowerPack Lite add-on. Learn more about embedding Gravity Forms in Elementor.

Divi Builder

Once again, you can manually embed forms using the embed shortcode or you can use the Gravity Forms module that comes with the free WP Tools Gravity Forms Divi Module plugin. Learn more about embedding Gravity Forms in Divi.

Below are some commonly asked questions with regards to embedding Gravity Forms.

How Do You Format and Style Gravity Forms?

You can format and style your Gravity Forms by adding custom CSS to your WordPress theme. Alternatively, you can use Gravity Forms’ CSS ready classes to add pre-configured styles to your form fields.

How Do Your Edit Gravity Forms in WordPress?

Let’s say you’ve built your form and embedded it on a page or post. You can still edit or update your form at any time. First, hover over Forms and click Forms. Next, hover over the form you want to update and click Edit. You’ll be taken to the form editor where you can add/delete fields, update field labels or change your form settings.

Can You Embed Gravity Forms on a Non-WordPress Website?

Looking to embed Gravity Forms on another site that doesn’t run on WordPress? Gravity Forms is a WordPress plugin and, therefore, it is not compatible with other types of websites. Gravity Forms will only work on a WordPress website that meets the following requirements: PHP v5.6+, MySQL v5.5+, and, preferably, the latest version of WordPress itself.

Embed Forms on Your WordPress Site Using Gravity Forms

Gravity Forms is a WordPress form plugin that allows you to create high-converting web forms for a variety of use-cases. Not only does Gravity Forms contains a range of impressive features, but it’s also optimized for accessibility.

In this post, we showed you several ways to embed Gravity Forms on your pages or posts, including using the Gravity Forms embed shortcode and Gutenberg block. If you found this post helpful, be sure to check out more content on our blog! 😁