Buğra Yazar

WordPress’te JavaScript dosyalarını Footer’a taşımak

WordPress Logo

Arkadaşlarınla Paylaş!

Google PageSpeed Insights’da WordPress sitemi kontrol ettiğimizde, JavaScript dosyalarımı sitenin altına taşımam gerektiğine dair bir uyarılar alırız. Peki bu işlemi nasıl gerçekleştiririz?

Ne yapmalıyız?

İlk olarak WordPress’in wp_enqueue_script tanımını biraz detaylandıralım. Kullanım yapısı genel anlamda şu şekilde :

<?php wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer ); ?>

Kısaca sırasıyla işlenen aracın adını, dizinini, varsa diğer eklentilerle ilişkilerini, versiyonunu ve Footer’da yer alıp almamasını belirtiyoruz.

function.php

Şimdi Function.php’yi açalım. Dosya içerisinde wp_enqueue_script diye arattığınızda aşağıdakine benzer yapılar göreceksinizdir.

wp_enqueue_script('bootstrapjs', get_template_directory_uri().'/js/bootstrap.min.js', array('jquery') );

Bu yapı temanıza ilgili dizindeki Bootstrap JavaScript dosyasını eklemekte. Ancak bunu </head>‘in üstüne yapmakta.

İlk işimiz array(‘jquery’) tanımını silmek olacak. Elimizde versiyon bilgisi de olmadığını varsayalım ve o kısmıda tırnakların içine bir şeyler yazmayarak boş bırakalım. Son olarak $in_footer tanımı için true değeri geçelim. Özetle üstteki wp-enqueue_script tanımını aşağıdaki gibi düzenleyelim.

wp_enqueue_script('bootstrapjs', get_template_directory_uri().'/js/bootstrap.min.js', false, '', true );

Şimdi dosyamızı kaydedip web sayfamızı kontrol edelim. Sizlerin de fark edebileceği gibi artık bootstrap.min.js<head> elemanını içerisinde değil, </body> nin hemen üstünde ekleniyor.

İşlem tamam.

Sonuç

Bu teknik sayesinde sadece JS dosyalarınızı değil, diğer tüm kalıp yapılarınızı Footer’a taşayabilirsiniz. Örneğin CSS dosyalarınızı aşağıya almak istiyorsanız wp_enqueue_style tanımı size yardımcı olacaktır. Aynı tekniği uygulayarak CSS dosyalarınızı da Footer’da tanımlanır hale getirebilirsiniz.

Arkadaşlarınla Paylaş!

Buğra Yazar

Startup Wordpress firma sahibi olarak 5 yıldır kurumsal firmalara WordPress danışmanlık hizmetleri vermekteyiz. Siz hayalinizdeki projeyi anlatın biz gerçekleştirelim.

Yazıyı Beğen

1 Yıldız2 Yıldız3 Yıldız4 Yıldız5 Yıldız (Henüz oy verilmemiş)
Loading...


Yorum Yazın

Bana Ulaşın

WordPress, SEO ve Reklam İşbirlikleri için aşağıdaki formu doldurun veya bana E-posta yazın.

mail: bugrayazar@gmail.com

skype: bugrayazar