How to set Gallery Field height?

• papijo

• September 5, 2017 at 1:00 am

In my Gallery fields I only need to enter a couple of images. To save space on the posts/pages edit screen I would like to set the gallery field height to 210 px instead of the default 400px. I have tried to enter the following in my theme’s FUNCTIONS.PHP file.

function my_acf_init() {
	acf_update_setting('gallery_height', '210');
}
add_action('acf/init', 'my_acf_init');

But it does not work. Can you help?

• Keith Lock

• September 6, 2017 at 5:44 am

Perhaps something like the code below (change the ID)…

Note: you can target it using a Field Key or custom CSS ID

<?php
/* START: Changes height of Gallery Field */
function my_change_gallery_field_height() {
?>
<style type="text/css">
  #acf-field_59aefd2fd922c {
    height: 210px;
  }
</style>
<?php
}
add_action('acf/input/admin_head', 'my_change_gallery_field_height');
/* END: Changes height of Gallery Field */
?>

Let me know if that does it for you, and kindly mark as resolved if so!

• papijo

• September 7, 2017 at 12:12 am

Hi Keith and many thanks for your help which set me on the right track.
1.- You did not say (because this is self-evident to advanced users) WHERE to put your code. I found out that it goes in one’s current WP theme functions.php file. Maybe somewhere else as well?

2.- Your code works OK with the relevant gallery field ID.

3.- For that code to work with all gallery fields one can change it to:

<style type="text/css">
    .acf-gallery {
        height: 210px;
      }
    </style>

4.- Now that—thanks to you—I understand how the Wrapper Attributes Class and ID work I thought I would refine your solution by creating a .galleryheight210 style in my functions.PHP file and would apply it in my gallery field’s Wrapper Attributes Class. Unfortunately this does not work, because the Wrapper’s style is not applied in the right DIV or rather is over-written later on.

5.- There remains the question of my original attempt at a solution. In file advanced-custom-fields-pro\pro\fields\class-acf-field-gallery.php line 463 is this code:

// set gallery height
$height = acf_get_user_setting('gallery_height', 400);
$height = max( $height, 200 ); // minimum height is 200
$atts['style'] = "height:{$height}px";

which seems to refer to a “user setting”. My question is: where in the ACF interface (or in one’s theme function.php) can we SET that user setting? If we cannot set it, what’s the use of getting it?

• papijo

• September 7, 2017 at 6:35 am

I have just found a similar problem in this forum discussion.
The solution given by James @acf-support is the same as the one given by @keithlock.
Interestingly, re my point #5 above is silverdarling’s remark:

Good thing is that wysiwyg.php looks like its primed to go for adding wysiwyg height via admin interface.

This is similar to gallery_height being “primed” for setting, but again WHY is this not working?

• Keith Lock

• September 8, 2017 at 7:13 am

@papijo

Hey.. sorry for the late reply. I guessed you might know where to put the code because your original question had a function in it. My apologies. It could go in either a custom plugin or in your theme’s functions file as you figured out. I like to use a custom plugin, that way… if ever switching themes… my functions remain. A great way to kick off a new plugin is to use a free plugin called Pluginception. It makes it very very simple to get started… within seconds in fact.

As for your other statement… it looks like a user setting may be in future plans, just hasn’t found its way into the graphical interface yet. I can’t confirm that though. I’m happy though that you were able to find a reasonable workaround.

• armen

• September 28, 2019 at 7:31 am

Hi all.
In your functions.php add the code below:

// We hook the function to "show_user_profile" and "edit_user_profile"
add_action( 'show_user_profile', 'extra_profile_fields', 10 );
add_action( 'edit_user_profile', 'extra_profile_fields', 10 );
// And we updating custom user meta fields
add_action( 'personal_options_update', 'save_extra_profile_fields' );
add_action( 'edit_user_profile_update', 'save_extra_profile_fields' );

function extra_profile_fields( $user ) {
	$settings = get_user_meta( $user->ID, 'acf_user_settings', true );
?>

<h3><?php _e('Extra User Details'); ?></h3>
<table class="form-table">
<tr>
	<th><label for="gallery_height">ACF gallery field height</label></th>
	<td>
	<input type="text" name="acf_user_settings[gallery_height]" id="gallery_height" value="<?=esc_attr($settings['gallery_height']);?>" class="regular-text" /><br />
	<span class="description">Number.</span>
	</td>
</tr>
</table>
<?php
}

function save_extra_profile_fields( $user_id ) {
	if ( !current_user_can( 'edit_user', $user_id ) )
		return false;

	/* Edit the following lines according to your set fields */
	update_usermeta( $user_id, 'acf_user_settings', $_POST['acf_user_settings']);
}
// End

• armen

• September 28, 2019 at 7:52 am

Hi all.
In your functions.php add the code below:

// We hook the function to "show_user_profile" and "edit_user_profile"
add_action( 'show_user_profile', 'extra_profile_fields', 10 );
add_action( 'edit_user_profile', 'extra_profile_fields', 10 );
// And we updating custom user meta fields
add_action( 'personal_options_update', 'save_extra_profile_fields' );
add_action( 'edit_user_profile_update', 'save_extra_profile_fields' );

function extra_profile_fields( $user ) {
  $settings = get_user_meta( $user->ID, 'acf_user_settings', true );
?>

<h3><?php _e('Extra User Details'); ?></h3>
<table class="form-table">
  <tr>
    <th><label for="gallery_height">ACF gallery field height</label></th>
      <td>
	<input type="text" name="acf_user_settings[gallery_height]" id="gallery_height" value="<?=esc_attr($settings['gallery_height']);?>" class="regular-text" /><br />
	<span class="description">Number.</span>
      </td>
  </tr>
</table>
<?php
}

function save_extra_profile_fields( $user_id ) {
  if ( !current_user_can( 'edit_user', $user_id ) ){
    return false;
  }

  /* Edit the following lines according to your set fields */
  update_usermeta( $user_id, 'acf_user_settings', $_POST['acf_user_settings']);
}
// End