XF 2.2 Change the color of links within posts

[Miri]

I would like to be able to change only the links within the posts. Is there a way to do this without adding extra.less code?

I was using this solution with extra.less for a dark theme:

/* This is the Light Blue color of the links in posts */

.message-content a.link--internal {

color: #4EA1D3;

}

I also tried "Style properties" but it changes all the links on the page.

Can you confirm that it can't be done without using custom code?

 

[James]

I thought there was a style property but maybe not. You will have to use CSS.

The above CSS only changes internal links (links to pages on your site) so a link to an external site wouldn't inherit that colour.

 

[Miri]

so a link to an external site wouldn't inherit that colour

Yes, that's true, not just that, but also the links for mentions, external links, embedded URLs, mailto type links... and that's exactly why I gave up on it.

 

[James]

I haven't got access to source code at the minute but it's not that difficult with CSS you just need to identify the selector.

Can you be specific? Do you want every link in a post body to be a specific colour or is it only certain links?

If you describe exactly what you're after I'm sure we can work the selectors out.

 

[mjda]

I don't think there is a way to change just post specific links, without using CSS, but I'm thinking this should work.

[data-template="thread_view"],[data-template="thread_view_type_article"]
{
    .message .message-content .message-body .bbWrapper a
    {
        color: #4EA1D3;
    }
}

 

[Miri]

[data-template="thread_view"] .message .message-content .message-body .bbWrapper a
{
    color: #4EA1D3;
}

To be added in extra.less right? If so it doesn't seem to work on the links.

EDIT: I tried deleting [data-template="thread_view"] and it works. I wonder if it should be fine without it.

 

[mjda]

To be added in extra.less right? If so it doesn't seem to work on the links.

EDIT: I tried deleting [data-template="thread_view"] and it works. I wonder if it should be fine without it.

Yes, it should go in extra.less. Are you sure you don't have anything below it that is maybe overriding it? It should be working, unless you have a custom style that changed something. I just tested it and it's working fine on my test site. If you want, DM me a link to a page where you're expecting it to work and it's not.

 

[Miri]

In short, @mjda was extremely kind in helping me find the solution.

It didn't apply to my template as it was "thread_view_type_article" instead of "thread_view." So, he provided the code:

[data-template="thread_view"],[data-template="thread_view_type_article"]

{

    .message .message-content .message-body .bbWrapper a

    {

        color: #4EA1D3;

    }

}

which works perfectly.

Thank you so much, @mjda, for your help.

 

[Paul B]

Use [data-template*="thread_view"] and it will cater for all thread types.

 

[mjda]

Use [data-template*="thread_view"] and it will cater for all thread types.

You always gotta 1-up me!

Seriously, though, I actually didn't even know that was something that could be done. Thanks!