How do I set line height of text in the rich text editor?

As far as I can tell line height is not included in the saved paragraph themes. When dynamic information is populating text fields the text is really squished and looks terrible. I’ve seen the question posed on here a few times with no reply. Please somebody know the solution!!!

5 Likes

Same here.
It looks awful. Does someone know the solution?

Perhaps you will find here your answer…

https://www.wix.com/corvid/reference/$w/text/introduction#$w_text_introduction_formatting-text

@russian-dima I do not understand the context of where I would put this. I tried putting this code on my dynamic page but am getting “parsing error-unexpected token line”.

$w("#teacherBio").html = "<span style="line-height": 1.2">"</span>;


@missylombardozzi

This one works…

$w("#text1").html = `<span style="font-size: 3.5em"> ${$w("#text1").text}</span>`;

And this one too…

$w("#text1").html = `<h1 style = "color:red"> ${$w("#text1").text}</h1>`;

Try to do the same and modify for your needs.

@russian-dima When I try your code snippets in the code of my dynamic page nothing changes. Am I placing the code in the right place?

@missylombardozzi
I just tested it with a normal textfield → $w( “#text1” )

@russian-dima The code snippets do not work for text items that are linked to a database. The new settings are being overrided by the settings in the rich text editor.

Maybe, i do not know your set-up :sweat_smile:

@ Melissa Lombardozzi
Could you solve your issue?

@russian-dima dude can you show us how to apply the codes in here? This is where rich texts are edited from database.

@missylombardozzi Sorry to disturb you but I have the same issue and I tried so much code who didn’t work… Do you find a solution ?

Hey guys, since when do we no longer need line spacing? We have been waiting for a fix for over 6 months. @Ysrael (Wix) This thing is a game changer in terms of professional design requirements. What do you think?

Any solution? It’s been years, and many complaint threads, about how the database is buggy with text formatting if there are carriage returns between paragraphs. I tried the solution to “edit in the database directly” - that didn’t work. I tried a dev solution to “do the writing in a 3rd party app and paste it into the database”. That resulted in the editor changing it to P2 instead of P1. I’ve tried verifying P1 on the dynamic page, and P1 on the rich text data column, and still the text is changing font and changing spacing. Nothing I’m doing is working to maintain desired format, even as simple a task as P1 with line breaks above and below a bullet list. Ideas? Anyone?

Hi Maya,

I might have a solution for you. :slight_smile:

It does seem pretty silly that such a basic thing as line height settings continue to be missing from this feature. I was able to find a workaround using code applied to the specific dynamic text boxes that contain rich text.

  • Disclaimer: A friend helped me write this code and I am an absolute beginner on code, so I can’t give any useful advice on the code itself that I’ll paste below. Sometimes this code works, and then randomly, it seems to stop working. So take this with a grain of salt!

Here is the page I achieved line height success on. It’s a dynamic page that uses a rich text box populated by a database: https://www.arplawgroup.com/partner-profiles/samer-abdo

The ID for the text box that uses rich text is “text33”. I’ve applied a 1.7 line height to it using the following code:

$w.onReady(function () {
 
    $w('#dynamicDataset').onReady(() => {
          var myRichText = 
          $w("#text33").html.replace(/<p>/g, '<p style=\'line-height:1.7em\'>');
          
       $w("#text33").html = myRichText;
    })
});

Here’s a screenshot of the code below the rich text box it modifies:

Here it is on the live site with a nice 1.7 line height:

I know how frustrating this was for me, so I hope that helps!

2 Likes

For what it’s worth, I found a solution. When I edit the Rich Text using the table view, it did not work properly. But when I expanded the row to the Form View, using the double-arrows in the first column, and edited my Rich Text there, it has been working for me. *(Fingers-crossed it stays that way!) I hope this tip will help others.

Great Option - Thank you @ Courtney Mansell Design !

Still no solution? Tried options above, doesn´t work. Is it that hard to add some more options in the rich text editor (line spacing, color of text)?