"Çalışmadan, öğrenmeden, yorulmadan rahat yaşamanın yollarını aramayı alışkanlık haline getirmiş milletler, evvela haysiyetlerini, sonra hürriyetlerini ve daha sonra da istikballerini kaybetmeye mahkumdurlar."

Mustafa Kemal ATATÜRK



08 Mart 2006

Wordpress’te Nasıl Tema Yapılır? (1)

Kategori Tema, Web, Wordpress |

Artık böyle bir makale şart sanırım :) Hazır tema kullanmaktan bıktıysanız, kendi temanızı yapmanın zamanı gelmiş demektir. Bu makaleyi iki parça halinde hazırlamaya karar verdim çünkü temelden anlatmaya başlayacağım. Önce bunu tamamlayın(zaten fazla uzun değil) daha sonra 2ncisini yazacağım. Haydi başlayalım o zaman :)

Wordpress, temalarında table yerine, günümüzde daha çok geçerliliği olan css kullanmaktadır. Ben size tema yapmayı anlatırken css'in size yetecek kadarından bahsedeceğim. Gelelim temamıza. Her temanın içinde mutlaka bir style.css dosyası bulunur ve sitemizi bu dosya şekillendirir. Sitemizin ana hatlarının "genel olarak" dizilişi resimdeki gibidir.

Tema

Yukarıda gördüğünüz gri renkli yazılar (container, content...) sitemizin temel seçicileridir. Bu makale de bunları öğrenmenizi amaçlıyorum. Kendi temanızın bulunduğu klasöre gidip, style.css dosyasını açıp içinde bu seçicileri arayın. Oradan daha iyi takip edebilirsiniz.

container: Bu seçici (yukarıdakilere seçici denir) sitemizin ana şablonudur. Sitenin sayfa içindeki yerini belirlemede(sağdan, soldan ne kadar uzakta olduğu gibi) kullanılır. Örneğin benim kullandığım Blix temasının css dosyasında container seçicisinin olduğu satır şu şekilde:

#container {
  width:690px;
  margin:0 auto;
  padding:30px 30px 0 30px;
  text-align:left;
}

Gördüğünüz gibi width:690px diyor yani sitemin genişliği 690 piksel. Bunu rahatlıkla değiştirebilirsiniz. Diğer seçiciler de aynı bu şekilde rahatlıkla değiştirilebilir.

header: Sitemizin üst kısmıdır. Arkaplan resmini yine style dosyasında header seçicisiyle oynayarak değiştirebilirsiniz.

content: Blogumuzun orta kısmıdır ve yazıların ekranda nasıl görüneceğine bu seçici ile karar veririz.

sidebar: Yan sütundur.

footer: Sitemizin alt kısmıdır. Yine genişlik vb. değişiklikleri style.css dosyasında bu seçiciyi bularak yapabiliriz.

Bu konuda anlamadığınız bir nokta varsa yorumunuzda belirtin.

NOT

  • Size tavsiyem ise css'in ne olduğunu tam anlamıyla öğrenmeniz. Bunun için yarım saatinizi ayırmanız yeterli. Css öğrenmeye başlamak için tıklayınız.
  • Css dosyalarını düzenleyebilmek için normal bir notepad bile kullanabilirsiniz. Ama sıf css için yapılmış ve yaptığınız değişiklikleri önizlemeli olarak gösteren bir program da var : TopStyle Lite

Benzer Yazılar

“Wordpress’te Nasıl Tema Yapılır? (1)” için 5 Yorum

  • 1 harun özer

    kardeş kolay gelsin. özellike yazıyı okudum ve çok beğendim ancak ben kubrick default thema sını kullanıyorum ve orada sayfa boyutlarını ayarlayamıyorum çünkü style.css de container seçicisi yok. yardımcı olabilirsen sevinirim. teşekkürler

  • 2 yakuter

    container yerine başka bir seçici olabilir. Ykarıdaki genel yapıdır. Bu yapı temadan temaya değişir. Css konusunu biraz incelerseniz sorularınızın yanıtlarını bulacağınıza inanıyorum.

  • 3 Hakan

    Her yazı başka bir bilgi denizi. Süper akıcı ve oturup çerez niyetine yenilesi bir makale olmuş. Kolay gelsin

  • 4 Ersin

    Oldukça faydalı, açık ve net emeğinize sağlık.
    Çok teşekkürler.
    Saygılarımla

  • 5 Mehmet ALP

    Wordpress teması yapmak isteyenler için oldukça güzel ve anlaşılır bir yazı…Ellerinize Sağlık Yakut bey..


Yorum Yapın

yakuter.com © 2006-2008 Erhan Yakut. Tasarım Fallendesign.
Site içerisindeki içerikler izinsiz veya kaynak gösterilmeksizin kopyalanamaz, alıntı yapılamaz.

Wordpress Valid XHTML 1.0 Valid CSS