Sayfa Hızını Uçurun: Blogger Widget'larını Sadece Ana Sayfada Yükleme Rehberi

 Blogların açılış hızını en çok düşüren şey, her sayfada gereksiz yere yüklenen JavaScript ağırlıklı widget'lardır. Bu yazı, sitenin SEO ve performansını optimize etmeye odaklanıyor.

  •  Özet: Hakkımda, popüler yayınlar veya özel script'ler gibi bileşenleri Blogger'ın yerel koşul etiketlerini (conditional tags) kullanarak yazı sayfalarından gizleme ve sadece ana sayfada çağırarak performansı artırma yöntemi.

  • Öne Çıkarılacak Detaylar:

    • b:if cond='data:view.isHomepage' etiketinin güncel ve doğru kullanımı.

    • Yazı sayfalarındaki (post page) gereksiz DOM yükünü azaltarak Core Web Vitals (özellikle LCP ve CLS) skorlarını iyileştirme.

    • Eski tip Blogger kodları ile yeni sürüm kodlar arasındaki farklar.


    Blogger’da site hızını (özellikle mobil tarafta) optimize etmenin en etkili yollarından biri, yalnızca ana sayfada görünmesi gereken bileşenleri yazı sayfalarından tamamen arındırmaktır. Bu rehberde, Blogger'ın yerel koşul etiketlerini (Conditional Tags) kullanarak widget'ları nasıl manipüle edeceğimizi ve sayfa hızımızı nasıl artıracağımızı adım adım öğreniyoruz.

    1. Mantığı Anlamak: Koşul Etiketleri (Conditional Tags) Nedir?

    Blogger XML motoru, şablon içindeki elementlerin hangi sayfa türünde (ana sayfa, yazı sayfası, arşiv veya etiket sayfası) çalışacağını belirleyen harika bir mantıksal sorgu sistemine sahiptir.

    Eğer bir widget'ı veya script'i sadece ana sayfada çalıştırmak istiyorsak, Blogger'a şu emri veririz:

    "Eğer şu an görüntülenen sayfa ana sayfa ise bu kodları çalıştır; değilse görmezden gel."

    Bu işlem sadece görsel bir gizleme (CSS ile display:none yapmak) değildir. Kod seviyesinde bir engelleme olduğu için, tarayıcı yazı sayfalarında o widget'ın kodlarını hiç indirmez ve işlemez. İşte gerçek performans artışı burada başlar!

    2. Kullanacağımız Sihirli Kod Yapısı

    Blogger'ın güncel tema altyapısında ana sayfayı hedeflemek için kullanılan en kararlı koşul etiketi data:view.isHomepage ifadesidir.

    Bir kod bloğunu sadece ana sayfaya özel kılmak için şu yapıyı kullanırız:

    <b:if cond='data:view.isHomepage'> <!-- Sadece ana sayfada yüklenecek olan widget kodları veya scriptler buraya gelir --> </b:if>

    3. Adım Adım Uygulama: Widget'ı Sadece Ana Sayfaya Bağlamak

    Şimdi bu teoriyi pratiğe dökelim. Temanızdaki herhangi bir widget'ı (örneğin popüler yayınlar, özel bir HTML/JavaScript kutusu veya reklam alanı) sadece ana sayfada çalışacak şekle getirmek için şu adımları izleyin:

    Adım 1: Temanızın Yedeğini Alın

    Her teknik düzenlemede olduğu gibi, Blogger panelinizden Tema > Özelleştir butonunun yanındaki ok > Yedekle yolunu izleyerek şablonunuzun bir kopyasını bilgisayarınıza indirin.

    Adım 2: Hedef Widget'ı XML İçinde Bulun

    Temayı Düzenle (HTML Düzenle) ekranına gelin. Sağ üstteki "Widget'a Git" menüsünü kullanarak sadece ana sayfada görünmesini istediğiniz bileşenin adını seçin (Örn: HTML1, PopularPosts1).

    Adım 3: Koşul Etiketini Doğru Yere Yerleştirin

    Widget kodunun içine girdiğinizde, genellikle b:includable id='main' adında bir ana kapsayıcı görürsünüz. Koşul etiketimizi bu kapsayıcının hemen içine yerleştirmemiz gerekir.

    Orijinal Yapı Genellikle Şöyledir:

    <b:widget id='HTML1' locked='false' title='Ana Sayfa Slider' type='HTML'> <b:includable id='main'> <h5><data:title/></h5> <div class='widget-content'> <data:content/> </div> </b:includable> </b:widget>

    Sadece Ana Sayfada Çalışacak Şekilde Düzenlenmiş Hali:

        <b:widget id='HTML1' locked='false' title='Ana Sayfa Slider' type='HTML'>
          <b:includable id='main'>
            <b:if cond='data:view.isHomepage'>
              
              <h5><data:title/></h5>
              <div class='widget-content'>
                <data:content/>
              </div>
              
            </b:if>
          </b:includable>
        </b:widget>

        Önemli İpucu: Gördüğünüz gibi <b:if cond='data:view.isHomepage'> etiketini açtıktan sonra, widget içeriğinin bittiği yere de </b:if> kapatma etiketini ekledik. Böylece içerideki tüm HTML ve JavaScript sadece ana sayfada tetiklenecektir.

        4. Performans Sonuçları ve SEO'ya Etkisi

        Bu optimizasyonu özellikle ağır JavaScript kütüphaneleri kullanan widget'larınıza (Slider, hava durumu eklentileri, instagram akışları vb.) uyguladığınızda şu kazanımları elde edersiniz:

        • Düşük DOM Boyutu: Yazı sayfalarınızdaki HTML düğüm sayısı azalır, tarayıcı sayfayı çok daha hızlı haritalandırır.

        • Daha Az Engelleme (Blocking Time): Yazı sayfalarında gereksiz scriptler çalışmayacağı için Google PageSpeed ve Lighthouse testlerindeki Total Blocking Time (TBT) süreniz ciddi oranda düşer.

        • Mobil Kullanıcı Deneyimi: Sınırlı mobil veri ve işlemci gücüne sahip telefonlarda, makaleleriniz saniyeler içinde açılır. Bu da doğrudan hemen çıkma oranını (Bounce Rate) düşürür.

        Blogger tabanlı sitelerde hız rekorları kırmak imkansız değil; sadece hangi kodun nerede yükleneceğini iyi yönetmek gerekiyor. Ana sayfadaki vitrininizi süsleyen ağır bileşenleri yazı sayfalarından bu yöntemle temizleyerek, ziyaretçilerinize jet hızında bir okuma deneyimi sunabilirsiniz.

































        sayfa,hizlandirma,blogger