Problem with WYSIWYG editor

  • Resolved webrightnow

    (@webrightnow)


    4 years, 9 months ago

    Your current version of the theme causes an issue in the visual editor. This is related to the iframe containing the tinymce editor.

    Every time you click anywhere, or input any character within the visual editor, or even press any editor buttons above (basically any visual editor action at all) the height of the iframe is increased by 44px. I can see this in the browser console, there’s clearly a JS call somewhere that’s causing this. This causes continuous scrolling of the window, which makes editing extremely difficult.

    I debugged first by disabling all plugins, no change. I then switched to Twenty Twenty theme, problem gone, so it’s definitely your theme.

    I can’t work out where the error might be in your code, but please provide a solution asap (as a code edit, not an update, as I’ve already heavily customised the theme and I can’t update it).

    The bug is making the visual editor virtually unusable at the moment and I can’t put the site in the hands of my client until this is fixed. Thanks.

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter webrightnow

    (@webrightnow)

    I should add that this is happening in the Classic Editor, not the Block Editor.

    Thread Starter webrightnow

    (@webrightnow)

    I temporarily fixed the problem by adding this code to functions.php:

    /**
 * Fixes the theme bug that increases editor height on every action
 */
add_action( 'admin_head', 'custom_wp_admin_style_head' );
function custom_wp_admin_style_head() { ?>
<style>
	iframe#content_ifr {
    	max-height: 500px!important;
	}
</style>
<?php }

    It’s a quick and dirty solution but I’d prefer a more permanent one if it can be provided, thanks.

    Hi,

    Please delete the CSS code in the file
    /wp-content/themes/onepress/editor-style.css line 7, 28

    height: 100%

    Then clear the cache and check the problem again. It will help you to fix the problem with the editor when editing your post/page.

    Thread Starter webrightnow

    (@webrightnow)

    Hi Nguyen,

    I tried the fix but it didn’t work unfortunately. The bug is not related to a static CSS style, the height change is applied dynamically to the iframe style and I can observe it happening in the console: I press any button, or even resize the window, and the height of the iframe element is dynamically increased by 44px. Almost certainly a JS call somewhere.

    See https://webrightnow.co.uk/videos/bug.mp4 for a video capture of the bug.

    Thanks

    Thread Starter webrightnow

    (@webrightnow)

    For anyone else having this problem, I was finally able to solve it by unticking “Additional settings: Enable full-height editor and distraction-free functionality” in the Screen Options settings. I had no idea that was even there, why it was enabled and why it seems to conflict with this theme, but unticking it makes everything work perfectly.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Problem with WYSIWYG editor’ is closed to new replies.