Join the Webstudio community

Updated 2 months ago

Best practices to style rich text links in Webstudio?

At a glance

The community member is trying to style rich text links across their Webstudio site, but the default styling is not showing up in the builder. They have tried using CSS classes, but it's not working as expected. The community members discuss potential solutions like using a content embed or Markdown, but the original poster clarifies that they are not using external content. Eventually, one community member suggests adding a <style></code> tag to the custom code section of the project settings as a temporary solution, since Webstudio does not seem to have a built-in way to style rich text links across the site.</p>

Useful resources
I'm currently just using an HTML embed and styling a.w-rich-text-link and a.w-rich-text-link:hover but it doesn't show in the builder. Is there a better way to style these across the site?
2
M
C
O
11 comments
Maybe CSS? since it's an HTML embed
Yes, I’m using the CSS classes I listed above, since that’s the class Webstuido adds to rich text links. I just didn’t know if anyone else had a different way that made more sense when building in Webstudio.
Why not content embed?
Apologies if I didn't communicate what I was asking clearly. My question is how are Rich Text Links in Webstudio meant to be styled? Like when there's a text block and I link to something inside of it, it just uses the default styling. Most other visual builders I've used have had options to style the default look of these. Is the best option for styling these adding CSS in an HTML embed on each page or in the custom code of the project settings?
Attachment
CleanShot_2025-04-05_at_09.05.522x.png
And to clarify, I'm not using the content embed since it's not for text that's being pulled in from an external source. Just a few paragraphs for an about page for example
@Oleg Isonen The second video you linked shows a Rich Text Link being created at 1:37: https://youtu.be/0GoOe5D-hQk?si=yXHda9vRAqvugA_i&t=97 I want to know how to style that across the site. The only way I've found built in is to add a token to each Rich Text Link but that's not very practical and is impossible to do for a client in Content Mode.
Interesting case. I don't think we have a solution for it. We will think how to solve it.
Till there is a better solution, I've solved it by adding a <style> tag to the custom code part under project settings!
Attachment
image.png
Add a reply
Sign up and join the conversation on Discord