Streaming live at 10am (PST)

Assigning tags to certain text within one collection field (Rich Text)


#1

I'm hoping this is a different question/answer than the many questions about how to style rich text elements that are part of a collection.

Here is my problem:
I am posting blog articles which use references to outside sources. What I'd like to do is use a superscript 1, 2, 3... to identify which reference was used for the quote/statement in the post. This is similar to using footnotes. What I am struggling with is how to make JUST the 1 in the text superscript without making the entire body of the post superscript.

Here is what I have done so far (Thanks to Waldo from Webflow support for getting me this far!):
I have added a rich text field
I have added a class to the RTF (Article_RTF)
I have added an H6 inside the RTF
I have added styled H6 elements nested under Article_RTF to be superscript-like: Size 9, position relative, 6px from bottom

Here is my problem:
Now that I have styled the RTF, I bind it to the collection.
But now I can't change _ just_ the 1 to an H6 because it changes the entire rich text field. (Likely because it's all the same tag. There's no way to break it up)

So, apparently I can uncheck the Get Text From in the RTF settings and the text from my collection will remain, and it is now editable in pieces, but I still can't get just the 1 to be an H6 without taking the nearest paragraph with it.
(And this has the consequence of adding the text to the template so it is visible on all of the collection pages. No bueno.)

What I'd like it to look like:

Right now it all shows as a one p tag:

Any thoughts/advice?


Here is my public share link: Public Link
-Open Pages
-Open Articles template

To see the articles, open the Articles Collection, and the one I've been working with is Celebrate Perio Success. You'll see 1's throughout the text of the Article Text field. Any help would be very much appreciated!


#2

You can't style the RTE once it's in a dynamic list. But that's ok. Drag another RTE outside of the list and give it the same class. Continue styling it the way you wanted, style your H1, etc...

Of course, to modify the content of your RTE, it's through the CMS panels, in the posts themselves.


#3

Hey @Samuel_Dowd

​After some testing I was able to get your desired effect but only by adding the superscript type style to text that's bolded within the paragraph text. That would mean that any paragraph text that's bolded within that Rich Text Element class would be super scripted.

​I made this project so that you can take a look at how I created those nested selector styles: https://preview.webflow.com/preview/rte-inline-test?preview=4e53bb72bdc21f74a0f3620ac2f0350f

​Right now within the Rich Text Elements, the Bold and Italicized styles are treated as span tags because heading styles are not inline spans. This is the current work around for now, once I have more information I will keep you posted.


#4

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