Support

Account

Home Forums ACF PRO Wysiwyg editor height is too tall

Solving

Wysiwyg editor height is too tall

  • Hello!

    I would like to set default height of wyiswyg editor, it’s too tall.

    I want to set the height to e.g. “3 rows” for some of the editors such as contact information etc, that only need couple of rows.

    Thank you.

  • Hi @jari-pennanen

    Thanks for the post.

    It is possible to modify the dimensions of the WYSIWYG editor by hooking into the acf/input/admin_head action and passing some new styles.

    Please have a look at this example:

    add_action('acf/input/admin_head', 'lh_acf_admin_head'); 
    function lh_acf_admin_head() {
            ?>
            <style type="text/css">
    
            .acf-field-5639b8dd6170b .acf-editor-wrap iframe {
                height: 150px !important;
                min-height: 150px;
            }
            .acf-field-5639b8dd6170b .acf-editor-wrap .mce-fullscreen iframe{
                height: 700px !important;
                min-height: 700px;
            }
    
            </style>
            <?php
    } 
  • Just another vote here to get this put into the admin, its really inconsistent that you can set the height of a textarea box in the admin and not the height of this field.

  • Hi @arkid77

    Could you please open a new ticket so your request can be passed directly to the plugin author? You can open a new ticket here: https://support.advancedcustomfields.com/new-ticket. Also, please don’t forget to explain your request again.

    Thanks!

  • I figured out a better method which allows the field to be enlarged so it’s not a static height. This just removes the inline styling so I can set a height via CSS without the need for !important. Hope this helps someone else!

    
    // Remove ACF inline styles for WYSIWYG
    function my_acf_input_admin_footer() { ?>
    	<script type="text/javascript">
    		(function($) {
    			acf.add_action('wysiwyg_tinymce_init', function( ed, id, mceInit, $field ){
    				$(".acf-field .acf-editor-wrap iframe").removeAttr("style");
    			});
    		})(jQuery);	
    	</script>
    <?php }
    add_action('acf/input/admin_footer', 'my_acf_input_admin_footer');
    
  • Hi @inhouse ,

    Thanks a bundle for sharing the solution.

    This will surely assist someone else in the same situation.

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Wysiwyg editor height is too tall’ is closed to new replies.