Osman S Börütecene

alemlerin aslı hayaldir

Kendi Temasını Yapmak İsteyenlere Bir Başlangıç

22 Mayıs 2007 Salı 02:18, Osman Seyit Börütecene

GÜNCELLEME: Aşağıda bahsettiğim stil dosyası üzerinde çalışmalara devam ettiğimden bu yazıda bahsettiğim rakamlar, mesela sayfanın eni, menünün genişliği gibi, ufak tefek değişimler gösterebilir ancak tabii sistem, yapı, anafikir aynı.

Kendi blogumun görünümünü yenilerken varolan şablonları bir yana bırakıp herşeyi yeni baştan yazmıştım. Sonra bu konuda çalışmaya devam ettim. WordPress kullanan ve kendi temasını yazan biri için bu işler bu kadar zor olmamalıydı çünkü WordPress 4 yaşında ve 4 yıldır üzerinde birçok insan çalışıyor.

Dave Shea‘nın hazırladığı WordPress Classic temasıyla biraz oynamaya karar verdim. Daha önce de bu tema üzerinde çalışmıştım. HayatKısa.com‘un şablonu ve teması bunun üzerine kuruludur. Ama orada şablon dosyalarıyla da oynamıştım. Oysa buna gerek olmamalıydı.

Az evvel bir yarım saatimi ayırdım ve WordPress Classic şablonunu biraz daha inceledim. Sonra şablon dosyalarına hiç dokunmadan sadece style.css dosyası ile oynayarak, gereksiz gördüğüm yerleri atarak, bazı ayarları daha kaba ayarlar haline getirerek, sayfayı ortalayarak, sağdaki absolute konumlandırılmış menü sütununu oradan kurtarıp buradaki temada yaptığım gibi içerik kısmının yanına koyarak bir iskelet oluşturdum.

Bu şekilde WordPress Classic şablonunun tema dosyası üzerinde daha kolay oynanabilir hale gelmiş oldu. Dosyayı, bu işleri denemek için kurduğum WordPress blogundan direkt olarak indirebilirsiniz:

http://wp.visnum.com/wp-content/themes/iskelet/style.css

Bu dosyayı, Classic şablonun bulunduğu klasöre atarsanız Classic şablonun görünümü değişmiş olacak.

Şimdi biraz teknik detaylardan bahsedeyim.

Dave Shea’nın şablonun içine koyduğu ama style.css dosyasında hiç yer vermediği bir wrapper var. Bunu stil dosyasına ekledim. Id’si #rap. Bunu 870px genişlikte kullandım. Siz kendi beğeninize göre değiştirebilirsiniz.

#content olarak belirtilen yer blogun soldaki ana kısmı. Onun genişliği 600px + 2×30px padding = 660px. #menu olarak belirtilen yer de sağdaki menü. Bunun genişlik, marjin ve padding ayarlarıyla oynamadım ama bir cetvel yazılımıyla ölçtüm, 210px çıktı. Zaten #rap kısmının genişliğini de buna göre belirledim.

CSS’den biraz anlıyorsanız bile dosyanın içinde şöyle bir gezindiğiniz zaman neyin neresi olduğunu ayırdedebilirsiniz. Bu dosyayı 1.0 versiyonu olarak numaralandırdım çünkü çatlayan patlayan bir tarafı yok, her tarafı düzgün durumda. Buradan yola çıkarak dosyayı daha da küçültmeye, daha da iskelet hale getirmeye devam edeceğim. Biraz daha çalışıp sonra Classic şablona yine hiç dokunmadan bir WordPress şablonu ve teması olarak yeni bir isimle yayınlamayı planlıyorum.

Bu stil dosyası, WordPress Classic şablonuna ait olduğundan WordPress Türkiye‘nin çevirdiği WordPress versiyonlarıyla da kullanılabilir. Çünkü az evvel birkaç kez belirttiğim gibi şablona hiç dokunmadım. WordPress Türkiye’nin çevirisini yaptığı WordPress Classic temasının linki:

http://wordpress-tr.com/dosyalar/temalar/classic.zip

Gelecekte buradan yeni temalar yaratacağım. Bunları yaratırken şablona da dokunabilirim. Mesela DOC TYPE’ı XHTML Transitional’dan XHTML Strict’e ya da XHTML 1.1′e çevirmek gibi.

Sorularınız olursa buralardayım. Gecikmeli de olsa cevaplandırmaya çalışacağım. Herkese neşeli CSS çalışmaları dilerim.

'Kendi Temasını Yapmak İsteyenlere Bir Başlangıç' başlıklı yazıya 5 yorum yapılmış.

  1. WordPress Experiments » WordPress Classic Temasının Stil Dosyasıyla Oynadım diyor ki:

    […] Ve görsel olarak bir hayli değişti. Şu anda gördüğünüz tema WordPress Classic ve benim değiştirdiğim stil dosyasından oluşuyor. Ayrıntıları kendi blogumda yazdım. […]

  2. Style » Kendi Temasını Yapmak İsteyenlere Bir Başlangıç diyor ki:

    […] Buremba wrote an interesting post today onHere’s a quick excerptDave Shea’nın şablonun içine koyduğu ama style.css dosyasında hiç yer vermediği bir wrapper var. Bunu stil dosyasına ekledim. Id’si #rap. Bunu 870px genişlikte kullandım. Siz kendi beğeninize göre değiştirebilirsiniz. … […]

  3. kurabiye evi diyor ki:

    merhabalar bloggerda oldukca yeniyim sablon uyarlamasını bilmiyorum tam olarak wordpresste bir sema buldum bunu nasıl uyarlarım yardımcı olursanız sevinirim tema adı rounded-v2-beta simdiden tesekkürler

  4. Osman S. Börütecene diyor ki:

    @kurabiye evi: aslını söylemek gerekirse wordpress temasını blogger’a uyarlamak gibi bir şey gerçekte yok. buradaki uyarlamak, bir wordpress temasını blogger için yeniden yazmak demek.

  5. kurabiye evi diyor ki:

    peki tekrar nasıl yazabilirim yardımcı olursan sevinirim:(

Siz de fikrinizi belirtin

Merhaba!

osman

Site İçi Arama

Sayfalar

Arşiv

RSS

Site Map

Sosyal Mevzular

Standartlar