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 and blogger. 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.