WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

What's the best way to include custom user styles in widgets? For example adjust colors for buttons, borders etc. without having the user to develop a complete new stylesheet.

share|improve this question
Can you clarify if you're talking about existing or custom widgets? – Brian Fegter Sep 25 '12 at 15:34

I can't really speak to best practice, since I'm relatively new to WordPress (~1 year). But I am a website developer and I have been hacking around various widgets trying to make them behave the way I want. Here are my top 4 irritations:

  • widgets/plugins that don't use wp_enqueue_style(). How can I get rid of your style if I can't dequeue it?
  • class names on every single element. CSS means cascading style sheets. Wrap your output in a single classed element and use inheritance to style the children. Not only is it easier to debug, it's a lot easier to read.
  • similarly, do you really need to assign an id to every element?
  • non-semantic markup.

That said, my preference for WYSIWYG styling is AJAX based. Create a form with all the options you're willing to deal with. Put it beside a version of the widget output. Each change to the form, immediately shows on the widget. When the user is satisfied with the look, he can save his options.

For guidance on where to store options and how to generate CSS, the code in the Suffusion theme (files suffusion-css-generator.php, suffusion-css-helper.php & functions.php/suffusion_generate_all_custom_styles()) seems fairly straightforward and sensible.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

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