Atualizar versão do jquery

24

Eu corro o WordPress versão 4.7.2. e usa o jQuery versão 1.12. Preciso atualizar esta versão para uma versão superior. Eu o substituí por uma nova versão antes, mas quando eu atualizo o núcleo do WordPress, ele é substituído pela 1.12 novamente. Como posso alterar a versão do jQuery que o WordPress usa permanentemente?

Siamak Ferdos
fonte

Respostas:

29

Aviso: você não deve substituir a versão principal do jQuery, especialmente no painel de administração . Como muitas funcionalidades principais do WordPress podem depender da versão. Além disso, outro plug-in pode depender dajQueryversão adicionada no núcleo.

Se você tiver certeza de que deseja alterar a jQueryversão principal , nesse caso, poderá adicionar o seguinte CÓDIGO no functions.phparquivo do seu tema ativo (melhor ainda, se você criar um plugin para isso):

function replace_core_jquery_version() {
    wp_deregister_script( 'jquery' );
    // Change the URL if you want to load a local copy of jQuery from your own server.
    wp_register_script( 'jquery', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
}
add_action( 'wp_enqueue_scripts', 'replace_core_jquery_version' );

Isso substituirá a jQueryversão principal e, em vez disso, carregará a versão 3.1.1do servidor do Google.

Além disso, embora não seja recomendado , você pode usar a seguinte linha adicional de CÓDIGO para substituir também a versão do jQuery wp-admin:

add_action( 'admin_enqueue_scripts', 'replace_core_jquery_version' );

Dessa forma, mesmo após a atualização do WordPress, você terá a versão jQuerydesejada.

Uma função um pouco melhor:

A replace_core_jquery_versionfunção acima também remove o jquery-migratescript adicionado pelo núcleo do WordPress. Isso é razoável, porque a versão mais recente do jQuery não funcionará corretamente com uma versão anterior do jquery-migrate. No entanto, você também pode incluir uma versão mais nova jquery-migrate. Nesse caso, use a seguinte função:

function replace_core_jquery_version() {
    wp_deregister_script( 'jquery-core' );
    wp_register_script( 'jquery-core', "https://code.jquery.com/jquery-3.1.1.min.js", array(), '3.1.1' );
    wp_deregister_script( 'jquery-migrate' );
    wp_register_script( 'jquery-migrate', "https://code.jquery.com/jquery-migrate-3.0.0.min.js", array(), '3.0.0' );
}
Fayaz
fonte
Você pode simplesmente remover a ação de functions.php se achar que isso quebra seu tema? Ele voltará à versão original do jQuery ou será uma alteração permanente?
Nick
1
Se a função de retorno de chamada da wp_enqueue_scriptsação atualizar apenas o jQuery e o jQuery estiver sendo enfileirado de outro lugar, a remoção da ação restaurará o jQuery original. No entanto, às vezes os navegadores armazenam em cache o CODE antigo, dependendo das configurações de cache do servidor. Portanto, você precisará limpar o cache do navegador depois de fazer isso para ver a alteração.
Fayaz
ok obrigado, eu só queria ter certeza de que não estraguei meu site antes de adicionar esta ação. Tive a sensação de que o que você disse é preciso, mas queria jogar pelo seguro.
Nick
1
Obviamente , isso não é permanente , pois essa alteração depende do próprio código, nada é salvo no banco de dados. Portanto, a remoção do CÓDIGO relacionado voltará ao estado antigo.
Fayaz
O script de migração para versões 3.x não funciona quando os plugins / temas esperam uma versão abaixo de 1.12. Mais sobre isso aqui: wordpress.stackexchange.com/a/244543/75495
cjbj 24/10/18
5

Eu desenvolvi um plugin para esse problema específico. O plug-in não mexe com o jQuery do WordPress, pois é carregado apenas no front-end. Veja: jQuery Manager para WordPress

Por que mais uma ferramenta do jQuery Updater / Manager / Developer / Debugging?

Como nenhuma das ferramentas do desenvolvedor permite selecionar uma versão específica do jQuery e / ou jQuery Migrate. Fornecendo a produção e a versão minificada. Veja os recursos abaixo!

Executed Executado apenas no front-end, não interfere no administrador / back-end do WordPress e no personalizador do WP (por motivos de compatibilidade) Consulte: https://core.trac.wordpress.org/ticket/45130 e https: // core. trac.wordpress.org/ticket/37110

Ligar / desligar o jQuery e / ou o jQuery Migrate

✅ Ative uma versão específica do jQuery e / ou jQuery Migrate

E muito mais! O código é de código aberto, para que você possa estudá-lo, aprender com ele e contribuir.


Quase todo mundo usa o identificador incorreto

O WordPress realmente usa o identificador jquery-core, não o jquery:

https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226

// jQuery
$scripts->add( 'jquery', false, array( 'jquery-core', 'jquery-migrate' ), '1.12.4' );
$scripts->add( 'jquery-core', '/wp-includes/js/jquery/jquery.js', array(), '1.12.4' );
$scripts->add( 'jquery-migrate', "/wp-includes/js/jquery/jquery-migrate$suffix.js", array(), '1.4.1' );

O identificador jquery é apenas um alias para carregar o jquery-core com o jquery-migrate

Veja mais informações sobre aliases: wp_register_script multiple identifiers?

A maneira correta de fazer isso

No meu exemplo abaixo, uso a CDN oficial do jQuery em https://code.jquery.com . Também uso script_loader_tag para poder adicionar alguns atributos da CDN.
Você pode usar o seguinte código:

// Front-end not excuted in the wp admin and the wp customizer (for compatibility reasons)
// See: https://core.trac.wordpress.org/ticket/45130 and https://core.trac.wordpress.org/ticket/37110
function wp_jquery_manager_plugin_front_end_scripts() {
    $wp_admin = is_admin();
    $wp_customizer = is_customize_preview();

    // jQuery
    if ( $wp_admin || $wp_customizer ) {
        // echo 'We are in the WP Admin or in the WP Customizer';
        return;
    }
    else {
        // Deregister WP core jQuery, see https://github.com/Remzi1993/wp-jquery-manager/issues/2 and https://github.com/WordPress/WordPress/blob/91da29d9afaa664eb84e1261ebb916b18a362aa9/wp-includes/script-loader.php#L226
        wp_deregister_script( 'jquery' ); // the jquery handle is just an alias to load jquery-core with jquery-migrate
        // Deregister WP jQuery
        wp_deregister_script( 'jquery-core' );
        // Deregister WP jQuery Migrate
        wp_deregister_script( 'jquery-migrate' );

        // Register jQuery in the head
        wp_register_script( 'jquery-core', 'https://code.jquery.com/jquery-3.3.1.min.js', array(), null, false );

        /**
         * Register jquery using jquery-core as a dependency, so other scripts could use the jquery handle
         * see /wordpress/283828/wp-register-script-multiple-identifiers
         * We first register the script and afther that we enqueue it, see why:
         * /wordpress/82490/when-should-i-use-wp-register-script-with-wp-enqueue-script-vs-just-wp-enque
         * /programming/39653993/what-is-diffrence-between-wp-enqueue-script-and-wp-register-script
         */
        wp_register_script( 'jquery', false, array( 'jquery-core' ), null, false );
        wp_enqueue_script( 'jquery' );
    }
}
add_action( 'wp_enqueue_scripts', 'wp_jquery_manager_plugin_front_end_scripts' );


function add_jquery_attributes( $tag, $handle ) {
    if ( 'jquery-core' === $handle ) {
        return str_replace( "type='text/javascript'", "type='text/javascript' integrity='sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=' crossorigin='anonymous'", $tag );
    }
    return $tag;
}
add_filter( 'script_loader_tag', 'add_jquery_attributes', 10, 2 );
Remzi Cavdar
fonte