Sage 9 Visual Editor Issue

sage
1

Hey there,

I have an unusual issue while using Sage 9.

Basically paragraphs aren’t displaying correctly in the visual editor, they are just continuing on the same line. The code is being produced correctly if I look in the text editor, and the output on the front end post is correct. I can also see

tags being added to the HTML when I hit the return key.

The text cursor is also not showing before I type anything. Once I type it does show up.

An even stranger behaviour is that this issue only happens when the text is on one line, if the text goes onto two lines I can insert paragraphs and they display correctly in the editor.

I have disabled all plugins and the issue still occurs. I swapped to the default Wordpress theme and the issue resolved. I have also tried it in all browsers and the problem is cross-browser. I’m using Wordpress 4.8.2.

Any help would be greatly appreciated. The front end is fine, it’s just a little difficult not being able to see paragraphs being added.

Thanks

Rob

2

This is likely an issue with your front-end styles being applied to the editor, which is something that Sage does.

For example, a common issue is defining something like:

body {
    height: 100%;
}

This can result in the editor constantly expanding when editing a page/post.

You can override any issues via resources/assets/styles/layouts/_tinymce.scss or you can write something like:

body:not(#tinymce) {
    height: 100%
}

This would be within your other stylesheets and will ensure these do not apply to the editor.

I can’t help with the specifics of the layout issue without access but inspect your editor within your browser and see if you can narrow down the offending CSS rules.

2 Likes
3

Thanks for the reply. That was my first thought and I had a look through and couldn’t see anything.

But you triggered me to have a second look and I found I had

.content {
    @include make-row();
}

This was putting some flex box styling into the TinyMCE editor.

Thanks again.

1 Like