Text vs. Classic Text Formatting

Hello. I have done some experimenting and read through several topics regarding how to format some “classic” versus new elements. Specifically, I am interested in changing the line height for my text elements.

To do this, I entered a line-height: 1.8; attribute in the Theme Options >> CSS editor. However, while this change seems to update “classic text” elements, but does not seem to change the new text elements. Unfortunately, my site had many classic text elements when Pro made the new Text element available. I like the new element very much; however I now have a combination of classic and new text boxes throughout my site.

So I have two questions:

  1. I want to change all text elements (classic and new) to a new line height; but from what I can tell, I can only do this globally for the classic text elements with the Theme Options >> CSS editor. Do I need to change the

    style attributes for each and every text block? Is there any easier way to globally change the new text element row height?

  2. Reading some other topics, I believe the proper way to insert text elements using the “new” text element is to define and use a “text” preset with the desired height? I’m hoping I don’t need to manually modify the CSS for every text element I create from this point forward, and that presets would be your recommendation. Can you confirm presents are the easiest way to do this moving forward?

Thank you.

Hey @Pritchard,

Both the Classic and the V2 Text elements have a common selector and that is the x-text. It sounds like you’re already using that since you’ve successfully applied a line height using through Theme Options > CSS. See the similar case in the screenshot below:

Referring to the screenshot, the text below the red text is a V2 element. Though the x-text targets them both, it won’t work for the V2 element because its options have a higher priority than the CSS.

What you could do to target both the Classic Text and the V2 Text is to set your declaration as !important.

Just note that the V2 option, the text color in this case, will no longer work.

This leads us to the Element Defaults of Template Manager. See the details at https://theme.co/apex/forum/t/template-manager/20364.

Using the Element Default, you can set 1.8 as the default line height of all V2 Text so you new additions will use that value. For your existing V2 Text, you’ll need to apply a preset (refer to the Template Manager Documentation).

The advantage of that is you can still set individual V2 Text options if you need to rather than forcing an option through CSS.

Hope that helps.

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