Support » Plugins » Hacks » Plugin styling, overriding themes, finding a balance.

  • I’m writing a plugin to be used by a wide variety of unknown themes (like most) and struggling with how to balance styling the plugin enough to look nice, while allowing the underlying theme styles to come through so it blends somewhat.

    Are there any style guidelines I haven’t been able to track down?

    I’ll be very specific in my css for styling only the plugin elements but I’m afraid if I’m not specific enough or resetting the elements (ul, li, p, etc…) I’ll have some unusual surprises down the road with themes with very unusual formatting.

    Thanks for any suggestions

Viewing 5 replies - 1 through 5 (of 5 total)
  • I think what many plugin authors do is to include very specific styles with the output, but does not include them in a stylesheet. If a style does not exist, it is obviously not applied, so: either the plugin user allows default to theme CSS (or even browse defaults), or adds their own specific rules…

    Thank you seacoast.

    I’ll probably just add a class to every element and avoid resetting the elements (OL, LI, etc) to avoid it affecting anything else within the content such as a post within the plugin.

    I would think about 95% of the support requests I get for my plugins is to do with CSS.

    As suggested by by seacoast, I also add lots of classes, usually prefixed by the plugin name, to the main elements. Avoid using common class names like ‘row’ etc. There are some badly behaved themes out there that do things like,

    .row:after {
    display: table;
    content: “”;

    which messes up tables completely.

    Which then brings us to the laborious and time consuming task of walking the user through changing the CSS. I really wish WP core had an option in admin to add custom CSS, so I could just say ‘paste this CSS’ into Admin->Appearance->CSS

    Instead I have to explain how to edit either the plugin’s or theme’s stylesheet. Of course these changes usually get overwritten during an update !

    I’d love to see some style guidelines for themes and plugins. Whether it’s prefixing the CSS classes and Ids or some other scheme, I’m open to suggestions too.

    I think having a custom CSS option in WP Core would be very useful to many theme and plugin authors.


    FWIW, we generally just tell people to install a custom CSS plugin – like Custom CSS Manager – it seems to work quite well :).



    Forum Moderator

    I really wish WP core had an option in admin to add custom CSS

    There are lots of custom CSS plugins than can be used for this – including Jetpack which has a custom CSS module. One trick that we do with eShop is to import a copy of the plugin’s default stylesheet into the wp-content/uploads folder (in an eshop_files folder, to be precise). Via the plugin’s on setting page, the user can opt to use this stylesheet on their site and can edit it to their heart’s content as it is never over-written in the plugin’s updates.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Plugin styling, overriding themes, finding a balance.’ is closed to new replies.