web-dev-qa-db-ja.com

フッターにコアjQueryをエンキューしますか?

私はこれをfunctions.phpファイルに入れていますが、jQueryをフッターに読み込むことができません。ただし、includesファイルはフッターに正常にロードされます。他に何をする必要がありますか?

function starter_scripts() {
    wp_enqueue_style( 'starter-style', get_stylesheet_uri() );

    wp_enqueue_script( 'jquery', '', '', '', true );

    wp_enqueue_script( 'includes', get_template_directory_uri() . '/js/min/includes.min.js', '', '', true );
}
add_action( 'wp_enqueue_scripts', 'starter_scripts' );
19
Desi

そのためには、まずjQueryスクリプトの登録を解除してから、もう一度登録する必要があります。あなたがjQueryを使用する場合はWordPressが付属しているなら、以下はあなたが探している機能です。

function starter_scripts() {
    wp_deregister_script( 'jquery' );
    wp_register_script( 'jquery', includes_url( '/js/jquery/jquery.js' ), false, NULL, true );
    wp_enqueue_script( 'jquery' );

    wp_enqueue_style( 'starter-style', get_stylesheet_uri() );
    wp_enqueue_script( 'includes', get_template_directory_uri() . '/js/min/includes.min.js', '', '', true );
}
add_action( 'wp_enqueue_scripts', 'starter_scripts' );

Google CDNホスト版のjQueryを使用している場合は、Google CDN URL用にこのコードを変更することをお知らせください。

19
Robert hue

登録解除と再登録の必要性を回避する別のオプションを次に示します。

/**
 * Move jQuery to the footer. 
 */
function wpse_173601_enqueue_scripts() {
    wp_scripts()->add_data( 'jquery', 'group', 1 );
    wp_scripts()->add_data( 'jquery-core', 'group', 1 );
    wp_scripts()->add_data( 'jquery-migrate', 'group', 1 );
}
add_action( 'wp_enqueue_scripts', 'wpse_173601_enqueue_scripts' );

このソリューション 模倣WordPressコアgroup1に設定することにより、WordPressがスクリプトを含めるかどうかを決定しますフッターであろうとなかろうと(コメントで@jgraupが指摘したように、1の理由はわかりませんが、少しarbitrary意的です)。

41
Matthew Boynes

より良い解決策:

add_action( 'wp_default_scripts', 'move_jquery_into_footer' );

function move_jquery_into_footer( $wp_scripts ) {

    if( is_admin() ) {
        return;
    }

    $wp_scripts->add_data( 'jquery', 'group', 1 );
    $wp_scripts->add_data( 'jquery-core', 'group', 1 );
    $wp_scripts->add_data( 'jquery-migrate', 'group', 1 );
}

なぜそれが受け入れられた答えIMOより良い

  1. 他のものがすでにそれと混同している可能性がある後の段階ではなく、非常に核心でそれを変更します。
  2. バージョン文字列はそのままで削除されません。
  3. スクリプトの登録抹消や再登録はしませんが、スクリプトが$footer = trueに登録される場合と基本的に同じグループ値を設定するだけです。

管理者にこれをしないことについて

プラグインがwp_headにインラインjqueryを追加する場合、その時点でjqueryがロードされていないと失敗するので、何百万ものサイトを編集して管理者のパフォーマンスを最適化しようとするまでは避けてください。これはフロントエンドにも当てはまるので、インラインのjQueryコードを使用して頭の中でjqueryを想定しているコード化されていないテーマやプラグインには注意する必要があります。

動作しないについて

依存関係にjQueryが含まれている他のスクリプトがヘッドにロードされている場合は、jQueryがそのヘッドのすぐ前にロードされることにも注意する必要があります。 wp_enqueueシステムが存在する理由であり、これは良くて予想されたことです。

16
NextGenThemes

この特定の問題のプラグインを開発しました。このプラグインは、フロントエンドでのみロードされるため、WordPress jQueryを混乱させません。参照: jQuery Manager for WordPress

なぜ別のjQuery Updater/Manager/Developer/Debuggingツールなのですか?

開発者ツールでは、jQueryやjQuery Migrateの特定のバージョンを選択できないためです。圧縮された縮小版/製品版と非圧縮版/開発版の両方を提供します。以下の機能をご覧ください!

frontフロントエンドでのみ実行されます。WordPress admin/backendおよびWPカスタマイザと干渉しません(互換性の理由から)参照: https://core.trac.wordpress.org/ticket/451 および https://core.trac.wordpress.org/ticket/3711

オン/オフの切り替え jQueryまたはjQuery Migrate

-jQueryおよび/またはjQuery Migrateの特定のバージョンをアクティブ化する

さらに多く!コードはオープンソースですので、あなたはそれを研究し、それから学び、貢献することができます。


ほぼ全員が誤ったハンドルを使用します

WordPressは実際にはjqueryではなくjquery-coreハンドルを使用します。

https://github.com/WordPress/WordPress/blob/f84ab5e19f0038a3abec71821c9b8f47a4272942/wp-includes/script-loader.php#L1017

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

jqueryハンドルは単にロードするエイリアスですjquery-core with jquery-migrate

エイリアスに関する詳細情報を参照してください: wp_register_script multiple identifiers?

正しい方法

以下の例では、公式のjQuery CDNを https://code.jquery.com で使用しています。また、script_loader_tagを使用して、CDN属性を追加できます。
次のコードを使用できます。

// 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 https://wordpress.stackexchange.com/questions/283828/wp-register-script-multiple-identifiers
         * We first register the script and afther that we enqueue it, see why:
         * https://wordpress.stackexchange.com/questions/82490/when-should-i-use-wp-register-script-with-wp-enqueue-script-vs-just-wp-enque
         * https://stackoverflow.com/questions/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 );
1
Remzi Cavdar
add_action("wp_enqueue_scripts", "myscripts");

function myscripts() { 
   wp_enqueue_script( 'jquery' , '', array(), true); //true for footer
   wp_enqueue_script( 'someScript-js', 'https://domain.com/someScript.js' , '', '', true );
}
0
samjco