Prevent CSSJS loading when plugin is not used

admin管理员组

文章数量:1391969

I have a Wordpress theme (the7) that includes the Visual Composer plugin. This is good for my clients editing stuff in the back end, but it also adds unnecessary CSS and JS to every page load on the front end. How can I remove these?

The lines it adds are:

<link rel='stylesheet' id='js_composer_front-css'  href='[domain]/wp-content/plugins/js_composer/assets/css/js_composer.min.css?ver=5.0.1' type='text/css' media='all' />

<script type='text/javascript' src='[domain]/wp-content/plugins/js_composer/assets/js/dist/js_composer_front.min.js?ver=5.0.1'></script>

I found this question which gives a possible method, but I can't get it to work.

I tracked down where the specific CSS file is loaded from, it's in a class Vc_Base in this function:

public function enqueueStyle() {
    $post = get_post();
    if ( $post && preg_match( '/vc_row/', $post->post_content ) ) {
        wp_enqueue_style( 'js_composer_front' );
    }
    wp_enqueue_style( 'js_composer_custom_css' );
}

So I set up this in my functions.php:

function inf_remove_junk()
{
    wp_dequeue_style('js_composer_front');
    wp_dequeue_style('js_composer_custom_css');
    wp_dequeue_script('wpb_composer_front_js');

    // also tried this
    remove_action('wp_enqueue_scripts', array('Vc_Base', 'enqueueStyle'));
}

if (!is_admin()) {
    add_action('wp_head', 'inf_remove_junk');
}

The inf_remove_junk function definitely executes, but it doesn't remove the CSS. Does it need to hook into a different point or do something else?

I have a Wordpress theme (the7) that includes the Visual Composer plugin. This is good for my clients editing stuff in the back end, but it also adds unnecessary CSS and JS to every page load on the front end. How can I remove these?

The lines it adds are:

<link rel='stylesheet' id='js_composer_front-css'  href='[domain]/wp-content/plugins/js_composer/assets/css/js_composer.min.css?ver=5.0.1' type='text/css' media='all' />

<script type='text/javascript' src='[domain]/wp-content/plugins/js_composer/assets/js/dist/js_composer_front.min.js?ver=5.0.1'></script>

I found this question which gives a possible method, but I can't get it to work.

I tracked down where the specific CSS file is loaded from, it's in a class Vc_Base in this function:

public function enqueueStyle() {
    $post = get_post();
    if ( $post && preg_match( '/vc_row/', $post->post_content ) ) {
        wp_enqueue_style( 'js_composer_front' );
    }
    wp_enqueue_style( 'js_composer_custom_css' );
}

So I set up this in my functions.php:

function inf_remove_junk()
{
    wp_dequeue_style('js_composer_front');
    wp_dequeue_style('js_composer_custom_css');
    wp_dequeue_script('wpb_composer_front_js');

    // also tried this
    remove_action('wp_enqueue_scripts', array('Vc_Base', 'enqueueStyle'));
}

if (!is_admin()) {
    add_action('wp_head', 'inf_remove_junk');
}

The inf_remove_junk function definitely executes, but it doesn't remove the CSS. Does it need to hook into a different point or do something else?

• plugins
• css
• javascript
• performance
• wp-enqueue-style

Share Improve this question edited Apr 13, 2017 at 12:37 CommunityBot 1 asked Feb 3, 2017 at 18:38 DisgruntledGoatDisgruntledGoat 49222 gold badges55 silver badges99 bronze badges

Add a comment  | 

3 Answers 3

Sorted by: Reset to default 2

You need to use action wp_enqueue_scripts except wp_head like:

function inf_remove_junk() {
    if (!is_admin()) {
          wp_dequeue_style('js_composer_front');
          wp_dequeue_style('js_composer_custom_css');
          wp_dequeue_script('wpb_composer_front_js');
     }

}

add_action( 'wp_enqueue_scripts', 'inf_remove_junk' );

But it remove the scripts from front end.

1. I think on archive pages VC does not execute it's shortcode. So you can check is_archive() condition instead of is_admin().

2. Or you can check the shortcode from content and remove assets like:

   function inf_remove_junk() {

   // 1. Check shortcode exist in post content and disable scripts.
           global $post;
           if ( stripos($post->post_content, '[YOUR_SHORTCODE]') ) {
   
   // or
   
   // 2. Disable scripts on all pages except single page, post, custom Post etc.
   
           if ( ! singular() ) {
   
   // or
   
   // 3. Disable on archive, 404 and search page
           if ( is_archive() || is_404() || is_search() ) {
                 wp_dequeue_style('js_composer_front');
                 wp_dequeue_style('js_composer_custom_css');
                 wp_dequeue_script('wpb_composer_front_js');
            }     
   

   } add_action( 'wp_enqueue_scripts', 'inf_remove_junk' );

Also, For premium plugin support you need to contact plugin author for better answer.

I use WPBakery, but only with my own elements, so I wanted to remove exactly the same scripts/styles.

The solution of @maheshwaghmare only moved the scripts/styles to an other place for me.

With "wp_deregister_style" and "wp_deregister_script" it worked then:

// Remove WPB CSS & JS on frontend
function remove_wpb_js_css() {
    if (!is_admin()) {
        wp_dequeue_style('js_composer_front');
        wp_deregister_style('js_composer_front');
        wp_dequeue_script('wpb_composer_front_js');
        wp_deregister_script('wpb_composer_front_js');
    }
}
add_action( 'wp_enqueue_scripts', 'remove_wpb_js_css', 99 );

You need to make sure you dequeue scripts and styles after they are enqueued. Otherwise your code will appear to not be doing anything. In actuality, it is dequeueing the script properly, but it's being added again later.

You don't say what hook they're being enqueued on, but if it's wp_enqueue_scripts at the default priority, this should work by dequeueing them at a lower priority.

//* Dequeue scripts and styles
function wpse_106269_wp_enqueue_scripts() {
    wp_dequeue_style( 'js_composer_front' );
    wp_dequeue_style( 'js_composer_custom_css' );
    wp_dequeue_script( 'wpb_composer_front_js' );
}

//* Make sure we dequeue scripts and styles after they are enqueued
function wpse_106269_wp_head() {
  add_action( 'wp_enqueue_scripts', 'wpse_106269_wp_enqueue_scripts', 20 );
}

//* wp_head is only fired on public pages
add_action( 'wp_head', 'wpse_106269_wp_head');

本文标签： Prevent CSSJS loading when plugin is not used