Web sitenizin performansını artırmak ve kullanıcı deneyimini iyileştirmek istiyorsanız, görüntülerinizi optimize etmeniz önemlidir. Lazy loading (tembel yükleme) teknikleri, ziyaretçilerinize daha hızlı bir deneyim sunar ve sayfa yükleme hızını artırabilir. WordPress’te lazyload kodunu nasıl kullanacağınızı öğrenmek için bu rehberi takip edin.
Yazı İçeriği
WordPress Eklentilerini Kullanma:
WordPress’te lazy loading özelliğini etkinleştirmek için birçok eklenti bulunmaktadır. Örnek olarak, “a3 Lazy Load” veya “Lazy Load by WP Rocket” gibi eklentileri yükleyebilir ve ardından etkinleştirebilirsiniz. Bu eklentiler, görsellerinizi otomatik olarak lazy loading ile yüklemenize olanak tanır.
a3 Lazy Load Eklentisi:
WordPress panele giriş yapın.
Sol tarafta “Eklentiler” bölümüne gidin ve “Yeni Ekle” seçeneğine tıklayın ve “a3 Lazy Load” yazarak aramayı yapın.
Eklentiyi bulduktan sonra “Şimdi Yükle” ve “Etkinleştir” düğmelerini kullanarak eklentiyi etkinleştirin.
Lazy Load by WP Rocket Eklentisi:
WordPress panele giriş yapın ve Sol tarafta “Eklentiler” bölümüne gidin.
“Yeni Ekle” seçeneğine tıklayın ve “Lazy Load by WP Rocket” yazarak arama yapın ardından eklentiyi bulduktan sonra “Yükle” ve “Etkinleştir” düğmelerini kullanarak eklentiyi etkinleştirin.
Manuel Lazy Loading Kodunu Kullanma:
Eğer eklenti kullanmak istemiyorsanız, aşağıdaki adımları takip ederek manuel olarak lazy loading kodunu WordPress sitenize ekleyebilirsiniz.
functions.php Dosyasına Kod Eklemek:
WordPress yönetici paneline giriş yapın ve sol taraftaki “Görünüm” bölümünden “Theme Editor” (Temayı Düzenle) seçeneğine tıklayın.
Sağ tarafta “functions.php” dosyasını bulun ve dosyanın en altına aşağıdaki kodu ekleyin:
php
Copy code
function add_lazyload_script() {
echo ‘<script src=”https://example.com/path-to-your-lazyload-script.js” defer></script>’;
}
add_action(‘wp_footer’, ‘add_lazyload_script’);
Bu örnek kod, lazyload script’inizi eklemek için kullanılır. “https://example.com/path-to-your-lazyload-script.js” kısmını kendi script dosyanızın yolunu ile değiştirmeyi unutmayın.
İmaj etiketlerine Lazy Load Özelliği Eklemek:
WordPress’te, görüntülerinizi çağırdığınız <img> etiketlerine lazy load özelliğini eklemek oldukça kolaydır. Her bir görüntünün src özelliğini data-src ile değiştirerek başlayabilirsiniz.
Lazy loading, WordPress web sitenizin performansını artırmak ve ziyaretçilere daha hızlı bir deneyim sunmak için etkili bir yöntemdir. Yukarıda verilen adımları adım adım takip ederek lazy loading özelliğini WordPress sitenizde kolayca kullanabilirsiniz. Bu adımları izlerken dikkatli olun ve her zaman önce yedekleme yapmayı unutmayın.
