Son Yazılar
Yükleniyor...

Recent Posts

Anasayfa » , » WordPress Tema Yapımı Ders 3

WordPress Tema Yapımı Ders 3

Merhaba arkadaşlar bu gün wordpress tema yapma derslerimizin üçüncüsüne geldik bu dersimizde şimdiye kadar neler yaptık onlara tek tek bakacağız neyi niçin yaptık yada yaptığımız şeylerin yapma açısından başka yöntemleri mevcut mu daha geniş açıdan bakmak gerekirse ne yaptık, neyi yapacağız ve niçin yaptık konusunu ele alacağımız bir ders olacak bu gün ki dersimiz elimden geldiğince somutlaştırarak anlatmaya çalışacağım kafanıza takılan sorular olursa sorarsınız.İlk başta klasik bir wordpress temasının hangi dosyalardan oluştuğunu belirtmiştik bunu birinci dersimizde anlatmıştık burada bir kez daha gösterelim. Bu arada önceki dersimize buradan ulaşabilirsiniz.






Bir önceki dersimizde css de sitemizin şablonunu oluşturmuştuk bunu bir resimle de gösterelim.


Evet arkadaşlar şekildeki gibi bir şablon oluşturmak için tek ihtiyacımız float ve margin değerlerini belirlemek daha sonra isterseniz css de seçiciler ile ek özellikler belirleyebiliriz açıkçası bu konuyu baştan sona kadar anlatmak istemediğim için internette sizler için biraz araştrıma yaptım ve float kullanımını oldukça geniş örneklerle açıklayan bir blog buldum adresine buradan ulaşabilirsiniz

yine de oldukça basit bir float kullanımına örnek vereyim sizlere hemen içimde kalmasın.
Örneğin header kısmını ele alalım
*yüksekliği 300 genişliği 930 olarak header kısmın kodlarını yazıyoruz*/
#header {
border: 1px solid #00ff00;
width: 930px;
height: 300px;
}

Ve şimdi de konumunu belirlemek adına float uygulamasına bir örnek olarak da sidebar kısmımızı gösterelim
/*Float etiketi ile sağ ve sol siderbarı diğer kolondan ayırıyoruz.*/
#sidebarLT {
margin:0;
width:200px;
border: 1px solid #ff9900;
float:right;
}

Evet arkadaşlar yukarıdaki gibi bir kaç örnekten sonra konumuza devam edelim. Css dosyalarımızda geçen derste hatırlarsanız herbir conteiner için ayrı seçiciler kullanmıştık şimdi ilk seçicilerimiz olan header.php ile devam edelim daha önce de dediğim gibi header.php bizim neredeyse bütün wordpress ile bağlantılarımızın ve css dosyası gibi diğer bir çok uygulama ile bağlantımızın olduğu kısımdır.
Evet arkadaşlar şimdi ilk başta şunu söylemek istiyorum yukarıda da dedik butun yapacağımız sayfalar index.php ye gelecek aslında header.php yi düzenlerken bir bakıma şöyle de düşünebilirsiniz index.php yi düzenliyoruz neden böyle söylüyorum sebebi şu isterseniz header.php veya footer.php ye ihtiyaç duymadan da sadece index.php yi yapabilirsiniz ama biz karışıklık çıkmasın diye ikisini ayrı ayrı yapacağız ilk başta klasik bir index.html şablonunun üst kısmını ekleyeceğim buraya içerisine henüz wordpress ile bağlantımızı sağlayacak php kodlarını eklemeyeceğiz ki karışmasın

1.Adımı:Header.php



-

Klasik bir sablon.

    yukarıda da gördüğünüz gibi klasik bir html şablonu var şimdi biz wordpress içerik yönetimi sistemi ile bağlantı kuran kodlarımıızı ekleyeceğiz linkler buraya kısmını o yüzden belirledim php kodlarımızın büyük bir kısmı oraya gelecek.
    >
    <?php bloginfo(‘name’); ?> <?php wp_title(); ?>
    ; charset=” />
    ” type=”text/css” media=”screen,projection” />


      Evet arkadaşlar yukarıda da gördüğünüz gibi wordpressimizin gerekli bağlantı ayarlarını yaptık aslında php bilenler çok rahat anlayacaklardır ama bazı kodlamaların ne işe yaradığını yine belirtmek istiyorum aşağıda tek tek ayrıca codex wordpressadresinden daha detaylı olarak ta öğrenebilirsiniz.

      etiketi içine eklediğimiz  başaka dil gruplarını desteklemesi için gerekli olan  kodumuz
      değişkenimiz site hakkında bilgi verir slogan falan gibi
      wp_title() sitemizin başlığını belirtir
       bu kodumuzda ise bağlantılarımız java script falan tarzı bağlantıların bütün sayfalara uyarlamasını sağlar veri tabanından  get_option değerlerini alır.
      wp_list_pages ise site sayfalarını sıralamak için kullanılır. WordPressin doğru yerden başlamasını sağlar yani ana sayfamızdan
      Evet arkadaşlar header.php mizin düzenlemesi bu kadar  şimdi sırada footer.php miz var onuda düzenledikten sonra iki php dosyamızı index.php ye bağlayacağız evet gördüğünüz gibi olay çok basit sırası ile css dosyası ile sitemizin şablonunu tasarımını ve dizaynını yapıyoruz daha sonra ek özellikle eklemeyi düşünmediğimiz sürece bütün php dosyalarının kodlaması aynıdır hiç değiştirmenize gerek yoktur. İkinci olarakta header footer ve sidebar php dosyalarımız oluşturup index php ye bağlıyoruz ondan sonrada geriye kaldı yorumlar dosyası ve diğer ıvır zıvırlar ne kadar kolaymış değilmi arkadaşlar

      2.Adım:Footer.php

      <!– Burası tamamen reklam site ismi urlsi falan –>
      wordpress tema tasarım Sorbize
      <!– burayı sakın silmeyin –>
      ©

      < ?php wp_footer(); ?>

      Evet arkadaşlar klasik bir footer.php dosyası bu şekilde dir siz isterseniz bu kısma son yazıları yorumları veya kategorileri php değişkeni atayarak ekletebilirsiniz tabi div taglarının yerini css de belirtirseniz en azından karışmazlar.
      Evet arakadaşlar aslında burada bırakmayı düşünüyordum devamını ikinci ders olarak anlatmayı düşünüyordum ama her halde karışıklık olabilir diye devam edeceğim umarım sizin içinde çok uzun bir yazı olmaz.
      Hemen çok kısa footer php içinde yerleştirdiğimiz php kodlarının fonksiyonlarını anlatayım
      bu kodumuz copyright © 2010 tarzı sitelerin altında çıkar ya işte onu sağlayan php kodumuz Y veya N evet hayır diye gösterilsin mi gösterimesin mi diye değiştirebilirsiniz.
      blog ismi ve bilgi
      sitenizin takip edilmesi için gerekli bağlantıyı sağlayan rss kodu
      < ?php wp_footer(); ?> bu kodumuzuda daha çok kim yaptı site kiie ait yani o tarzda bişiler eklemek isterseniz diye kullanabilrsiniz.
      Evet arkadaşlar sıra geldi header ve footer ı index imize eklemey oldukça basit ve sade bir kodla bunu yapacağız ve devamını gelecek derste anlatacağız


      İşte yukarıda gördüğünüz php kodları ile footer ile headerı index in içine get fonksiyonu ile getiriyoruz agt-hizmet.blogspot.com'un bugünlük dersi bu kadar gelecek dersimizde sidebar ve index.php yi anlatacağız.
       





       



       

      Bu Yazıyı Beğen-Paylaş :

      0 yorum:

      Yorum Gönder

       
      Sponsor Linkleri : Link Ekle | Link Ekle | Link Ekle
      Copyright © 2013. Hizmet Bizim İşimiz - All Rights Reserved
      Hazırlayan AgtHizmet Orjinali Cosmic™ Ftzalim
      Ftzalim powered by konuburada