Skip to content

Instantly share code, notes, and snippets.

@Critter
Created June 8, 2015 02:54
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Critter/f38b6aa24464f0fca9bc to your computer and use it in GitHub Desktop.
Save Critter/f38b6aa24464f0fca9bc to your computer and use it in GitHub Desktop.
Create 2-column forms using gravity forms
function gform_column_splits($content, $field, $value, $lead_id, $form_id) {
if(!is_admin()) { // only perform on the front end
if($field['type'] == 'section') {
$form = RGFormsModel::get_form_meta($form_id, true);
// check for the presence of multi-column form classes
$form_class = explode(' ', $form['cssClass']);
$form_class_matches = array_intersect($form_class, array('two-column', 'three-column'));
// check for the presence of section break column classes
$field_class = explode(' ', $field['cssClass']);
$field_class_matches = array_intersect($field_class, array('gform_column'));
// if field is a column break in a multi-column form, perform the list split
if(!empty($form_class_matches) && !empty($field_class_matches)) { // make sure to target only multi-column forms
// retrieve the form's field list classes for consistency
$form = RGFormsModel::add_default_properties($form);
$description_class = rgar($form, 'descriptionPlacement') == 'above' ? 'description_above' : 'description_below';
// close current field's li and ul and begin a new list with the same form field list classes
return '</li></ul><ul class="gform_fields '.$form['labelPlacement'].' '.$description_class.' '.$field['cssClass'].'"><li class="gfield gsection empty">';
}
}
}
return $content;
}
add_filter('gform_field_content', 'gform_column_splits', 100, 5);

First go to Form Settings and add class two-column to Form Layout.

Then go ahead and add a section break in the beginning of your Gravity Form items. Add another section break to where ever you want your form to split. Then add class gform_column to both section break's from Appearance tab.

Credit: http://stackoverflow.com/a/26308743

.gform_wrapper.two-column_wrapper ul.gform_fields {
display: none;
}
.gform_wrapper.two-column_wrapper ul.gform_fields.gform_column {
display: block;
float: left;
width: 50%;
}
.gform_wrapper.two-column_wrapper ul.gform_column li.gsection:first-child {
display: none;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment