Text Editor: Line spacing

Hello everyone,

I downloaded and installed manually the 2.3.8 CMS xibo version.
It works well but I’ve a question:
In the text editor, there is a very large space between two lines.
Is it possible to adjust this value ? ( in a css file or in the editor plugin maybe ? )

I think this value is not important with classic resolutions like 1920*1080 but I’m working with small displays ( like 128px x 96px ) so every pixel is important if I want to able to show more than 2 lines of text.

Please can someone help me on this subject ? I tried to modify some css rules without success …

CMS Version

2.3.8 Version

Welcome to the community.

When using the text editor, Enter will open a new paragraph where as Shift+Enter will drop a single line. Do let me know if a Shift+Enter does not resolve this for you.

Thank you

Hello and Thank you for your reply.

Yes I saw on this forum that there were 2 ways for new lines creation.

I tried both, but unfortunately the line spacing with Shift + Enter is still too big for me.
Is this space parametrable ? with a css rule or directly in the editor plugin maybe?

Have a nice day.

You can toggle off the visual editor for the text editor and enter directly into the Main Template box. The following link gives examples of line heights to use:

I saw this possibility, but the persons who will use the editor have absolutely no knowledge in html and css.
That’s why I want to change this parameter directly in the code.
I’m hosting the CMS on a personal server so I’ve access to the source code, I just need to know which file to modify ^^

If you can help me with that.

Ah right I see, you would need to create a Theme and then create a css/client.css file which can be loaded in there: https://xibo.org.uk/docs/developer/themes

Oh I missed that.
Thank you, I will try this way and i will come back later to tell you if it works .

Have a nice day.

1 Like

Hello again !
Sorry for having beeing so long to come back.
As you suggest, I created a theme with css folder
Inside this folder I try to put a client.css file with this rule:

.cke_editable p{
margin:0;
}

But nothing changed.
I tried, as the documentation say, with the override.css file and the same css rule. You can see the result I have in the editor, in the picture below (1) Editor.
This is exactly what I want, lines with no space between them.

But when I save the message and go back to the preview, the rule I created is not use and I’ve the result in the (2) Preview picture below.
As you can see, the css is not keep when the message is saved.
And it’s the same result when the message is sent to the player as you can see below in the (3) Player picture.


So do you know how I can keep this changes when the message is save ?

Thank you for your help.
Have a nice day.

I think the .cke_editable class only applies whilst you are editing the layout inside CKEditor.

When you’re previewing, and when the Player shows it, that class won’t be there, and so your CSS doesn’t apply.

If you open the HTML file for that widget from your Player library, you’ll be able to see exactly the HTML generated and target your CSS accordingly.

Hello Alex,
Thank you for your reply and for these information.
I can adjust the rendering like that.

Thank you very much.

Have a nice day.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.