JQuery ve JavaScript dosyaları nasıl doğru şekilde dahil edilir?

Şu anda aşağıdaki kod ile yapıyorum:

function uw_load_scripts() {
    // De-register the built in jQuery
    wp_deregister_script('jquery');
    // Register the CDN version
    wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js', array(), null, false); 
    // Load it in your theme
    wp_enqueue_script( 'jquery' );
}
add_action( 'wp_enqueue_scripts', 'uw_load_scripts' );

Bu işe yarar, ancak bunu herkes gibi veya yönetici dışında herkes için yapmalıyım (böylece arka uç WordPress sürümünü kullanıyor mu?):

if (function_exists('load_my_scripts')) {  
function load_my_scripts() {  
    if (!is_admin()) {  
    wp_deregister_script( 'jquery' );  
    wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js', array(), null, false); 
    wp_enqueue_script('jquery');   
    }  
}  
}  
add_action('init', 'load_my_scripts');

Bu sürüm aslında çalışmıyor, WordPress jQuery sürümünü alıyorum, Google sürümünü değil.

Bu nedenle, WordPress'te bulunan jQuery kaydını tamamen kaldırmalı mıyım?

Ayrıca, kendi komut dosyalarımı (kaydırıcı komut dosyaları, modernizr ve kendi custom.js) nasıl doğru şekilde ekleyebilirim? Sanırım bunu function.php üzerinden yapmalıyım ve şimdi yaptığım gibi başlıkta değil, ama bunu nasıl yapacağımdan emin değilim.

İlk kural: çekirdekle birlikte verilen komut dosyalarının kaydını silmeyin ve sürüm değişikliği nedeniyle hiçbir Tema, Eklenti veya çekirdeğin kendisinin bozulmayacağından kesinlikle emin değilseniz, diğer sürümlerle değiştirmeyin. Gerçekten, bir çekirdek paketli komut dosyasının alternatif bir sürümüne kesinlikle ihtiyacınız yoksa , sadece çekirdek ile paketlenmiş olanı kullanın.

İkincisi, wp_enqueue_scriptssenaryo kaydı ve enqueue için içine kanca öneririz, yerine init. (Bu işler de initancak bir gelen play-güzel-ile-başkaları perspektifinden, en semantik doğru kanca kullanmak en iyisidir.)

Üçüncü olarak, kendi özel komut dosyalarınızı sıralamak için yukarıdakiyle aynı yöntemleri kullanırsınız:

<?php
function wpse45437_enqueue_scripts() {
    if ( ! is_admin() ) {
        $script_path = get_template_directory_uri() . '/js/';
        // Enqueue slider script
        wp_enqueue_script( 'wpse45437_slider', $script_path . 'slider.js', array( 'jquery' ) );
        // Enqueue modernizr script
        wp_enqueue_script( 'wpse45437_modernizr', $script_path . 'modernizr.js', array( 'jquery' ) );
    }
}
add_action( 'wp_enqueue_scripts', 'wpse45437_enqueue_scripts' );
?>

Sıralamanız gereken komut dosyalarını eklemeniz yeterlidir.

Umarım bu yardımcı olur, wp_enqueue_scriptsdaha fazla bilgi için kodeksine bakın .

1. Dont kullanmak initiçin enqueue . wp_enqueue_scriptsÖn uç şeyler ve admin_enqueue_scriptsyönetici tarafı için kullanın . Sen kullanabilirsiniz initiçin kayıt olsa komut.
2. Kanca wp_enqueue_scriptsyalnızca ön uçta (giriş sayfasında değil) tetiklenir - bu nedenle kontrol etmeniz gerekmez is_admin().

3. Aksi takdirde yapmak için özel bir nedeniniz yoksa, ben kayıt ve kullanan komut dosyaları kuyruk öneririm functions.phpiçin temalar veya aksi eklenti. Basitçe söylemek gerekirse:

    function myprefix_load_scripts() {
      // Load scripts here
    }
    add_action( 'wp_enqueue_scripts', 'myprefix_load_scripts' );

4. Amaç, bir kısa kod kullanıldığında bir komut dosyasını wp_enqueue_scriptsıralamaksa, yalnızca gerektiğinde sıralamak için kısa kod geri aramasında kullanmak isteyebilirsiniz (bu, 3.3'ten beri altbilgide yazdırır ).

5. Yönetici tarafında mevcut jQuery'yi yeniden kaydetmemelisiniz. Bir şeyi kırabilirsin: D.

6. Eklentiler olmamalıdır mevcut jQuery-kayıt yeniden.

7. JQuery'yi yeniden kaydetmenin artılarını ve eksilerini tartmalısınız. Örneğin, eski bir sürümü kaydederseniz bazı eklentileri bozabilir (belki şimdi değil, gelecekte ...)

Adil uyarı: WP'nin paketlenmiş jQuery sürümünün kendi lehinize silinmesi, özellikle WP sürümünü güncellediğinde işaret ettiğiniz sürümü değiştirdiğinizden emin olmak için fazla dikkatli değilseniz, sorunlara neden olabilir. Bu, jQuery'nin WP sürümü ile maksimum uyumluluk için sık sık (veya en azından en azından) eklentilerini yazan eklentiler için iki kat gider.

Bununla birlikte, ilk sürümünüz doğru - bağlı wp_enqueue_scripts. İkinci fonksiyonunuz bağlandı init, bu yüzden düzgün çalışmıyor.

Kendi komut dosyalarınızı benzer şekilde ekleyin:

function bbg_enqueue_scripts() {
    // You should probably do some checking to see what page you're on, so that your
    // script only loads when it needs to
    wp_enqueue_script( 'bbg-scripts', get_stylesheet_directory_url() . '/js/bbg-scripts.js', array( 'jquery' ) );
}
add_action( 'wp_enqueue_scripts', 'bbg_enqueue_scripts' );

Burada, jsgeçerli tema dizininizdeki bir dizinden komut dosyaları yüklediğinizi varsayıyorum ; doğru değilse URI parametresini değiştirin. Üçüncü parametre array( 'jquery' )bunun bbg-scriptsbağlı olduğunu jqueryve daha sonra yüklenmesi gerektiğini söylüyor. Daha fazla ayrıntı için bkz. Https://codex.wordpress.org/Function_Reference/wp_enqueue_script .

if (function_exists('load_my_scripts')) {  
function load_my_scripts() {  
    if (!is_admin()) {  
    wp_deregister_script( 'jquery' );  
    wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js', array(), null, false); 
    wp_enqueue_script('jquery');   
    }  
}  
}  
add_action('init', 'load_my_scripts');

Bu bir şey yapmayacak ... Şüphelisin demek istedin

if (!function_exists('load_my_scripts')) {

Örneğiniz, load_my_scripts işlevini yalnızca zaten varsa yükler (bu böyle olmaz ve yapmazsa bir hata oluşturur)

Performans nedenleriyle, bir CDN'den jquery ve diğer çekirdek js dosyalarını yüklemek istiyorsanız, çekirdek ve eklenti işlevlerinde kötü şeylerin olmasını önlemek için aynı sürümü yüklediğinizden emin olun. Bunun gibi:

$wp_jquery_version = $GLOBALS['wp_scripts']->registered['jquery-core']->ver;
$jquery_version = ( $wp_jquery_version == '' ) ? '1.8.3' : $wp_jquery_version; // fallback, just in case 
wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/'. $jquery_version .'/jquery.min.js', $jquery_version, false );
wp_enqueue_script('jquery');

Jquery yüklemek için tüm farklı yöntemleri kontrol ettikten sonra (sadece bu yazıda değil), bunların hiçbirinin bunların hepsini yapmadığını fark ettim:

1. Jquery'yi bir işlev kullanarak kaydedin (ve belki de enqueue edin), böylece eklentiler tarafından kullanılabilir.
2. Protokol göreli URL'si ile Google CDN'den yükleyin.
3. Google çevrimdışı ise yerel kopyaya geri dönüş.

Listede bunlardan bazılarını yapan çok sayıda alternatif sürüm var, ancak hepsi değil, bu yüzden versiyonumu zaten mevcut olan bazı yöntemleri tarama ve değiştirerek yazdım. İşte burada:

function nautilus7_enqueue_scripts() {

    // Load jquery from Google CDN (protocol relative) with local fallback when not available
    if ( false === ( $url = get_transient('jquery_url') ) ) {

        // Check if Google CDN is working
        $url = ( is_ssl() ? 'https:' : 'http:' ) . '//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js';
        $resp = wp_remote_head($url);

        // Load local jquery if Google down
        if ( is_wp_error($resp) || 200 != $resp['response']['code'] ) {

            $url = get_template_directory_uri() . '/js/vendor/jquery-1.7.2.min.js';
        }

        // Cache the result for 5 minutes to save bandwidth
        set_transient('jquery_url', $url, 60*5);
    }

    // Deregister Wordpress' jquery and register theme's copy in the footer
    wp_deregister_script('jquery');
    wp_register_script('jquery', $url, array(), null, true);

    // Load other theme scripts here

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

Bant genişliğinden tasarruf etmek ve sayfa her yeniden yüklendiğinde Google'a ping atmamak için Google CDN'nin Wordpress Transient API'sını kullanarak 5 dakika boyunca çevrimiçi olup olmadığını hatırlar.