Daha önceki yazılarımızda WordPress içerik sistemi ile çalışan web sayfalarımızın daha hızlı yüklenmesi için neler yapılabileceği konusunda bazı ipuçları paylaşmıştık eğer kaçırmış olanlar varsa lütfen

1. WordPress Yüklenme süresi nasıl düşürülür Burada

2. WordPress Eklentilerinin yüklenme süresine olan etkileri Burada

3. Gzip sıkıştırması ile sayfa yükünü hafifletme Burada

4. First to byte etkisi Burada

5. WordPress te Temanın ağır yükünü hafifletme Burada

işte üstteki konularda eksik kalmış olan bir konuda ; hemen hemen tüm temalarda bulunan JavaScripts kodlarının header den footer kısmına alınması , yani sonradan yüklenmelerinin sağlanıp sayfa açılışını birhayli rahatlatma yöntemidir . Javascript : ziyaretçinin tarayıcısında çalışan dinamik bir programlama dilidir ve ziyaretçilerle etkileşim için , görüntülenen belge içeriğini değiştirmek için ... kullanılır , Javascript dosyalarının sondan yüklenmesi Google PageSpeed skorumuzu arttıracağı gibi sayfa yüklenme hızına da katkı sağlayacaktır .
Öncelikle javascript dosyalarının yüklenmesini sonradan yapmanın sayfa açılışına ne gibi bir etkisi oluyor onu görelim , aşağıdaki sayfayı ziyaret edelim

https://stevesouders.com/hpws/move-scripts.php

Scripts at the Top : Javascript dosyaları sayfanın HEAD kısmından yükleniyor
Scripts at the Bottom: javascript dosyaları sayfanın Footer denen son kısmından yükleniyor
görüldüğü üzere inanılmaz bir yüklenme farkı mevcut , zaten Google Page speed i kullanıp sayfamızı test edersek herhangi bir sıkıntı olduğunda bize ağır yüklenme ile ilgili verdiği ipuçlarında javascriptlerin sonradan yüklenmeleri gerektiği tavsiyesini okuyabiliriz , gel gelelim bu yöntem her wordpress temasında çalışmayabilir en basitinden bazı temalarda slideshow özelliği bulunur ve bu özellikte jQuery ve JavaScript in head kısmından yüklenmesini zorunlu kılar O sebeple aşağıdaki yöntemi deneyip , herhangi bir sıkınmtı çıkarsa eski haline döndürmek gerekir.

Javascript dosyaları Render Blocking dosyalar olarak bilinirler yani : dosya veya script tamamen kullanıcı tarayıcısında yüklenmeden diğer bilgi veya dosyaların yüklenmesine izin vermezler işte bu nedenle sayfa sonunda yüklenmeleri olası gecikmeleri engelleyecektir.

Javascript dosyalarını Footer den yükleten kodlar

Bu kodlar javascriptin < head > kısmından çağrılmasını durdurup Footer kısmından çağrılmasını sağlayacaktır bunun için aşağıdaki kodların tema dosyamızın içerisinde aşağıdaki yerde yeralan

wp-content/themes/Tema ismimiz/functions.php

functions.php dosyasına yapıştırılması gerekir tam olarak nereye derseniz dosya sonunda ?> diye bir işaret varsa onun hemen üzerine yapıştırabilirsiniz işte kodlar:

/ Custom Scripting to Move JavaScript from the Head to the Footer
 
function remove_head_scripts() { 
   remove_action('wp_head', 'wp_print_scripts'); 
   remove_action('wp_head', 'wp_print_head_scripts', 9); 
   remove_action('wp_head', 'wp_enqueue_scripts', 1);
 
   add_action('wp_footer', 'wp_print_scripts', 5);
   add_action('wp_footer', 'wp_enqueue_scripts', 5);
   add_action('wp_footer', 'wp_print_head_scripts', 5); 
} 
add_action( 'wp_enqueue_scripts', 'remove_head_scripts' );
 
// END Custom Scripting to Move JavaScript

Eğer üstteki kodlar sizde işe yaramazssa aşağıdaki kodları denyin

function rm_query_string( $src ){   
    $parts = explode( '?ver', $src );
    return $parts[0];
}

if ( !is_admin() ) {
    add_filter( 'script_loader_src', 'rm_query_string', 15, 1 );
    add_filter( 'style_loader_src', 'rm_query_string', 15, 1 );
}

sonrasında kaydedip functions.php dosyasını ftp den hostunuza atın hepsi bukadar eğer tema dosyanızda bozulma olduysa , temanız Mobil uyumlu değil demektir ve kodları kaldırıp eski haline getirin , eğer temada bozulma olmadıysa herşey yolunda ve işlem tamam demektir artık Javascriptler Footer kısmından yükleniyor olup tema açılışında gecikmeye sebep olma ihtimalleri ortadan kaltı demektir.

Üstteki gibi Hepsini değil tek bir Javascript dosyasını Footerden yüklemek isteyebilirsiniz bu gibi bir durumda aşağıdaki kodu  tema dosyamızın içerisinde yeralan functions.php dosyasına yapıştıralım

<?php

function add_this_script_footer(){ ?>

[YOUR JS CODE HERE]

<?php } 

add_action('wp_footer', 'add_this_script_footer'); ?>

[YOUR JS CODE HERE] - Bu kısma Footer e almak istediğimiz Javascript kodu gelecektir.Eğer ben bunları yapamam , benim yerime yapacak bir eklenti yokmu derseniz Burada yeralan "Scripts To Footer" eklentisini kullanabilirsiniz , Fakat öncesinde yedek almayı unutmayınız.

NOT: Üsttede belirtildiği üzere Her temada İşe yaramayabilir çünkü bazı tema yapımcıları zaten javascriptleri Footere almış olabilir O nedenle üstteki işlemden önce ve sonrasında yüklenme süreleriniz kontrol ediniz.