Simple Social Icons
[resolved] Removing plugin's CSS (5 posts)

  1. Sridhar Katakam
    Posted 1 year ago #

    I am looking for a way to dequeue the plugin's CSS as the presence of !important is creating issues in being able to fully customize via custom CSS.

    I tried adding this code but it results in a fatal error.

    Does anyone have ideas other than directly editing the plugin's CSS file or forking it?


  2. Sridhar Katakam
    Posted 1 year ago #

    Got it.

    add_action( 'wp_enqueue_scripts', 'sk_disable_simple_social_icons_styles', 11 );
    function sk_disable_simple_social_icons_styles() {
    	if ( class_exists( 'Simple_Social_Icons_Widget' ) ) {
    		/** Dequeue icon styles */
    		wp_dequeue_style( 'simple-social-icons-font');

    Got help in IRC.

  3. Ron Rennick
    MultiSite Guru
    Plugin Author

    Posted 1 year ago #

    I saw your blog post via a retweet from Carrie Dils. Near the end you said

    If there is another reason I do not know of, I would love to be educated.

    The reason you will find !important used in widget CSS by plugin authors is

    - the markup around the widget is dependent on the theme
    - common widget elements are given default styling by the theme
    - in many instances the default styling has a more specific selector

    Ergo, the only recourse a plugin author has to ensure the widget is styled approximately correctly is using the !important.

    The third option you weren't aware of when you wrote the post is use a more specific selector in your style.css. Because you have a Genesis child theme that selector would be

    .site-container .sidebar .simple-social-icons ul li {
        margin-left: 10px !important;
        margin-right: 10px !important;
  4. Sridhar Katakam
    Posted 1 year ago #

    Thank you Ron.

  5. Gary Jones
    Posted 1 year ago #

    Ron, that is totally the wrong reason for using !important. Even as far back as 2010, better reasons were given for using it: http://www.smashingmagazine.com/2010/11/02/the-important-css-declaration-how-and-when-to-use-it/

    Any CSS in plugins should defer to styles in the theme, not try and mandate the styles with important. The class selector .simple-social-icons ul li is already going to be scoped enough for many cases to target just the list items inside the relative widget. Anything else is up to the theme author.

    You shouldn't try and force a "plug and go" approach on something with front-end output using !important, since that then forces theme customisers to employ crappy code to get around yours.

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Simple Social Icons
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic