Hi Ryan,

I have cloned my old Joomla 3 website to Joomla 5 and created a new template using Cassiopeia.  Now I'm editing the articles in the Joomla 5 website and I notice that the line height in the Code tab is closer together than I like.  In the Joomla 3 website the line height is further apart.  I'm trying to figure out how to increase this line height that I see in the Code tab.  Can you help me?

I've compared the JCE settings between the Joomla 3 and Joomla 5 websites.  I see in Joomla 3 I have editor profiles > Editor Parameters > Filesystem > Text Editor > Theme set to Codemirror, but in Joomla 5 I see you changed the name of Codemirror to Default Light.  So that should be OK.

(Note: later in this message I note that changing my editor profile Theme from Default Light to anything else, has NO effect.  Even changing font size has no effect.  So something else may be wrong with my JCE setup.)

I don't see a line height option in the JCE global config or profiles.  So I'm looking through this article to see can I set an override in some CSS file:

https://www.joomlacontenteditor.net/support/forum/editor/111872-customize-code-editor-theme

It LOOKS like I can put a codemirror.css file or theme.css file in the folder media/jce/css/codemirror folder.  I tried creating this folder and putting both a codemirror.css and a theme.css file, but the result is no effect in that Code tab.

Here is my override CSS file contents - now I'm just guessing as to what the overrides should look like, based on what I can see in Chrome inspector -- it's not as clear as styling user.css for the Cassiopeia template.

/* Modify JCE "Code" tab styles - CEM March 2025 */
.cm-scroller {
    line-height: 1.6;
}
div.cm-content {
    line-height: 1.6;
}

Am I even close to what I need to change/adjust in my JCE Pro editor?  In my JCE editor profile, if I change the choice to something besides Default Light, like Cobalt or "Rose Pine Dawn" I see NO effect in the code tab.  Even after I save the profile setting, CLOSE my test article and reopen it again in JCE.

(I'm changing this: editor profiles > Editor Parameters > Filesystem > Text Editor > Theme)

As a test, even changing Font Size "Font Size for the editor window and gutter", from 16 to, say, 20, has no effect.

I am editing the default profile.  Using JCE Pro version 2.9.83

Hi Ryan,

I tried your latest JCE Pro 2.9.84 beta RC3 at my Joomla 5 website and I can see your new JCE Profile > Plugin Parameters > Code Editor > Line Height parameter.  It WORKS!  Thank you!  Some comments:

I'd like it if the short description for the Line Height included the units.  First try, I set line height to 2.0 like for double line height in CSS, but that caused the lines to overwrite each other in the editor, because line height is apparently in PIXELS.  After trying a line height setting of 20 I could see a sensible effect.  I changed it to a smaller value for actual use.  You could change the description to read "Line Height for the editor window and gutter, in pixels."

Next tip, more for your readers, I notice that a page refresh isn't enough to see the effect of the line height change (after making the change from another browser tab).  At least one time I had to log out then back in to Joomla to see the effect.

And FWIW, before your fix, I found a way in Chrome browser to create custom CSS that applied to certain pages.  In that custom CSS I set the line height for just JCE editor pages.  In my Firefox browser, for the same website, the line height came out tall enough, so no custom CSS required there.

Thanks again for the fix Ryan.

--Carol Mattsson  Web Developer and long-time subscriber to JCE Pro