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.

SEO Hocası Blog her hafta e-postanızda. Ücretsiz abone olmak için tıklayı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.