I want wrap all default widget into a div tag, so i can add a suffix class to define style for each widgets

<div class="suffix-class">
 // widget

And in widget form, we have a input field to input this class.

It like module of joomla.

What can we do ? override all default widget ?

  • 3
    What is a suffix class?
    – fuxia
    Jun 7, 2013 at 10:53
  • Why do you need to add a class? There should already be markup enough to target the widget with style rules.
    – s_ha_dum
    Jun 7, 2013 at 13:35
  • i want display it in different styles. and only change the class suffix instead of editing css
    – Chameron
    Jun 7, 2013 at 13:55

2 Answers 2


In the register_sidebar() call in functions.php.

Look for before_widget and after_widget and modify as appropriate. The code below is the default usage.

'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget'  => '</li>',

I see this uestion is kind of old, but it also doesn't seem to have been answered. For anyone who wants to do this, I don't know how to do it via the template/code but there is a Wordpress plugin that lets you do it http://wordpress.org/plugins/widget-css-classes/ . It works just like joomla so your widget will be like.

<div class="widget suffix-class">
 // widget

(Depending on your template) Hope this helps someone!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.