Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I remove jquery from the frontside of my WordPress?

My wordpress site is a bit heavy to download. On the frontend, its including jquery unnecessarily. In my firebug it looks like:

jquery.js?ver=1.3.2

and

jquery.form.js?ver=2.02m

I don't need these to be included for me.

I'm happy for them to remain in the wp-admin, but I'd like them not to load on the frontend.

I have found the file I think which is loading them in wp-includes/script-loader.php but I'm not sure what to uncomment out or what to do to remove it completely for the front.

Is there a way to do this, removing jquery without ruining the back end?

like image 438
willdanceforfun Avatar asked Jul 21 '09 06:07

willdanceforfun


People also ask

Does WordPress already have jQuery?

The jQuery library itself comes bundled with your WordPress installation. That means it's already in place and ready to be called upon for use. With that in mind, let's take a look at how you can use jQuery on your WordPress site without a plugin.

How do I remove a script from a WordPress site?

Using a Plugin Head Cleaner is plugin for removing scripts and CSS from your WordPress header and footer. Simply download the plugin, go to Settings > Head Cleaner, and select the scripts you don't need output.

What jQuery version does WordPress use?

WordPress currently bundles jQuery version 1.12. 4, a version of the library released in 2016. It is also a version that supports Internet Explorer 6, 7, and 8.


8 Answers

JQuery may be being added by your theme. If your theme is adding it properly, it should be using the wp_enqueue_script() function. To remove JQuery, simply use the wp_deregister_script() function.

wp_deregister_script('jquery');

Removing JQuery for your whole site might cause some unintended consequences for your admin section. To avoid removing JQuery on your admin pages, use this code instead:

if ( !is_admin() ) wp_deregister_script('jquery');

Now only pages that are not admin pages will run the wp_deregister_script() function.

Add this code to the functions.php file in your theme directory.

like image 86
NerdStarGamer Avatar answered Oct 09 '22 02:10

NerdStarGamer


The correct method to completely remove a style or script is to dequeue it and deregister it. You should also note that front end scripts are handled through the wp_enqueue_scripts hook while back end scripts are handled through the admin_enqueue_scripts hook.

So with that in mind, you can do the following

add_filter( 'wp_enqueue_scripts', 'change_default_jquery', PHP_INT_MAX );

function change_default_jquery( ){
    wp_dequeue_script( 'jquery');
    wp_deregister_script( 'jquery');   
}

EDIT 1

This has been fully tested on Wordpress version 4.0 and working as expected.

EDIT 2

As proof of concept, paste the following code in your functions.php. This will print a success or failure message in the head of your site, back end and front end

add_action( 'wp_head', 'check_jquery' );
add_action( 'admin_head', 'check_jquery' );
function check_jquery() {

    global $wp_scripts;

    foreach ( $wp_scripts->registered as $wp_script ) {
        $handles[] = $wp_script->handle; 
    }

    if( in_array( 'jquery', $handles ) ) {
        echo 'jquery has been loaded';
    }else{
        echo 'jquery has been removed';
    }
}
like image 37
Pieter Goosen Avatar answered Oct 09 '22 02:10

Pieter Goosen


All the other solutions are now out of date as of wordpress 3.6

add_filter( 'wp_default_scripts', 'change_default_jquery' );

function change_default_jquery( &$scripts){
    if(!is_admin()){
        $scripts->remove( 'jquery');
        $scripts->add( 'jquery', false, array( 'jquery-core' ), '1.10.2' );
    }
}
like image 42
deweydb Avatar answered Oct 09 '22 03:10

deweydb


Wordpress adds this jQuery call via a template tag named <?php wp_head(); ?>, which appears in most themes, and is necessary for some plugins to work.

It could be annoying, not only because of loading, but because it might kill previously loaded jQuery, and might even get in the way of some plugins who try to load jQuery as well.

The quick fix is openning up the file header.php in your theme's directory, and adding:

<?php wp_deregister_script('jquery'); ?>

right before

<?php wp_head(); ?>

Or just combine them both into:

<?php wp_deregister_script('jquery'); wp_head(); ?>

A more technical explanation could be found here

like image 38
Adam Tal Avatar answered Oct 09 '22 04:10

Adam Tal


function my_init() {
    if (!is_admin()) {
        wp_deregister_script('jquery');
        wp_register_script('jquery', false);
    }
}
add_action('init', 'my_init');

It's correct - removes jquery library js. Code from other answers removes all js (even js that your installed plugins adds)

Tested on 4.3.1

like image 44
user25 Avatar answered Oct 09 '22 03:10

user25


WordPress 5 and above (Tested)

Remove the default jquery and add your jquery from folder or from CDN. Use only one, 'local' or 'cdn'

// Remove the WordPress default jquery
wp_deregister_script( 'jquery' );

// using a local file
wp_enqueue_script(
  'jquery', get_template_directory_uri() . '/lib/jquery-3.3.1.min.js','', '3.3.1', true
);

// using CDN
wp_enqueue_script(
    'jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js', '', '3.3.1', true
);

// $handle: 'jquery'
// $src: 
    // local: get_template_directory_uri() . '/lib/jquery-3.3.1.min.js'
    // cdn: '//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'
// $deps: '' (leave it empty)
// $ver: '3.3.1'
// $in_footer: true (boolean)

Syntax

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );
like image 34
Dexter Avatar answered Oct 09 '22 04:10

Dexter


Look into your theme files.

wp-content/themes/header.php

may include the .js files.

like image 35
Ahmet Kakıcı Avatar answered Oct 09 '22 03:10

Ahmet Kakıcı


In most of the Wordpress theme. jQuery used on admin panel (wp-admin) OR jQuery used in product page. to speed up. this will work. Tested on WP 5.0 jQuery only load if admin is logged in or its product page (its doesn't matter user logged in or not on product page. (jQuery load on product page))

function my_jquery_remove() {
    if ( ! is_admin() && !is_product() ) {
       wp_deregister_script('jquery');
       wp_register_script('jquery', false);
    }
}
add_action('init', 'my_jquery_remove');
like image 34
temp Avatar answered Oct 09 '22 03:10

temp