One of the problem that I face with WordPress Plugins is that – the plugins can include their own CSS and JavaScript files. If you are not going to write custom CSS or override the styles offered by the plugins, then it’s fine (ah! not fine, if the developer has not written proper CSS selectors and used proper CSS techniques). But if you want to write your own custom styles, then there are couple of ways – you can either override all those CSS specifics (though it’s not going to be easy) or disable the CSS files that are included by the plugin and write your own.
Luckily WordPress allows to enqueue and dequeue styles or script files. So if you ever like to remove the scripts and stylesheets added by the plugin, then simply follow the below steps:
- View the source code of your webpage to find the CSS and script files that are loaded from the plugin directory. For example, let’s assume that you want to remove CSS files added by a ‘yet another related posts’ plugin, then you may find two link tags as below:
<link rel='stylesheet' id='yarppWidgetCss-css' href='//site.com/wp-content/plugins/yet-another-related-posts-plugin/style/widget.css' type='text/css' media='all'/>
<link rel='stylesheet' id='yarppWidgetCss-css' href='//site.com/wp-content/plugins/yet-another-related-posts-plugin/style/related.css' type='text/css' media='all'/>
- Note the css file names (widget.css and related.css) and go to plugin directory.
- Search for the files that’s enqueuing CSS files and find out the enqueue handle. For eg.,
wp_enqueue_style('yarppRelatedCss', YARPP_URL.'/style/related.css');
- The first parameter in the above function is the ‘handle’ which you can use it with wp_dequeue_style function. Now add the below code in theme’s functions.php file and change the ‘handler’ accordingly.
add_action('wp_print_styles', 'mytheme_dequeue_css_from_plugins', 100); function mytheme_dequeue_css_from_plugins() { wp_dequeue_style('yarppWidgetCss'); //Input handler as the parameter wp_dequeue_style('yarppRelatedCss'); //Input handler as the parameter }
You’ll have to do little bit of digging in the plugin directory to know the script and style handles, but you know it’s worth doing it.