Opened 3 years ago

Closed 3 years ago

Last modified 2 months ago

#11928 closed enhancement (worksforme)

Recent Comments widget injects unconfigurable CSS (with !important)

Reported by: archon810 Owned by: azaozz
Priority: normal Milestone:
Component: Widgets Version: 2.9.1
Severity: normal Keywords: has-patch close
Cc: admin@…, admin@…

Description

I think this issue is long overdue as I saw people complaining about it for quite some time, myself included.

The Recent Comments sidebar widget, the one from WP core, actually adds inline non-configurable css into <head>:

<style type="text/css">.recentcomments a{display:inline !important;
padding:0 !important;margin:0 !important;}</style>

This is done in default-widgets.php.

I think it's really bad practice because

  • it's not configurable
  • it's not removable or overridable due to !important - when I tried to remove the filter, I found that it had a non-unique changing name WP_Widget_Recent_Commentsrecent_comments_style25

Somebody even created a blog post about this issue here but the solution didn't work for me due to, most likely, changes in later versions of WP.

Specifically, in my case, I need to override the padding property.

Nacin pointed out in [11891] that other widgets and the gallery might use the same tactics, to combat which I would imagine plugins like Cleaner WP Galler and such were created. The gallery issue might be kind of separate, so I'll leave it alone here.

Thoughts?

Thanks.

Attachments (1)

11928.patch (466 bytes) - added by Utkarsh 3 years ago.

Download all attachments as: .zip

Change History (9)

Utkarsh3 years ago

  • Cc admin@… added
  • Keywords has-patch added
  • Summary changed from Recent Comments sidebar widget (and probably others) inject unconfigurable CSS (with !important) to Recent Comments widget injects unconfigurable CSS (with !important)

I don't really see why !important declaration was being used here. I removed it, and noticed no change in the display.

  • Component changed from General to Widgets
  • Keywords close added
  • Owner set to azaozz
  • Type changed from defect (bug) to enhancement

The CSS is so the widget can look as presentable as possible, by default, in any widget-ready theme.

The declaration can be overridden quite easily via CSS, even with !important throughout.

It is also possible to remove the styles via a plugin. Drop this code into functions.php as an example:

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'  ) );
}

Marking this as an enhancement. Perhaps the CSS should be easier to remove or manipulate, but it's not a defect and it is configurable.

Thanks for the code, nacin. It's not as trivial as I thought it would be, without digging through low level WP implementation.

I'd say the style should be moved into the widget itself though.

  • Cc admin@… added

comment:5 follow-up: ↓ 7   nacin3 years ago

  • Milestone Unassigned deleted
  • Resolution set to worksforme
  • Status changed from new to closed

Going to worksforme this one.

We should however probably include this code in twentyten and style it on our own there.

See #12703

comment:7 in reply to: ↑ 5   ramiy2 years ago

Replying to nacin:

We should however probably include this code in twentyten and style it on our own there.

+1.

i agree, this should be in the style.css file.

Fortunately, if you are not using the Recent Comments sidebar widget, the code gets automatically removed from the HTML Head, but ONLY if you make sure the Recent Comments widget is deleted from all sidebars (including all inactive sidebars).

(I'm using WordPress 3.5.1, and a theme derived from the Underscore Theme. I saw this CSS code inserted in the HTML head. I was not even using the default WordPress comments, so I started looking for a solution. Then I discovered that the Recent Comments widget was part of an inactive sidebar.)

Note: See TracTickets for help on using tickets.