In the recent article, we have talked about register & enqueue Stylesheets and Scripts in WordPress and Genesis child theme.
However, sometimes.. we need to Deregister and Dequeue some stylesheet and scripts to remove unwanted files which is increasing the load time of the site.
Deregister and Dequeue works when you are trying to remove the existing stylesheet or script.
WordPress includes two functions which you can use in your functions.php file of a child theme to deregister and dequeue stylesheets from themes and plugins.
WordPress also includes Two functions for deregister and dequeue scripts from themes and plugins.
So, basically, there are total four functions in this article.
Deregister & Dequeue Stylesheets
We can Deregister a css file that was registered with wp_register_style()
wp_deregister_style()
and can, Dequeue the css file that was enqueued with wp_enqueue_style()
wp_dequeue_style()
wp_deregister_style( 'wpmenucart-fontawesome' );
Best way to do is to use hook it first and then remove it.
//* Remove wpemenucart fontawesome css
add_action( 'wp_enqueue_scripts', 'remove_wpemenucart_fontawesome_css’ );
function remove_wpemenucart_fontawesome_css() {
wp_deregister_style( 'wpmenucart-fontawesome' );
}
Example 2:- Simple Social icons CSS are loading using wp_enqueue_style()
so what we can simply use it
wp_dequeue_style( 'simple-social-icons-font' );
//* Remove simple social icons css
add_action( 'wp_enqueue_scripts', 'remove_simple_social_icons_styles', 11 );
function remove_simple_social_icons_styles() {
wp_dequeue_style( 'simple-social-icons-font');
}
Deregister & Dequeue Scripts
We can Deregister a js file that was registered with wp_register_script()
wp_deregister_script()
and can, Dequeue the js file that was enqueued with wp_enqueue_script()
wp_dequeue_script()
Note:- Make sure to read the function file of the theme or plugin to know “method” it is loading the .js file.
Example 1. I was looking for the theme which is using wp_register_script() to enqueue .js file and found “Thrivethemes” loading .js file using the same.
so we can remove it using
wp_deregister_script( 'thrive-appr-main-script' );
Best way to do is to use hook it first and then remove it.
//* Remove simple social icons css
add_action( 'wp_enqueue_scripts', 'remove_thrive_appr_main_script' );
function remove_thrive_appr_main_script() {
wp_deregister_script( 'thrive-appr-main-script' );
}
Example 2. WPmenuCart plugin have a .js script named wpmenucart-ajax-assist.js which refresh the cart after adding a product. Now, in one case, i have to remove this file.
Here in the screenshot, we can see, it is registered using wp_enqueue_script and so we will use wp_dequeue_script
Here, is the code to remove that .js file.
wp_dequeue_script( 'wpmenucart-ajax-assist' );
Best way to do is to use hook it first and then remove it.
//* Remove wpemenucart ajax_assist.js
add_action( 'wp_enqueue_scripts', 'remove_wpemenucart_ajax_assist' );
function remove_wpemenucart_ajax_assist() {
wp_dequeue_script( 'wpmenucart-ajax-assist' );
}
Conditional Tags:
Here is to remove the style or script on single post.
//* DeRegister or DEqueue Stylesheet or Script or Both on single 'Post'
add_action( 'wp_enqueue_scripts', 'remove_style_script' );
function remove_style_script() {
if ( is_singular('post') ) {
//wp_deregister_style( 'wpmenucart-fontawesome' );
//wp_dequeue_script( 'wpmenucart-ajax-assist' );
}
}
Change both the line with your preferred action.
When attempting to dequeue a script or css, It is always recommended to hook it after the script is enqueued, but before it’s printed. I have included the best way to do in both methods.
From this and recent article, we have learned…
Adding file using:-
1. wp_register_style (css)
2. wp_enqueue_style (css)
3. wp_register_script (js)
4. wp_enqueue_script (js)
Removing file using:-
1. wp_deregister_style (css)
2. wp_dequeue_style (css)
3. wp_deregister_script (js)
4. wp_dequeue_script (js)
These functions are not limited and can be found in Plugins and Themes both. It is recommended to check them at once to make sure you are doing it right. 🙂
Reference:-
More…
It is recommended to read
How To register & enqueue Stylesheets and Scripts