Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Move Gravity Forms field labels from below to above fields in compound fields (e.g. Address, Name)
<?php
/*
Plugin Name: Gravity Forms Fields Above
Plugin URI: https://gist.github.com/webaware/24e1bacb47b76a6aee7f
Description: move field labels from below to above fields in compound fields (e.g. Address, Name)
Version: 1
Author: WebAware
Author URI: http://webaware.com.au/
@link http://www.gravityhelp.com/forums/topic/change-position-of-sub-labels-on-advanced-fields
@link http://pastebin.com/CfFeP4Ux
@link http://pastebin.com/WCuDc0Eh
*/
/**
* make sure jQuery is loaded
*/
add_action('wp_enqueue_scripts', function() {
wp_enqueue_script('jquery');
});
/**
* register custom form scripts
* @param array $form
* @return array
*/
add_filter('gform_register_init_scripts', function($form) {
ob_start();
?>
jQuery(".ginput_container").has("input[type='email'],input[type='text'],input[type='password'],select,textarea").find("label").each(function() {
var e = jQuery(this), fielddesc = jQuery("<div>").append(e.clone()).remove().html();
e.siblings("input,select,textarea").before(fielddesc);
e.remove();
});
<?php
$script = ob_get_clean();
GFFormDisplay::add_init_script($form['id'], 'gravity-forms-fields-above', GFFormDisplay::ON_PAGE_RENDER, $script);
return $form;
});
@youri--

This comment has been minimized.

Copy link

commented Sep 16, 2014

Alternatively use only CSS:

.gform_wrapper  .ginput_complex span > input,
.gform_wrapper  .ginput_complex span > select { margin-top: 15px; }
.gform_wrapper  .ginput_complex span > label { margin-bottom: 45px; margin-top: -45px; }
@vdbkw

This comment has been minimized.

Copy link

commented Feb 10, 2015

Great, thanks! I really needed this function. 😃

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.