There are three ways to embed a form into a post, page, or template.
Contents |
Page/Post Editor
Shortcode Builder
From the Page or Post Editor you can click on the Form icon in the Upload/Insert toolbar. This is located to the left of the Visual/HTML tabs in the body text editor. Clicking on the Form icon will activate the insert form modal window.
Using the shortcode builder you will first want to select a form from the Select a Form dropdown. If you are unable to find your form in the dropdown list, return to the Edit Forms page and ensure that your form is active. Once you have selected a form, you can specify the following options:
- Display form title
- Checking this option will display the form title
- Display form description
- Checking this option will display the form description
- Enable AJAX
- Checking this option will enable your form to be submitted via AJAX. Submitting the form via AJAX allows the form to be submitted without requiring a page refresh.
After you have specified your desired options, click Insert Form to automatically insert the Gravity Forms shortcode into the body of the post/page content you are editing.
Shortcode Manually
If you would like to build the WordPress shortcode manually, you may do so using the format and options below. You may then insert the shortcode into the body of the page or post you would like the form to appear in.
Example:
[gravityform id=1 title=false description=false]
- id
- The id of the form to be embedded. (required)
- title
- Whether or not do display the form title. Defaults to 'false'. (optional)
- description
- Whether or not do display the form description. Defaults to 'false'. (optional)
- ajax
- Specify whether or not to use AJAX to submit the form.
- tabindex
- Specify the starting tab index for the fields of this form.
Function Call
If you would like to call a form from within a WordPress theme file, you may do so using a function call. The function and it's available parameters are outlined below.
<?php gravity_form($id, $display_title=true, $display_description=true, $display_inactive=false, $field_values=null, $ajax=false, $tabindex); ?>
- $id
- (integer) (required) The id of the form to be embedded.
- $display_title
- (boolean) (optional) Whether or not do display the form title.
- Defaults to false.
- $display_description
- (boolean) (optional) Whether or not do display the form description.
- Defaults to false.
- $display_inactive
- (boolean) (optional) Whether or not to display the form even if it is inactive.
- Defaults to false.
- $field_values
- (array) (optional) Pass an array of dynamic population parameter keys with their corresponding values to be populated. Example, "array('parameter_name' => 'custom_value')".
- Defaults to false.
- $ajax
- (boolean) (optional) Whether or not to use AJAX for form submission.
- Defaults to false.
- $tabindex
- (integer) (optional) Specify the starting tab index for the fields of this form.
Usage Examples
- Basic Function Call
-
<?php gravity_form(1, false, false, false, '', false); ?>
- This snippet will display the form with an id of '1'; the title and description will not be displayed, the form itself will not display if it is inactive, and it will not use AJAX for form submission.
-
- With Ajax & Tabindex
-
<?php gravity_form(1, false, false, false, '', true, 12); ?>
- This snippet will display the exact same form as above except it will use AJAX for form submission and the starting tabindex will be 12.
-
Enqueue Scripts and Styles
When embedding a form via a function call you must also manually include the necessary Gravity Forms related Javascript and CSS via the built in WordPress enqueue capabilities. Gravity Forms does not include these by default when calling a form via a function call and they are necessary for forms that contain conditional logic or the date picker field.
We strongly recommend you enqueue the scripts rather than including them as hardcoded calls in your theme. Implementing it this way will insure that Gravity Forms does not include them on the page if they are already present. It is also a good practice to only load these scripts on the front end.
Gravity Forms 1.5 introduced the gravity_form_enqueue_scripts function which allows you to easily enqueue the necessary Gravity Forms' scripts and styles when manually embedding a form. This is also useful if you are using a GF widget and do not wish for the styles and scripts to be loaded inline.