CSS to show links in Content Views

[Hudsonpilot]

Hi, Can you help me with the CSS for showing links in Content Views?

For example, on the home page, in the post about Museum Food, there’s a text link on “special exhibit on food” that does not show in a different font color so it’s invisible as a link. I tried to add this CSS, but it didn’t work:

/* Link font color in content views posts. */
pt-cv-content, .pt-cv-content
:not(.pt-cv-readmore):not(style):not(script) {
color: ##9F161D !important;
}

Can you tell me what I’m doing wrong?

site: https://www.food280.com
X version: 6.5.6
wordpress version: 5.2.3

[christian]

Hey Steve,

Please contact the Content Views plugin support to learn how to style the links in their plugin.

It can’t be overridden by our theme because of the hard to override CSS rule which could be coming from a plugin option.

We can of course override that with a stronger selector. Our theme does have a root element ID and that is x-root. You add that in the CSS of the plugin and target the right element which for this case is the anchor tag. Here’s a rough sample:

#x-root #pt-cv-view-b900ed077a .pt-cv-content *:not(.pt-cv-readmore):not(style):not(script) a {
    color: red !important;
}

Please just note that the point of the code is to show you that our theme does have a root element ID you can use. We will not support the sample code and will not provide support for third-party plugins.

Hope that helps and thank you for understanding.

[Hudsonpilot]

Thanks for your help. I do not know enough about all this to understand the issue with the x-root, but the code you provided does work to provide a color to the links.

[friech]

Hi Steve,

It’s about CSS Specificity, the more specific your selector the better. Meaning, If two CSS rules apply to the same element, the one with specific selector wins.

Glad we could help,
Cheers!

[Hudsonpilot]

Thanks for explaining that. Content Views support was able to provide a very easy solution to my problem — simply clear the text color in the Content Views style options, which allows the body text to use the X theme default colors, including the color for links. No CSS required.

Thanks again. Your support team is fantastic.

[christian]

You’re welcome, Steve. That’s what I was talking about.