Merhaba dostlar,

Sitelerimze zamanla bir sürü eklenti yazı tipi vs. ekliyoruz. Peki bu eklediklerimizi sitenin her yüzünde kullanıyor muyuz ?

Örneğin: Sadece yazılarınızın başında veya sonunda kullanmış olduğunuz facebook paylaş butonlarını ana sayfada kullanıyor musunuz?

Sanırım kullanmıyorsunuz 🙂 Ben de öyle tahmin etmiştim.

Kullanmıyorsanız peki ana sayfanıza girenlerin facebook eklentisinin kodlarını yükletmesinin bir anlamı var mı?

Demek istediğimi umarım anlatabilmişimdir.

Bazen de dashicon.css gibi gereksiz style dosyaları kendini sitenin ön yüzüne yükletmektedir.

Bu javascript ve css kodları zamanla sitenizin açılış hızını olumsuz etkilemektedir.

Site açılış hızını etkileyen gereksiz kodları temizlemek için rehber hazırladım:

WordPresste  js ve css kodlarını nasıl iptal edebileceğinizi aşama aşama anlattım buyurun a dostlar.

WordPresste Js ve Css İptal Etme

1. Eklentiler yüklendiklerinde css ve js dosyaları ile beraber gelir sitemize yerleşirler. Önce bu dosyaları tespit edeceğiz.
   Bunun için aşağıdaki functions kodunu sitemizin functions.php sine gireceğiz. Bunun nasıl yapıldığını bilmiyorsanız tıklayın
   Vereceğim kod, sitenizi tarayıp kullanmış olduğunuz eklenti ve css lerin id lerin adını tespit edip sıraya diziyor.
   Kodumuz:       

   function shapeSpace_inspect_script_style() {
     
     global $wp_scripts, $wp_styles;
     
     echo "\n" .'<!--'. "\n\n";
     
     echo 'JAVASCRIPT (.js) DOSYALARININ ID si:'. "\n";
     
     foreach($wp_scripts->queue as $handle) echo $handle . "\n";
     
     echo "\n" .'CSS (css.) DOSYALARININ ID si:'. "\n";
     
     foreach($wp_styles->queue as $handle) echo $handle . "\n";
     
     echo "\n" .'-->'. "\n\n";
     
   }
   add_action('wp_print_scripts', 'shapeSpace_inspect_script_style');

   Bu kodu ekledikten sonra sitenizi açın, açık ise yenileyin.
   Sitede sağ tuşa basıp Kaynak kodlarına bakın. (Ctrl+U ya da basabilirsiniz)
   Şimdi orada sıralanan id leri görüyor olmalısınız.
   Bulamıyorsanız aramtmak için ctrl+f tuşuna basın ve tespit yazıp aratın.
   Kolay bulmanız adına kodun içine tespit diye alakasız bir yazı yazdım hehe.
   Aşağıdaki gibi bir görüntü görmüş olmalısınız.
   Buradaki id lerin isimleri önemli ikinci adımda işimize yarayacak…
   Id leri bir yere not aldıysanız bu kodu silebilirsiniz bile. Maksadımız id lerin ismini almaktı.

   Not!!! Göremiyorsanız Cache eklentisi tarzı eklentiler kullanıyorsunu demektir. bu durumda kodlarınız sıkışık gözükecektir. Eklentiyi iptal edip deneyebilirsiniz.
   

2. Id leri yukarıdaki kod ile tespit etmiştik. Gördüğünüz gibi kodumuz js ve css leri ayrı ayrı bize gösteriyor.
   Şimdi bu kodlardan işimize yaramayanları sitede yükletmemek adına hamle yapacağız.
   Yani istemediğimiz javascript ve css leri iptal edeceğiz.       

   /* Sitenin bütününde çalışır */
   add_action( 'wp_print_styles', 'css_ve_js_kaldirici' );
   function css_ve_js_kaldirici() { 
     
   //Alt taraf css için	
   wp_dequeue_style( 'dashicons' );
   wp_dequeue_style( 'hueman-font-awesome' );
   
   
   
   
   //Alt taraf js için
   wp_dequeue_script( 'jquery-fancybox' );
   wp_dequeue_script( 'quotescollection' );
   
   
   
   
   
   }
   /* Sitenin bütününde çalışır */

   Yukarıdaki kodda 2 css ve 2 de js iptal ettim.
   dashicon yazan kod genelde sitenin yönetici kısmındaki iconlarda işimize yarıyor.
   Yukarıdaki dashicon kodunu sitenin ön yüzünde çalışmaması için iptal ettim. Ama merak etmeyin panelinizde çalışacak.
   Dashicon hakkında daha fazla bilgi için tıklayın
   Meraklılar için özetle aşağıdaki gibi iconların çağırıldığı bir kod yığınıdır.
   
   Kodları kimse sitesinde kullanmıyor. Kullananlar varsa zaten iptal ederseniz bu simgeler yerine kare kod (Ž) çıkar anlarsınız.
   Diğer iptal ettiğim javascript kalıbı ise hueman font scripti yani benim kullandığım temanın içinde artislik olsun diye yüklenen artis yazıtipleri
   Css olarak ise göstermek adına fancybox u iptal ettim ve quotescollection isimli günün sözü eklentisinin script dosyasını iptal ettim.
   Siz kendinize göre deneyerek neleri iptal edeceğinize bakabilirsiniz.

3. Örnek olarak ben kendimde deneme maksatlı şu kodları yaptım sizler de kendinize göre iptal edeceğiniz kodları bu örnekteki gibi yazabilirsiniz.
   Dikkat ederseniz kodda style yazan kısım css script yazan kısım javascriptleri iptal eder!       

   /* Kaldırdıklarımız Adminde gözükür */
   add_action( 'wp_print_styles', 'css_ve_js_kaldirici' );
   function css_ve_js_kaldirici() { 
     
     
   wp_dequeue_style( 'dashicons' );
   wp_dequeue_style( 'fancybox' );
   wp_dequeue_style( 'ns-style-bar' );
   wp_dequeue_style( 'rh-checkboxes' );
   wp_dequeue_style( 'hueman-font-awesome' );
   wp_dequeue_style( 'quotescollection' );
   wp_dequeue_style( 'wp-pagenavi' );
   wp_dequeue_style( 'share-this-share-buttons-sticky' );
   wp_dequeue_style( 'quotescollection-block-random-quote' );
   wp_dequeue_style( 'quotescollection-block-quotes' );
     
   wp_dequeue_script( 'jquery-fancybox' );
     
   }
   /* Kaldırdıklarımız Adminde gözükür */

Ekstra olarak:

Sadece Yazı ve Sayfalarda Js ve Css İptal Edelim

Aşağıdaki kod ile sadece yazılarda kodların iptalini sağlarsınız. Yani anasayfada kodumuz çalışmaz.

/* Bu kod sadece yazı ve sayfalarda çalışır */
function yazida_css_java_iptali() {

    if( is_singular() ) {  

//Aşağıdaki kod js iptali için
wp_dequeue_script( 'jquery-fancybox' );
wp_dequeue_script( 'quotescollection' );   


//Aşağıdaki kod css iptali için
wp_dequeue_style( 'dashicons' );
wp_dequeue_style( 'hueman-font-awesome' );
 
    }
}
add_action( 'wp_enqueue_scripts', 'yazida_css_java_iptali', 99 );

Sadece Ana Sayfada Js ve Css İptal Edelim.

Aşağıdaki kod sitemizin anasayfasında çalışır, yazı ve sayfalarda çalışmaz.

Ters mantık ile giderek…

Yani ana sayfada çalışmasını istemediğimiz ama yazılarda çalışmasını istediğimiz materyalleri bu kod ile bloklayabiliriz.

/* Bu kod sadece yazılarda çalışır */
function yazida_css_java_iptali() {

    if( is_home() ) {  

//Aşağıdaki kod js iptali için
wp_dequeue_script( 'jquery-fancybox' );
wp_dequeue_script( 'quotescollection' );   


//Aşağıdaki kod css iptali için
wp_dequeue_style( 'dashicons' );
wp_dequeue_style( 'hueman-font-awesome' );
 
    }
}
add_action( 'wp_enqueue_scripts', 'yazida_css_java_iptali', 99 );

Kaynak: https://digwp.com/2019/03/disable-script-style-added-plugins/

Sorularınız olursa ben buralardayım 😉