Remove Plugin Stylesheets and Scripts in WordPress

By  on  

Many WordPress plugins implicitly inject stylesheets and JavaScript files into the page on each page load.  If you don't plan on custom-styling for elements created by the plugin, that's no problem...but you can get caught in a CSS specificity battle if you do intend custom styling.  If the plugin is created properly (which is sometimes a big "if" when it comes to WordPress plugins), you can programmatically tell these files not to load from within your given theme.

When scripts and styles are added properly, they use the wp_enqueue_style and wp_enqueue_script functions within the plugin files as such:

// Styles Format:  wp_enqueue_style($handle, $src, $deps, $ver, $media);
wp_register_style('pagination-style', plugins_url('style.css', __FILE__));
wp_enqueue_style('pagination-style');

// Script Format:  wp_enqueue_script($handle, $src, $deps, $ver, $in_footer);
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js');
wp_enqueue_script('jquery');

Those handle names are incredibly important, as within your theme's functions.php you'll be adding their counterpart calls of wp_dequeue_style and wp_dequeue_script functions:

// Get out of my page!
wp_dequeue_style('pagination-style');
wp_dequeue_script('jquery');

In the past I've argued that each plugin should make including their styles and scripts optional, but with these simple functions, I'm not as frustrated as I once was.  You'll need to dig into the plugin code to find their script and style handles, but it will be will worth it in the end!

Recent Features

  • By
    Create a Sheen Logo Effect with CSS

    I was inspired when I first saw Addy Osmani's original ShineTime blog post.  The hover sheen effect is simple but awesome.  When I started my blog redesign, I really wanted to use a sheen effect with my logo.  Using two HTML elements and...

  • By
    JavaScript Promise API

    While synchronous code is easier to follow and debug, async is generally better for performance and flexibility. Why "hold up the show" when you can trigger numerous requests at once and then handle them when each is ready?  Promises are becoming a big part of the JavaScript world...

Incredible Demos

  • By
    Introducing MooTools LinkAlert

    One of my favorite Firefox plugins is called LinkAlert. LinkAlert shows the user an icon when they hover over a special link, like a link to a Microsoft Word DOC or a PDF file. I love that warning because I hate the surprise...

  • By
    LightFace:  Facebook Lightbox for MooTools

    One of the web components I've always loved has been Facebook's modal dialog.  This "lightbox" isn't like others:  no dark overlay, no obnoxious animating to size, and it doesn't try to do "too much."  With Facebook's dialog in mind, I've created LightFace:  a Facebook lightbox...

Discussion

  1. Nice. This is an excellent solution that will update-proof, since the wp_dequeue is in the theme’s functions.php file. Questions: Should this be done for every plugin or should one check to see if they already have a wp_dequeue written in the plugin’s code? And if you perform this across the board will there likely be an error stating the duplicate wp_dequeue? Thanks for another great tip!

  2. Jorge Padron

    Question: If we disable the plugin style by adding a wp_dequeue in the theme’s functions.php, what happens when we (or the client) updates the theme? The theme’s functions.php would be replaced in the process and our wp_dequeue entries would disappear… right?

  3. Jason Haeger

    Jorge,

    That’s why theme changes should be made via child themes.

  4. doesn’t work…

    What am I doing wrong?:

    /* turns off widget/plugin css from being registered and printed in the head of the header.php */	
    function remove_unwanted_css(){
    	wp_dequeue_style('Tippy-css', plugins_url('http://ceracom.com/wp_ceracom/wp-content/plugins/tippy/jquery.tippy.css'));
    }
    add_action('init','remove_unwanted_css');
    

    HELP!

  5. rama

    Hi,

    I am new to web development. I want to remove prettyphoto Js from the Inovado theme in the website These js files came along with the theme. Can you help me in this issue.

  6. function remove_unwanted_css(){
    	wp_dequeue_style('Tippy-css');
    }
    add_action('init','remove_unwanted_css', 100);
    

    Ought to work, or at least that is what worked for me. You don’t need a URL to dequeue, and you may need to weight your action, I don’t really remember what the numbers mean but it’s order of execution and if you are dequeueing before the plugin queues it, well, you should understand.

  7. sorry, the last line I have as:

    add_action( 'wp_enqueue_scripts', 'remove_unwanted_css', 100 );
    
  8. What is the Exact code for theme’s functions.php file. please write here which is the correct function code for my blog

    • @umesh, use wp_enqueue_scripts not init

      add_action( 'wp_enqueue_scripts', 'modify_script_function_name', 100 );
      
  9. laviabel

    Hello,
    I have a conflit between a plugin and a theme i bought. When i desable theme’s css and js , the plugin works well, so that means it’s the theme the problem. I d’ to know if there is a way to desable theme only on specific pages ?

    Thank you.

  10. For those of you having trouble dequeuing styles, be sure not to include the appended “-css” that you see in the handle name within your function.

    • this- ! OMG I’ve spent the last hour thinking I need moar coffee because I couldn’t get my deque to work then i snipped off the -css and gone – thank you !

  11. hello every one im trying to remove this scripts from specific pages

    function remove_scripts(){
    wp_enqueue_script('TimeCircleJs jplayer' );
    wp_deregister_script('hover-intent placeholder' );
    wp_deregister_script('jquery comment-reply' );
    }
    add_action( 'wp_enqueue_scripts', 'remove_scripts', 100 );
    

    seems not to be working — HELP please

  12. To remove unused styles and scripts, I would recommend “WP Asset Clean Up” – https://wordpress.org/plugins/wp-asset-clean-up/ – it works for posts/pages and for the homepage.

  13. Very Good.

    But I tried to remove the plugin Revolution Slider and no success .

    But I do not know if the plugin- css -file -handle is -> rs -plugin -settings- css

    How to find the plugin- css -file -handle of a plugin?

    • Nico Galdo

      the handle is rs-icon-set-fa-icon-

      This is my code and not working yet :&

      function my_dequeue_styles() {
          // avoid load fa font with revolutio slider
          wp_dequeue_style('rs-icon-set-fa-icon-');
      }
      add_action( 'wp_print_scripts', 'my_dequeue_styles', 100 );
      //add_action( 'wp_enqueue_scripts', 'my_dequeue_styles', 100 );
      

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!