Şablon dersleri-1 (kodların tanımı ve görevi)

 Merhaba arkadaşlar, bana tema, eklenti ve kodlarla ilgili bir çok mail ve yorumlarda sorular talepler oluyor, bende bundan sonra baştan başlayarak, neyin ne olduğunu kendi bilgi dağarcım kadarıyla anlatmaya çalışıcam. Bu işe ilk girdiğimde, ne konu yayınlamısını ne resim eklemsini ne bağlantı vermesini biliyordum. Herkese sorar, dolaşır yapmaya çalışırdım, o yüzden bu anlamda zorluk çekenlerin halinden anlarım. Kendimi geliştirerek şimdi başkalarına tema hazırlıyorum, gerek görsel gerek teknik bilgilerimi birleştirerek karınca kararınca bir şeyler yapmaya çalışıyorum. Bu konuda bir çok arkadaşımız da elinden geldiğince yazıları yardımları oluyor, Özellikle sevgili Eda ve Gece nın bu konuda epeyce geniş bir portföyü var, ama herkesin izleyicisi, kitlesi farklı olabiliyor, kaçıranlar, bilmeyenler için gelen sorular üzerine bende bir el atayım dedim, umarım işinize yarar bu bilgiler.

Bildiğiniz gibi "blog dünyasında" sadece blogspot uzantılı yani şu anda bizim kullandığımız blog türü "açık kaynak" kullanıyor, diğer wordpress, typan vs gibi blog hizmetleri bilgisayarınıza indirdiğiniz dosyalarla kurulması gerekiyor. Elbet arada kalite farkı var. Özellikle wordpress in üstün özellikleri blogspotla kıyaslanamaz bile. Hizmet ve imkanlar olağan üstü güncel ve daha üst seviyede ama gel gelelim bloggerın arkasında google amcanın olması ve tamamen ücretsiz olması ve az önce dediğim gibi kullanımı hazır ayağımza gelmesi gibi özelliklerinden ötürü daha popüler.

Öncelikle bazı terimlerin ve sözcüklerin anlamlarını bilmek gerekiyor. Bu "html kodlarında" eklentilerin bir "css" kodu birde "div" kodları mevcuttur. "css" kodları bir eklentinin şekil biçim bakımından yapısını, "div" kodları ise işlevsel bakımından yapısını oluşturur. Yani şöyle diyebiliriz diyelim bir "kek" yapmınında kullanılan malzemeler "css" kodları, hazırlanmasını pişirmesini sağlayan ise "div" kodlarıdır diyebiliriz. Yani mutlaka bir "css" kodların mutlaka "div" uzantılı kodu mevcuttur. Bazı bağımsız div kodları da olabiliyor.

Daha anlaşılır olması için bir örnek daha vereyim, kendi sayfamda yada hazırladığım bazı temalarda görüldüğü gibi yukarda "header" altında "menüler" vardır. "anasayfa, iletişim, profil gibi"

İşte öncelikle bu "menülerin" önce "css" kodları belirlenir, şekil olarak, görünmesini sağlar, boyutu, rengi, yazı şekli, varsa sağında solunda resmi, arkaplanı gibi görüntüye dayanan yapısını oluşturur. Ancak bu hazırlığı "div" kodlarıyla tamamlamazsak, bu "menüler" yukarda gözükmez, saçma sapan, yanda sağda solda şekilsiz bir biçimde çıkar. "div" kodları ile tamamlandığı zaman hem sayfada gereken yerde görünür, hemde bu kodun içinde gerekli bağlantıları eklediğimizde, menü üzerine tıklandığında ki açılması gereken sayfalara yönlendirir, yani "menülerin"  içeriğini, işlevselliğini tamamlar.

Bu "css" kodları html sayfasında yer alır ve bütün özellik ve eklentilerin "css" kodları alt alta sıralanır, daha sonra her "css" kodun işlevini tamamlayan "div" kodları başlar. Bu "css ve div" kodlarını

 Bu yazı ayırır. Yani "css" kodları buun üstünde, "div" kodları bunun altında olur. Tabi her özelliğin eklentinin yeri ve konumu vardır. 

Ben urada sadece blog sahibi bayanların, belli başlı yapılması gereken değişiklikler için bir iki tavsiye anlamında basitçe anlatmaya çalışacağım. Yoksa bu kod html işi baya bir derin, ufak ufak anlatımlarla, sırayla temel özellikleri, ve görsel olarak yapılması istenen küçük detayları anlatmaya çaşıcağım. Bugün kü giriş yazımdan sonra sırayla hepsini devam edicem. Elimden geldiği kadar sorularınıza  top yekün cevap vermeye çalışacağım. Bu arada sormak istedikleriniz olursa yorumdan yazabilir. Mutlaka sırayla , hem sizin hem herkesin öğrenebileceği anlayabileceği şekilde sayfamda cevaplıycam. Şimdilik bu kadar, bundan sonra ki dersimiz, kodların tanımı ve görevi olucak.