Change the Twitter widget CSS on hosted WordPress
-
Hi,
I’m just wondering if there’s a way to change the CSS of the Twitter widget on a hosted WordPress. I’m looking to force all images on the widget monochrome.
http://www.doctorwhoarchive.com as you can see, everything else on the site is in black and white and the widget is the only thing with colour
Thanks for any help
The blog I need help with is: (visible only to logged in users)
-
I see what you mean, and I messed with it a bit, but the best I could do was to:
1. Make the images semi-transparent so the colour isn’t so glaring.
img.avatar {
opacity: 0.3;
filter:alpha(opacity=30);
}2. Next step was to put a dark grey background behind the image—but I couldn’t get it to happen because it’s an img tag and there’s no containing div we could apply a background to.
Removing the image altogether wasn’t working, because it leaves a gap I can’t seem to cut out with css.
Anybody else have any ideas?
-
Because of the way the Twitter Timeline loads content from an external URL, there isn’t a way to affect elements of that external content using CSS from our side.
If you could, there are some new CSS3 filters that are pretty cool, but they are new and only have support in the latest WebKit browsers (that means no support in Internet Explorer or Firefox yet). They’re pretty neat though. To switch an image to Black & White, you could apply:
-webkit-filter: grayscale(100%);Check out this tutorial for more info:
http://net.tutsplus.com/tutorials/html-css-techniques/say-hello-to-css3-filters/And here’s a page about browser support for filters (look at the CSS filter effects one at the end):
http://net.tutsplus.com/tutorials/html-css-techniques/say-hello-to-css3-filters/Sorry there’s not a way to apply them to third-party embedded content like the Twitter Timeline!
-
-
- The topic ‘Change the Twitter widget CSS on hosted WordPress’ is closed to new replies.