WordPress.org

Ready to get started?Download WordPress

Plugin Directory

Widget CSS Classes

Add custom classes and ids plus first, last, even, odd, and numbered classes to your widgets.

Why aren't the classes showing up in my widget?

You need to make sure you have an HTML element defined for before_widget and after_widget in your active theme's register_sidebar functions, usually located in your theme's functions.php (/wp-content/themes/yourtheme/functions.php).

This HTML element must have class and id attributes. This plugin will not work if before_widget and after_widget are blank.

Example:

register_sidebar( array(
    'name'          => 'Sidebar',
    'before_widget' => '<div id="%1$s" class="widget %2$s">',
    'after_widget'  => '</div>',
    'before_title'  => '<h2 class="widget-title">',
    'after_title'   => '</h2>'
) );

How do I add the CSS for my custom class?

There are two ways:

  1. Edit your theme's style.css file (usually located in /wp-content/themes/yourtheme/).

  2. Use a plugin such as Simple Custom CSS.

How I export the Settings?

You can export the Settings from Settings > Widget CSS Classes > Import/Export.

What should I do if I find a bug?

Visit the plugin website and leave a comment or contact me.

Requires: 3.3 or higher
Compatible up to: 3.9.1
Last Updated: 2014-3-30
Downloads: 46,482

Ratings

4 stars
4.9 out of 5 stars

Support

0 of 3 support threads in the last two months have been resolved.

Got something to say? Need help?

Compatibility

+
=
Not enough data

3 people say it works.
0 people say it's broken.

100,2,2
100,1,1 100,2,2 100,2,2
50,2,1
100,2,2 100,3,3
100,1,1
100,1,1
100,1,1
100,3,3
33,3,1
100,3,3