Kategoriler
Kodlama

Kırık görselleri bulmak [jQuery]

jQuery ile bir sayfadaki kırık kullanılmayan görselleri kaldırmak veya yerine başka görseli göstermek.

Benim gibi eski blog sahibiyseniz muhtemelen sitenizdeki yıllar önceki sayfalarında birçok kırık görsel vardır. Çoğunlukla dışarıdan başka bir siteden eklenmiş olan bu kırık görselleri jQuery ile kontrol edip düzeltmemiz mümkün.

Kod:

(function($) { jQuery(document).ready(function() {
 $(".entry-content img").bind("error",function(){
  $(this).attr("src","https://wolkanca.com.tr/favicon-200x200.png");
 });
});})(jQuery);

Bu kod sadece .entry-content classı içerisindeki görselleri kontrol etmek için isterseniz aşağıdaki kod ile sitenin tamamını kontrol edebilirsiniz:

(function($) { jQuery(document).ready(function() {
 $("img").bind("error",function(){
  $(this).attr("src","https://wolkanca.com.tr/favicon-200x200.png");
 });
});})(jQuery);

“https://wolkanca.com.tr/favicon-200×200.png” burada sayfadaki kırık görsellerin yerini alacaktır.

Eğer kırık görsellerin yerine bir görsel koymak istemiyor ve komple görünmemesini isterseniz aşağıdaki kodu kullanabilirsiniz:

(function($) { jQuery(document).ready(function() {
 $("img").bind("error",function(){
  $(this).attr("style","display:none;");
 });
});})(jQuery);

Kodun yaptığı şey özetle; tarayıcının sayfadaki görsellerden hata bulunanları bildirmesi vesilesiyle bu hata bildirimine göre işlem yapmak. Normal açılan bir image dosyası hata vermeden gösterilecektir, hata veren gösterilmeyenler ise kodun direktifine göre işlem görecektir.

Kolay gelsin 🤘🏻

WOLKANCA

Volkan Yılmaz

Digital Marketing & WordPress & SEO volkan@volkanyilmaz.com.tr