Change hashtag text colour in Wordpress Widget?

[Saleemsaab]

Hi there. How do i change the colour of the hashtag text on my wordpress twitter feed? It’s the text indicated by the green arrows on attached screen shot. The website address is: https://nyumbanikwamama.co.uk/

Thank you.

[Saleemsaab]

Can anybody help with this please?

[andypiper]

Not sure where you’d add this in your Wordpress config, but it should be possible to add a CSS style rule that targets those links. Something like:

p.timeline-Tweet-text a {
    color: #00dddd;
}

[Saleemsaab]

Not sure where you’d add this in your Wordpress config, but it should be possible to add a CSS style rule that targets those links. Something like:

p.timeline-Tweet-text a {
color: #00dddd;
}

Thank you! I am using elegant themes “Extra” theme and there is a custom css section. I tried putting your code in there, but it didn’t seem to change the colour, do you have any suggestions? Thank you.

[andypiper]

Presumably that’s being overridden by the Tweet widget’s styling being loaded later than the Wordpress theme’s CSS. You’ll have to look at the hierarchy of your CSS being loaded. It’s hard to do that from here but I believe that CSS snippet should work, I tried it in the browser developer tools and it successfully did update the colour for the widget links.

[Saleemsaab]

Thank you for your help. I passed your comments on to the support team of the theme provider, they responded thus:

I checked your website, and it looks like there is no way to override that default styles which comes directly from twitter: https://platform.twitter.com/css/timeline.6ca4ddceb51c98199a0b1f03f7ae4215.dark.ltr.css

I placed css code directly into your head seaction of your website, it’s like that code is not even applied, I suggest you take this issue with the twitter support team since this is clearly a problem on how they load their files.

Please let them know that the css code used:
.timeline-TweetList-tweet .timeline-Tweet .timeline-Tweet-text a .PrettyLink-prefix,
.timeline-TweetList-tweet .timeline-Tweet .timeline-Tweet-text a .PrettyLink-value,
.timeline-TweetList-tweet .timeline-Tweet .timeline-Tweet-text a.link.customisable {
color: #00dddd;
}

Is placed in the section, and it should override their code because the css specificity in the above code is way higher than their own css specificity.

Since I placed the css code in the header of the theme, that code is present on FTTB (First Time To Byte), so it should override their own css codes.

I’m really sorry but I’m afraid this should be handled by their support team, unfortunately, I’m not familiar with how their plugin should work, but if so, looking at the plugin configuration, I see the links are set to be dark gray, which is not working either.

Thank you in advance

[benward]

Hi! Sorry for the confusion, but please don’t try to use raw CSS to change styles in the widgets. The HTML will change in the future, and the ways we sandbox the widgets also evolves as browsers release new capabilities.

You can override the link colour inside Tweet and timeline widgets but either adding a data-link-color="#cc0000" attribute to your embed code, or using the <meta name="twitter:widgets:link-color" content="#cc0000"> meta tag to set it globally for all widgets on a page.

Thanks,

Ben

[Saleemsaab]

Thank you so much for your help Ben. Your suggestion worked perfectly! But after 18 days, and 27 posts with 2 support staff from the theme provider and 7 posts over 12 days with 2 twitter support staff to fix it the problem i can’t help but think that there should surely be an easier way to make such a simple change?

[andypiper]