How to collapse long description field in admin?

Hi @grayhunter,

Thank you for contacting WooCommerce! We’re happy to help you with this.

Could you please provide us with a screenshot so that we can see what you are describing?

If you don’t already have a screenshot service installed, here are a few free options:

* https://snipboard.io
* https://skitch.com/
* https://getcloudapp.com/
* https://awesomescreenshot.com/

There is also a walkthrough guide here: https://en.support.wordpress.com/make-a-screenshot/

Thanks!

Best regards,
Taha

Sure, the long description field is marked by an orange arrow here: https://snipboard.io/TLqXNB.jpg

Ideally the field should be collapsible as the short description field. I believe people update pricing more often than long description.

Hi,

Thank you for your question and the screenshot, that is very helpful!

If I understood correctly, you want to limit the height of the product description editor area to a fixed height, because you want to easily reach the product price input by scrolling lesser. We’re happy to help you with this.

Can you please add the following snippet to your site and check your product administration page again? If you aren’t familiar with adding custom code to your site, here is some information as to how to do it. We recommend the free Code Snippets method.

You can view the snippet here:
?

add_filter( 'tiny_mce_before_init', function( $settings ) {

    $screen = get_current_screen();

    if ( $screen->is_block_editor() ) {
        return $settings;
    }        

    if ( ! in_array( $screen->post_type, ['product'], true ) ) {
        return $settings;
    }        

    $settings['height'] = '120';
    $settings['autoresize_max_height'] = '120';

    return $settings;
 } );

Let us know if it works!

Best regards,
Taha

• This reply was modified 2 years ago by tpaksu.

Thank you, but I would not limit the height of the field to a fixed height. Otherwise it would make it difficult to write something in the field and to insert images…
I would like to turn the field from a one with fixed height to a field which could be collapsed (like the short description field can do) – is that possible?

Or, as a plan B, it should work if we just move the long description field below, after all other fields (including the custom field section).

Please advise.

Hi @grayhunter,

Can you try this snippet and check if it works for you? It’ll append a button above the editor, which collapses the editor when clicked. And expands it when clicked again.

function add_inline_script() {
	global $post;
	if($post->post_type === "product" && $post->filter === "edit") {
		echo "<script>
			(function($){
				$(document).ready(function(){
					var button = $('<button id=\"collapse_editor\" type=\"button\">Show/Hide</button>');
					button.on('click', function(){ $('#postdivrich').toggle('hidden'); });
					button.insertBefore('#postdivrich');
				});
			})(jQuery);
		</script>\n";
	}
  }
  add_action( 'admin_footer', 'add_inline_script', 0 );

Let us know if it works!

Best regards.

@tpaksu That Is Great, Thank You! ??
The last request – is it possible to make the long description field/editor to be collapsed by default, please?

Yes, you can use this one:

function add_inline_script() {
	global $post;
	if($post->post_type === "product" && $post->filter === "edit") {
		echo "<script>
			(function($){
				$(document).ready(function(){
					var button = $('<button id=\"collapse_editor\" type=\"button\">Show/Hide</button>');
					button.on('click', function(){ $('#postdivrich').toggle('hidden'); });
					button.insertBefore('#postdivrich');
					$('#postdivrich').toggle('hidden');
				});
			})(jQuery);
		</script>\n";
	}
  }
  add_action( 'admin_footer', 'add_inline_script', 0 );

Glad to hear you got it working the way you needed.

@tpaksu Awesome! That’s what I wanted ?? Many thanks!