Reverso
Yeni Üye
- Kayıtlı
- 7 Gün
- Katılım
- 10 Eylül 2026
- Konular
- 12
- Mesajlar
- 13
- Tepkime puanı
- 1
- Puan
- 0
WordPress'te wp_enqueue_script() ile JavaScript Dosyası Nasıl Yüklenir?
WordPress sitelerinde JavaScript kodlarını doğrudan tema dosyalarının içerisine yazmak yerine ayrı bir JavaScript dosyası oluşturup WordPress'in yükleme sistemi üzerinden çağırmak daha düzenli bir yöntemdir. Bunun için kullanılan temel fonksiyonlardan biri wp_enqueue_script() fonksiyonudur.
Bu yöntem sayesinde JavaScript dosyasının hangi sayfada, hangi sırayla ve hangi bağımlılıklarla yükleneceği daha kontrollü şekilde belirlenebilir. Özellikle tema veya eklenti geliştiren kişiler için bu yapı oldukça kullanışlıdır.
- JavaScript Dosyasını Oluşturma
Örneğin:
Kod:
wp-content/themes/tema-adi-child/js/custom.jsBuradaki custom.js dosyası, sitede kullanılacak özel JavaScript kodlarını içerecektir.
Kodları tek bir dosyada toplamak, hem tema içerisindeki düzeni korur hem de ilerleyen aşamalarda JavaScript kodlarını yönetmeyi kolaylaştırır.
- JavaScript Dosyasını WordPress'e Tanımlama
PHP:
<?php
add_action('wp_enqueue_scripts', function() {
wp_enqueue_script(
'custom-script',
get_stylesheet_directory_uri() . '/js/custom.js',
array(),
'1.0.0',
true
);
});Burada `custom-script` JavaScript dosyasının WordPress içerisindeki benzersiz ismidir. İkinci bölümde ise dosyanın bulunduğu konum belirtilir.
Son parametre olan `true`, JavaScript dosyasının sayfanın alt kısmında, yani footer bölümüne yakın bir yerde yüklenmesini sağlar. Bu kullanım, JavaScript'in sayfanın ana içeriğinin yüklenmesini gereksiz yere engellemesini önlemeye yardımcı olabilir.
3. JavaScript Kodunu Dosyaya Eklemek
Artık `custom.js` dosyasının içerisine JavaScript kodlarımızı yazabiliriz.
Örneğin sayfadaki `.custom-button` sınıfına sahip butona tıklandığında bir mesaj göstermek istersek:
JavaScript:
document.addEventListener('DOMContentLoaded', function() {
const button = document.querySelector('.custom-button');
if (button) {
button.addEventListener('click', function() {
alert('Butona tıklandı.');
});
}
});Bu kod sayesinde sayfa tamamen yüklendikten sonra belirtilen buton bulunur ve butona tıklandığında mesaj gösterilir.
4. Neden wp_enqueue_script() Kullanılmalı?
JavaScript kodlarını doğrudan `header.php`, `footer.php` veya tema içerisindeki farklı dosyalara eklemek küçük projelerde mümkün olsa da zamanla karmaşık bir yapıya dönüşebilir.
`wp_enqueue_script()` kullanıldığında JavaScript dosyaları WordPress'in kendi sistemine dahil edilir. Böylece dosya sırası, bağımlılıklar ve sürüm bilgileri daha kolay yönetilebilir.
Örneğin başka bir JavaScript kütüphanesine ihtiyaç duyulduğunda bu bağımlılık da fonksiyon içerisinde belirtilebilir. Ayrıca dosyaya sürüm numarası verilmesi, tarayıcı önbelleğinden kaynaklanabilecek eski JavaScript dosyalarının kullanılmasını önlemeye yardımcı olabilir.
Bu nedenle WordPress'te özel JavaScript kullanırken dosyayı ayrı tutmak ve `wp_enqueue_script()` üzerinden yüklemek, daha temiz ve sürdürülebilir bir geliştirme yapısı oluşturur.
