Eklentisiz BreadCrumb Navigation Göstermek

WordPress Dünya’daki en çok kullanılan açık kaynak kodlu gelişmiş bir içerik yönetim sistemidir. Gelişmiş yapısı ve eklentileri sayesinde pek çok özelliğe sahip olabilen WordPress, SEO konusunda da bu özellikleri sayesinde kolayca adapte olabilmektedir. Breadcrumb NavXT eklentisi ile, SEO için gerekli olan navigasyon yapısı sağlanabiliyor. Ancak, ek kodlamalar ve sorgular sitenin yavaş çalışmasına sebep olmaktadır. Bu sebeple, kolay birkaç kod yardımıyla, eklentisiz breadcrumb navigasyonunu sitelerinizde kullanabileceksiniz.

Temanızın single.php dosyasına aşağıdaki kodları, navigasyon menüsünün gösterilmesini istediğiniz yerine yapıştırın.

<ul id=”crumbs”><li><a title=”SEO Hocası” href=”/”>SEO Hocası</a></li><li><?php the_category(‘, ‘); ?></li><li><?php the_title(); ?></li></ul>

Kodları ile sırasıyla, Anasayfa >Kategori > Konu Başlığı gösterilmiş olur. Sorgu sayısını arttırmaması için Anasayfa statik olarak yazıldı ve kaynak kodunda fazla yer kaplamaması için anasayfa urlsi bütün olarak değil, slash “/” olarak yazıldı. Slash yardımıyla da, içerik / kod oranını arttırmış olacağız.

Daha sonra yine kullanılan temanın style.css dosyası içerisine aşağıdaki kodları dahil etmek gerekir.

#crumbs ul,#crumbs li{list-style-type:none !important;background:none !important;margin:0 0 15px;padding:0 !important;}
#crumbs{height:2.3em;border-bottom:1px solid #DEDEDE;border-top:1px solid #DEDEDE;}
#crumbs li{float:left;line-height:2.3em;color:#777;padding-left:.75em !important;}
#crumbs li a{background:url(images/crumbs.gif) no-repeat right center;display:block;padding:0 15px 0 0;}
#crumbs li a:link,#crumbs li a:visited{color:#777;text-decoration:none;}
#crumbs a:link,#crumbs a:visited,#crumbs li a:hover,#crumbs li a:focus{color:#dd2c0d;}
Kodları ile de stil olarak menülerin konumunu ve aralardaki ok resmini görüntülemiş olacaksınız.

Bir önceki yazımız olan SEO İçin Tema Seçimi başlıklı makalemizde SEO için tema seçimi, tema seçerken dikkat edilmesi gerekenler ve wordpress tema seçimi hakkında bilgiler verilmektedir.

Eklentisiz BreadCrumb Navigation Göstermek için yorum yapabilirsiniz. (12)

  • Pekcan Ruşan

    Deneyeceğim paylaşım için teşekkür ederim emeğinize sağlık başarılı bir makale olmuş…

  • ilker

    Google bu kodlamayı nasıl algılıyor? Google aramalarında sayfa adresi yerinde SEO > Makaleler > Eklentisiz Breadcrumb bu şekilde içeriklemeyi nasıl yapabiliriz?

  • Şafak Kanmaz

    Başarılı bir makale olmuş. Hem kodları azaltmak, hem site açılış hızını arttırmak hem de SEO açısından artı puan almak için birebir.

  • Ahmet Utku Kırgız

    merhaba bu işde acemi olduğum için anlayamadım tam olarak;

    burada SEO Hocası 2 yerde yazıyor baş tarafa Anasayfa diğerinede Kategori mi yazmamız lazım yardımcı olurmusunuz

    • Kaan Gülten

      SEO Hocası yazan yer anasayfa da yazabilir.

  • mehmet

    Sorun o değilde 🙂 Copy Paste yaparken NotePad++ da id yi ve href”in yanlış kodlandığını söylüyor bende aynısını 0’dan yazınca düzeldi. İd ‘yi doğru tanımlamadığı için Css’e ulaşamıyordu. Sonuç olarak kodlarınız doğru fakat copy paste yaparken kodların doğru alındığına emin olmak lazım yada buraya bakarak elle yazılması gerekiyor.

  • mehmet

    Ben yaptım fakat crumbs.gif i çağıramıyor… Hemde listelemeyi dikey yapıyor.
    Çözüm öneriniz nedir?

    • Kaan Gülten

      Resim yolunun doğru olduğunu kontrol edin. Büyük ihtimalle hata bundandır.

  • Şükrü Özümcan Battal

    Sağ tık kopyalama engeli nedeniyle kodları kopyalayamıyorum. Buna bi çare lütfen..

    • Kaan Gülten

      Bu engeli kaldırdığımız zaman, yazılarımız hızlı bir şekilde pekçok blogda kopyalanmış oluyor. Ancak kaynak kodundan bakarak alabilirsiniz.

  • Yeter Yükselen

    @Alperen – Orada asıl amaç bence site içi linkleme sistemini geliştirmek. “>” karakteri ile pek alakası olduğunu sanmıyorum. Ama Kaan Bey’e de sormak lazım 🙂

  • Murat Sinan Akfırat

    Bir yerde > işaretini kullanmazsak google’ın bunu tanımayacağını okudum doğrumudur ?


Cevap Yazın

E-posta hesabınız yayımlanmayacak.

Yatırım Getirisi En Yüksek Reklam Türü SEO İle Siz De Kazanın! HEMEN TEKLİF İSTE