WordPress.org

Ready to get started?Download WordPress

Forums

Plugin styling, overriding themes, finding a balance. (6 posts)

  1. hhins
    Member
    Posted 1 year ago #

    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

  2. Pioneer Valley Web Design
    Member
    Posted 1 year ago #

    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...

  3. hhins
    Member
    Posted 1 year ago #

    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.

  4. ianhaycox
    Member
    Posted 1 year ago #

    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:before,
    .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.

    Ian.

  5. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

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

  6. esmi
    Forum Moderator
    Posted 1 year ago #

    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.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.