How to make a link within CMS rich text AND use multiple styles with rich text?

How do I make a link (or two) within rich text supplied by the CMS?

You can highlight text in a Rich text element, then set a link for it. :smiley:

Hmmmm. None of my rich text blocks populated with copy from the CMS will allow me to highlight any text within them…

I can highlight text in rich text blocks not connected to the CMS.

@CynicalKiddo just double checking the ‘highlighting’ is within the CMS/Collections editor as opposed to where you have dropped a Rich Text Element into a page? :grinning:

If so, maybe a page refresh?

Cheers

1 Like

try editing the Rich Text in either the CMS editor or through your Dynamic Collections manager

2 Likes

Ahhh-ha. I was trying to select the text while in the designer, not the CMS editor. So, I can select the copy to make a link within the CMS editor, BUT, I can’t seem style to links independently of the copy they live within whether in the CMS editor or designer…

Here is how to style your rich text elements:
http://help.webflow.com/article/how-to-style-rich-text-elements

1 Like

When it is a rich text block populated from the CMS, text is not selectable in the designer as shown in the tutorial…

Apologies if I’m being absolutely dense…argh…but I still can’t seem to select the links to style them independently…

try styling a rich text element and all its child elements in a static page.

Then go back to your dynamic template page and give that rich text element the same class name

1 Like

That was actually one of the first things I tried…It will apply one style to the entire block.

I also need to be able to style the text within the selected block in the screenshot…it seems that rich is just not very editable when be served by a CMS collection. Will I have to create a different text input for the “TEAM” headline and one for each team members role and name so they can be styled differently?

@cyberdave I see you’re online right now assisting us on the forum…can you take a look at this thread and offer any advice? Thanks!

Hello CynicalKiddo

As @PixelGeek said, you just need to edit the rich text class in a static page.

I’ll give you an example

Okay so I want this link inside the Rich Text field Blog text to have the font color of Yellow

What I’ll do is first go inside a static page (e.g Homepage)
Inside the static page I’ll add a rich text field and give it the same class name Blog text

In my example I want to change the link font color. To do so I need to create a link inside of the static rich text field.
I create the link by highlighting the text I want to be a link ( in this case “editing”) and then click the link button.

The link is now made, but it is still blue. To edit the style of the link, click on it and add the class All links
You can now style it however you want. (remember to nest it inside of the rich text field class)

After changing the font in the static page, it will now also show on the dynamic page.

And thats how you do it. This also works with other elements like heading, list etc.

TL;DR

  1. Make a static version of rich text field, with the same class.
  2. Change the desired element inside the class “All (element)” and nest it inside of the rich text field class.
6 Likes

Working. Awesome. Getting the hang of it!

Thank you sooooo much for making visual for me!

1 Like

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