Double lines in text editor

4 posts by 2 authors in: Forums > CMS Builder
Last Post: April 18, 2019   (RSS)

By rez - April 17, 2019 - edited: April 17, 2019

Hi. I know if you use shift-enter you can avoid double lines in the text editor.  However, a client is complaining that this is weird / not normal.

Is there a way to stop all double lines? 

If I understand correctly, it's actually wrapping lines in paragraph tags when you press enter. I do see this when inspecting the code in Chrome. 

I added the following to a wysiwyg_custom.css I created (found this solution in google) but the lines when I press enter that are wrapped in <p> tags, still have more space than the text lines within a paragraph. They still appear as double lines.

/* -----------------------------------------------------------------------------------
   Add CSS rules for your custom 'style_formats' classes here.
   See the following for an example.
   ----------------------------------------------------------------------------------- */
p {
    margin: 0;
    padding: 0;
    border: 0;
}

By daniel - April 17, 2019

Hi rez,

You're correct - by default in the WYSIWYG editor <enter> creates a paragraph break, whereas <shift+enter> creates a line break. From what I can see, the CSS you're using there should remove the spacing from around the paragraph elements; it's possible that the stylesheet is cached, so the first thing I'd check is if clearing your cache makes a difference.

Another option is to alter the behaviour, which is possible through TinyMCE configuration: https://www.tiny.cloud/docs-3x/reference/configuration/Configuration3x@force_br_newlines/

The configuration options you'd want to add to your wysiwyg_custom.php file are:

    force_br_newlines : true,
    force_p_newlines : false,
    forced_root_block : '',

This will reverse the default, so that <enter> creates a line break and <shift+enter> creates a paragraph break. 

Let me know if this helps with the issue, or if you have any questions!

Thanks,

Daniel
Technical Lead
interactivetools.com

By daniel - April 18, 2019 - edited: April 18, 2019

Hey rez,

Glad that worked for you! The <enter> behaviour is definitely platform-specific, and while I think it used to be more uniform, there's now some variation: Word adds paragraphs, whereas Open Office and Google Docs use line breaks. One small thing I'll add about the implication of switching from paragraphs to line breaks specifically in a web context is that line breaks can't be styled. Using two line breaks to show paragraphs means that that space will always be an exact double space. Whereas <p> tags allow you to alter the spacing with CSS, which can be useful if a site is re-designed or changes typography in the future, as "double space" isn't always proportional between different fonts. I personally like to preserve this flexibility, though I can certainly understand that there are cases where it's easier to simply use the line breaks.

Cheers,

Daniel
Technical Lead
interactivetools.com