Yeni temaya geçtik. Şimdiden birçoğunuzun aklında soru işaretleri vardır bu tema üzerindeki özelliklerin nasıl yapıldığına dair. Gelin bazılarını açıklayalım ve tema hakkında ileride sorabileceğiniz birçok soruyu yanıtlayayım
Her tema değişimimden sonra birçok soru geliyor iletişimden tema ile alakalı
Bazı sorular o kadar çok soruluyor ki, tekrar tekrar yanıt vermek zorunda kalıyorum. O nedenle şimdiden sorabileceğiniz birçok soruyu yanıtlamaya çalışacağım
Temanın dizayn kısmı bana ait değil. Bildiğiniz üzere kodlama yönüm ağır basıyor ve dizayn etmek gerçekten yoruyor beni. O nedenle bu temayı ücretini ödeyerek Cenk Akyıldız arkadaşımıza dizayn ettirdim. Temanın tüm görsel tasarımı Cenk’e ait. Kendisinden PSD formatında teslim aldım dizaynı.
Evet, temanın tüm kodlamaları bana ait. Cenk dizayn etti ve kendisinden istediğim PSD formatında bana teslim etti. Ben ise önce XHTML formatına dönüştürdüm. Ardından Wordpress’e uyarladım ve gerekli kodlamaları yaptım.
Haber manşet bölümünün herhangi bir eklentisi yok arkadaşlar
En azından ben kullanmıyorum. Temanın Javascript tarafı jQuery tabanlı. Manşet ve diğer bölümlerin kodlaması ise bana ait yine. Yani jQuery ile bu işler çok daha kolay oluyor. Yoksa salt JavaScript ile de kodlayabilirdim.
Tema üzerindeki tüm tab menülerin de kodlaması bana ait. Bir eklenti kullanmadım. Zaten tab menüler Cenk’in yolladığı tema dizaynı üzerinde yer alıyordu. Bana XHTML formatına dönüştürmek ve çalışır hale gelebilmesi için kodlamak kaldı.
Yazı eklerken, özel alanlardan mansetresim adında bir anahtar tanımlıyorum. Bunun değerine ise yazı ile alakalı resmin tam URL adresini giriyorum. Bu resimler kendi sunucumdan olmuyor. Google Görsel Arama ile resimleri buluyorum. Ancak resmin kaynak sitesinin bant genişliğini tüketmemek için, tanımlanan tüm resimleri kendi sunucuma yükletiyorum. Böylece ne resmi aldığım sitelerin kaynağını tüketiyorum, ne de resimler yavaş yükleniyor.
Resimler ise tema üzerinde şu şekilde yükleyebiliyorsunuz:
<img src="<?=get_post_meta($id,'mansetresim',true);?>">
Buradaki $id, yazının ID numarası oluyor.
Bu özel bir resim ufaltma sistemi ile. Bunu sizinle paylaşmayacağım. Ancak mantık kolay. Bu dosya yazı ID numarasını ve istediğim resim boyutlarını söylüyorum. O da, o yazıya ait resmi alıp verdiğim boyutlara göre biçimlendiriyor. Ve sonrasında bu yeni resmi sunucuma kaydediyor. Ve her bu resmi çağırdığımda, sunucu üstünden okuyarak çıktı veriyor. Eğer yazıya ait bir resim yoksa, o durumda boş ve beyaz bir resim çıktı veriyor.
O bölüm de eklenti değil arkadaşlar
Onu da kendim kodladım.
FeedBurner’ın kendi özelliği arkadaşlar
http://www.feedburner.com üzerinden hesap açarak, bu özelliği kullanabilirsiniz.
Onu da FeedBurner üzerinden kullanıyorum.
O da EkleBunu.
Buna CSS Sprite diyoruz arkadaşlar. Böylelikle sunucuya daha az istek gidiyor ve site fark edilir derecede hızlı yükleniyor. Konu ile alakalı olarak:
Bu tekniği birçok noktada kullandım. Örneğin temanın genel kısmını kaplayan resimler tek bir parça:
http://img.dmry.net/blog/01/dmry-tema-css-sprite.jpg
Kod renklendirme eklentisini değiştirdim. Yeni kullandığım eklenti SyntaxHighlighter Plus
Üst tarafta,
Nerdeyim? › Giriş › Sevgili Günlük › Yeni tema hakkında merak ettikleriniz
gibi dizin yolları görüntülenir. İşte bu Breadcrumb NavXT - Core eklentisi ile oluyor.
Bu iki özellik tamamen yeni ve kendim kodladım. Sistem çerezler ile çalışıyor. Çerezleri sildiğiniz vakit tüm liste kayboluyor. Okunacak listesine eklediğiniz bir yazıyı görüntülediğiniz vakit, listeden siliniyor. Favoriler de ise böyle bir durum söz konusu değil
Evet stil dosyam boş, ve sadece zorunlu olarak o dizinde yer alıyor. Çünkü stil dosyası olmayınca, Wordpress temayı geçerli kabul etmiyor. Her bölümün kendine özel bir stil dosyası var ve bu dosyalar HTML kodlar arasına yükleniyor. Yani stil dosyası ayrıca yüklenmiyor. Bu sayede site daha hızlı açılıyor.
Css çıktı verilmeden önce bir güzel temizleniyor. Yani yorum satırları, boşluklar ve gereksiz kodlar siliniyor. Böylece boşluksuz bir stil bölümü elde ediliyor. Bunu küçük bir PHP fonksiyonu tek başına hallediyor.
function css_optimize($kaynak) {
echo str_replace('; ',';',str_replace(' }','}',str_replace('{ ','{',str_replace(array("\r\n","\r","\n","\t",' ',' ',' '),"",preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!','',$kaynak)))));
}
JavaScript kodları da CSS kodları ile aynı mantıkta yükleniyor. Ayrıca javascript dosyaları yüklenmiyor ve kodlar sıkıştırılarak HTML arasına alınıyor.
JavaScript kod sıkıştırma için hazırlanan birçok betik inceledim ancak hepsi JavaScript kodlarının çalışmasını engelledi. Ancak sonrasında JSMin ile tanıştım. Kusursuz şekilde JavaScript kodlarını temizliyor ve biraz da olsa küçültüyor.
Özel bir fonksiyon yazdım. Şöyleki:
function yazi_toplam_yorum($yaziID) {
global $wpdb;
$toplamyorum = (int) $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->comments WHERE comment_post_ID = '$yaziID' AND comment_approved = '1' AND comment_type NOT IN ('trackback', 'pingback')");
return $toplamyorum;
}
Kullanım:
<?= yazi_toplam_yorum(get_the_ID());?>
Bunu single.php, index.php içerisindeki döngü (Loop) arasına koyacaksınız.
Ona da özel bir fonksiyon yazdım. Şöyle:
function yazi_toplam_trackback($yaziID) {
global $wpdb;
$toplamtrackback = (int) $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->comments WHERE comment_post_ID = '$yaziID' AND comment_approved = '1' AND comment_type ='trackback' ");
return $toplamtrackback;
}
Kullanım:
<?= yazi_toplam_trackback(get_the_ID());?>
Bunu da single.php, index.php içerisindeki döngü (Loop) arasına koyacaksınız.
Ona da bir fonksiyon yazdım. Şöyle:
function yazi_toplam_pingback($yaziID) {
global $wpdb;
$toplampingback = (int) $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->comments WHERE comment_post_ID = '$yaziID' AND comment_approved = '1' AND comment_type ='pingback' ");
return $toplampingback;
}
Kullanım:
<?= yazi_toplam_pingback(get_the_ID());?>
Bunu da single.php, index.php içerisindeki döngü (Loop) arasına koyacaksınız.
Her üçünde de fonksiyon kodlarını temanıza eklemeniz gerekiyor. Bunları varsa functions.php dosyasına ekleyin.
Eğer yoksa functions.php adında bir dosya oluşturun(tema klasörünüz içerisine). Ve içerisine alttaki kodları ekleyin:
<?php
function yazi_toplam_yorum($yaziID) {
global $wpdb;
$toplamyorum = (int) $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->comments WHERE comment_post_ID = '$yaziID' AND comment_approved = '1' AND comment_type NOT IN ('trackback', 'pingback')");
return $toplamyorum;
}
function yazi_toplam_trackback($yaziID) {
global $wpdb;
$toplamtrackback = (int) $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->comments WHERE comment_post_ID = '$yaziID' AND comment_approved = '1' AND comment_type ='trackback' ");
return $toplamtrackback;
}
function yazi_toplam_pingback($yaziID) {
global $wpdb;
$toplampingback = (int) $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->comments WHERE comment_post_ID = '$yaziID' AND comment_approved = '1' AND comment_type ='pingback' ");
return $toplampingback;
}
?>
İletişim bölümü eklenti değil arkadaşlar
Onu da kendim kodladım
Bu yazı 5 Ekim 2008, 14:32 tarihinde yazılmış olup bu zamana kadar 978 kez görüntülenmiştir
Bu yazı 31 adet yorum almıştır ve bunların son 10 adeti görüntülenmektedir. Bu yazıya yapılan tüm yorumları görmek için arşivi görüntüleyiniz. TÜM YORUMLARI OKUMAK İÇİN TIKLAYINIZ.
her ne kadar kullanışlı ve pratik olsa da, dizayn açısından karmakarışık olduğunu düşünüyorum.. alışamadım birtürlü, eski hali geliyorda gözümün önüne, harikaydı o yau.. ![]()
ne yaptıysan, gayet güzel olmuş ![]()
Maşallah herşey senin ellerinden çıkmış
Allah nazardan saklasın ![]()
Teşekkürler ![]()
Hakan abi önceki yorumlarda da sorulmuş ama cevap vermemişsin tam olarak ,
Yazıda more etiketini kullanıyorsun tamam da , tekil yazı sayfasına geçtiğimizde , yaznın “more”den önce kullanılan kısmıyla , moreden sonra kullanılan kısmı arasında fark var . Araya reklam felan da yerleştirilebiliyor .
Bunu paylaşabilirmisin ?
@KaBaDaYi, kendi tema kodlarımı paylaşmıyorum
O bölümü CSS ile yaptım. Benzer şekilde sen de bunu, tabloları kullanarak yapabilirsin ![]()
dostum sadece bir şey sorcam şu yorumlar kısmınında tablo halinde yapmışsın yorumlar listesi varya
yorum yapanlar yukarıda sol üste tarih sag üste kullanıcı adı sol altta yorumu sağ alta ise avatarı tablo hoşuma gitti falla
onda css mi kullandı yoksa dosyadan mı yaptım varsa kodunu paylaşırmısın
Resim boyutunu düşürmek için fazla sıkıştırdım sanırım Deniz, o nedenle olabilir ![]()
Üst logoda DMRY yazısında bir resim kalitesizliği var biraz bozuk gibi duruyor bana mı öyle geliyor acaba ?
Yazını çok beğendim. Yeni yazılarının e-posta adresime gelmesini istiyorum :)