| Share |
The Problem
If you use the Recent Comments sidebar widget in your Wordpress installation, it's possible that you want to customize this widget's style.
You will quickly find, however, that as soon as you add the widget to your sidebar, it injects the following inline, hardcoded CSS into the containing page (using !important to make things worse):
<style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}</style>The code above comes from recent_comments_style() (found in wp-includes/default-widgets.php), which is in turn called by WP_Widget_Recent_Comments() in the same file (this is just an old-style PHP4 constructor – same as PHP5's __construct()), which is triggered when the Recent Comments widget is used:
add_action( 'wp_head', array(&$this, 'recent_comments_style') );
This leaves a bad taste in my mouth because:
- the style is automatically forced into any page that embeds the widget
- it uses !important to override any existing styles
- it cannot be configured from the widget
- this is a core Wordpress widget and not some widget added by a random plugin. Wordpress should not contain such bad practices.
After seeing this, I raised a new issue #11928 in the Wordpress bug tracker but in the meantime, of course, I could go and hack the default-widgets.php core file to solve this problem. That, of course, would be a horrible thing to do – the next upgrade could wipe my changes or result in a conflict (if upgrading via svn). In general, one should never need to modify core files.
The Solution
Fortunately, there is a solution that doesn't involve modifying core files. Remember that we are talking about Wordpress here, which gained its popularity due to the ease of customization.
Normally, we would just need to remove the recent_comments_style hook, which would prevent it from ever firing and injecting the CSS. In fact, somebody over at webstractions.com already took a crack at this approach with the following code, which may have worked for a while but doesn't anymore:
1 2 3 4 5 6 | function remove_wp_widget_recent_comments_style() {
if ( has_filter('wp_head', 'wp_widget_recent_comments_style') ) {
remove_filter('wp_head', 'wp_widget_recent_comments_style' );
}
}
add_filter( 'wp_head', 'remove_wp_widget_recent_comments_style', 1 ); |
This code doesn't work in the current version of Wordpress because recent_comments_style() belongs to the WP_Widget_Recent_Comments class, and we need a tiny bit more effort to get through to the object of that class.
The following snippet, suggested by Andrew Nacin in a comment to the bug I opened up, does the job and works in Wordpress 2.9.1:
1 2 3 4 5 | add_action('widgets_init', 'my_remove_recent_comments_style');
function my_remove_recent_comments_style() {
global $wp_widget_factory;
remove_action('wp_head', array($wp_widget_factory->widgets['WP_Widget_Recent_Comments'], 'recent_comments_style'));
} |
This code first gets access to the right object and then passes it to the remove_action() function, along with the right function name recent_comments_style. Stick it intoyour functions.php and it should do the trick.
And there you have it.
Artem Russakovskii is a San Francisco programmer, blogger, and future millionaire (that last part is in the works). Follow Artem on Twitter (@ArtemR) or subscribe to the RSS feed.
In the meantime, if you found this article useful, feel free to buy me a cup of coffee below.
beer planet is a blog about technology, programming, computers, and geek life. It is run by Artem Russakovskii - a local San Francisco geek who currently works at 
Artem loves commenting on other people's blogs and reading comments on his own, so go ahead and leave one.
Thanks for the article! I dropped the code into my theme's function file, but it doesn't seem to be working… I'm using Wordpress 2.9.2. Any thoughts/suggestions would be appreciated! I'm getting so frustrated with this style insert that I'm really tempted to try hacking the core wordpress file gah!
Update – maybe not quite as elegant a solution, le with an !important class of my own in the theme's css file. I had no idea that !important existed before but I'm definitely not a fan… and I really hope Wordpress can "enhance" the recent comments widget going forward because this was a big pain in the butt to fix!
Hrm, I'm using 2.9.2 and it's definitely working for me, as you can see by viewing the source.