2.2 RSS Widget CSS “Fix”

One of the many things I’m not fond of in the newly released widgetized wordpress 2.2 is the RSS widget styling.

For those who don’t like the RSS icons, especially if you have a dark theme you can use this CSS to hide them.

.rsswidget img {
display: none;
}

I ended up using this:
.rsswidget img {
float: right;
}

And then replacing the rss icon the wordpress team included since the included image corners are white.

Actually, it looks like I’m going to have to write my own RSS widget or modify the wp core through a widget since they force the icon to be 14px with a white background.

<a class='rsswidget' href='$url' title='" . attribute_escape(__('Syndicate this content')) ."'><img style='background:orange;color:white;border:none;' width='14' height='14' src='$icon' alt='RSS' /></a> <a class='rsswidget' href='$link' title='$desc'>$title</a>

I really hate how this is forced on me.

Blog

May 20

View Comments

 

About the Author, Dan Cameron:

I'm the owner and solution engineer , a web solutions company that specializes in web development including WordPress.

I started my first blog in 2003 and transitioned to WordPress in 2004. Since moving to WordPress I've written a few plugins and themes for public consumption. Lately I'm busy engineering/building/coding and have only been able to share a few code snippets.

If you're in need of some web development, web design or custom WordPress plugins and/or themes contact me, I'll be happy to discuss it with you.

Read More »

  • http://freepressblog.org JaredB

    You should still be able to alter that just using your own custom CSS.

    If setting different sizing (try the !important modifier too) doesn’t work, then you could always hide that image inside the link ( a.rsswidget img {display:none;} ) and then put your own in as a background image for a.rsswidget, which (I believe) would effectively replace it with one that you could control the size of.

  • http://freepressblog.org JaredB

    You should still be able to alter that just using your own custom CSS.

    If setting different sizing (try the !important modifier too) doesn’t work, then you could always hide that image inside the link ( a.rsswidget img {display:none;} ) and then put your own in as a background image for a.rsswidget, which (I believe) would effectively replace it with one that you could control the size of.

  • http://freepressblog.org JaredB

    You should still be able to alter that just using your own custom CSS.

    If setting different sizing (try the !important modifier too) doesn’t work, then you could always hide that image inside the link ( a.rsswidget img {display:none;} ) and then put your own in as a background image for a.rsswidget, which (I believe) would effectively replace it with one that you could control the size of.

  • http://freepressblog.org JaredB

    You should still be able to alter that just using your own custom CSS.

    If setting different sizing (try the !important modifier too) doesn’t work, then you could always hide that image inside the link ( a.rsswidget img {display:none;} ) and then put your own in as a background image for a.rsswidget, which (I believe) would effectively replace it with one that you could control the size of.

  • http://freepressblog.org JaredB

    You should still be able to alter that just using your own custom CSS.

    If setting different sizing (try the !important modifier too) doesn’t work, then you could always hide that image inside the link ( a.rsswidget img {display:none;} ) and then put your own in as a background image for a.rsswidget, which (I believe) would effectively replace it with one that you could control the size of.

  • http://freepressblog.org JaredB

    You should still be able to alter that just using your own custom CSS.

    If setting different sizing (try the !important modifier too) doesn’t work, then you could always hide that image inside the link ( a.rsswidget img {display:none;} ) and then put your own in as a background image for a.rsswidget, which (I believe) would effectively replace it with one that you could control the size of.

  • http://dancameron.org Dan

    Having a background would work if you wanted every list item to have a background too, :)

  • http://dancameron.org Dan

    Having a background would work if you wanted every list item to have a background too, :)

  • http://dancameron.org Dan

    Having a background would work if you wanted every list item to have a background too, :)

  • http://dancameron.org Dan

    Having a background would work if you wanted every list item to have a background too, :)

  • http://dancameron.org Dan

    Having a background would work if you wanted every list item to have a background too, :)

  • http://dancameron.org Dan

    Having a background would work if you wanted every list item to have a background too, :)

  • http://freepressblog.org JaredB

    You should still be able to alter that just using your own custom CSS.

    If setting different sizing (try the !important modifier too) doesn’t work, then you could always hide that image inside the link ( a.rsswidget img {display:none;} ) and then put your own in as a background image for a.rsswidget, which (I believe) would effectively replace it with one that you could control the size of.

  • http://dancameron.org Dan

    Having a background would work if you wanted every list item to have a background too, :)

  • http://freepressblog.org JaredB

    Ah, I see now; that was a poor choice they made in terms of the markup. It is still possible to strip out those width/height parameters via a plugin if you want to, though.

  • http://freepressblog.org JaredB

    Ah, I see now; that was a poor choice they made in terms of the markup. It is still possible to strip out those width/height parameters via a plugin if you want to, though.

  • http://freepressblog.org JaredB

    Ah, I see now; that was a poor choice they made in terms of the markup. It is still possible to strip out those width/height parameters via a plugin if you want to, though.

  • http://freepressblog.org JaredB

    Ah, I see now; that was a poor choice they made in terms of the markup. It is still possible to strip out those width/height parameters via a plugin if you want to, though.

  • http://freepressblog.org JaredB

    Ah, I see now; that was a poor choice they made in terms of the markup. It is still possible to strip out those width/height parameters via a plugin if you want to, though.

  • http://freepressblog.org JaredB

    Ah, I see now; that was a poor choice they made in terms of the markup. It is still possible to strip out those width/height parameters via a plugin if you want to, though.

  • http://freepressblog.org JaredB

    Ah, I see now; that was a poor choice they made in terms of the markup. It is still possible to strip out those width/height parameters via a plugin if you want to, though.

  • http://www.club-penguin.org/ ClubPenguinCheats

    If setting different sizing (try the !important modifier too) doesn't work, then you could always hide that image inside the link ( a.rsswidget img {display:none;} ) and then put your own in as a background image for a.rsswidget, which (I believe) would effectively replace it with one that you could control the size of.

  • http://affordable-link-building-service.blogspot.com/ Link Building Service

    Great! But I am facing a different kind of problem. I am using RSS widget and Recent Posts Widgets. And here there is a bullet(looks like an arrow) coming left of each link. I am adding this code in my style css file.

    .rsswidget ul li {list-style: none;}

    But nothing is happening. Could you please tell me what can I do to remove it?

blog comments powered by Disqus