Anasayfa > Etiket: tema yapımı

WordPress Tema Yapımı – 2

Bir web sayfası oluşturmak için 2 temel dosyamız var. Bunlardan biri index.html diğeri ise style.css dosyasıdır. index.html dosyasında tasarım iskeletimizi yapacağız ve style.css dosyamız ile de iskeletimizi ayakta tutup görünüşünü belirleyeceğiz.” demiştik. Şimdi sıra hazırladığımız bu şablonu parçalarına ayırıp WordPress’e uygun hale getirmekte.

WordPress Tema Şablonu

Genel itirbariyle şablon 3 parçadan oluşur tabi ne kadar parçalayacağınız da size kalmıştır. Bu parçaları şöyle sıralayabiliriz;

  1. header.php
  2. index.php
  3. footer.php

1) Header.php

Html şablonumuzun <head></head> etiketleri ve bu etiketlerin içinde bulunan alan ile, <body> etiketi sonrasında tüm sayfalarımızda içerik alanından önce görünen logo ve menü ile vb. alanları barındıracağımız alandır.

 


  
    ApiQ Blog
    
  
  
    
Burası üst(header) alanımız.
Burası içerik(index) alanımız.
Burası alt(footer) alanımız.

WordPress Tema Yapımı – 1

Bir web sayfası oluşturmak için 2 temel dosyamız var. Bunlardan biri index.html diğeri ise style.css dosyasıdır. index.html dosyasında tasarım iskeletimizi yapacağız ve style.css dosyamız ile de iskeletimizi ayakta tutup görünüşünü belirleyeceğiz.

Html sayfa nasıl oluşturulur?

  1. style.css
  2. index.html

Bir WordPress tema oluşturmak için temamızı sisteme tanıtacak ve bir bütün olarak tutup diğer sayfalarda kullanacağımız iskelet yapının şeklini belirleyip iskeleti bir canlıya dönüştürecek olan style.css dosyamızı belirleyeceğiz ve en başına temamızı tanıtacak olan şu kodları kendimize göre özelleştirip css dosyamızı WordPress’e tanıtacağız.

style.css

/* 
Theme Name: ApiQ Blog
Theme URI: http://www.acaglar.com
Description: WordPress blog teması
Author: Abdurrahman ÇAĞLAR
Author URI: www.acaglar.com Version: 1.0
*/
 
body { 
  background:#eee; 
  font-family:Arial; 
  font-size:12px; 
  margin: 0; 
  padding: 0;
} 
#cerceve { 
  width:1000px; 
  margin:0 auto; 
  padding: 0; 
} 
#ust { 
  width: 100%; 
  min-height: 80px; 
  background: #c60000; 
} 
#index { 
  width: 70%; 
  min-height: 400px; 
  background: #aaa; 
  float: left;
}
#sidebar {
  width: 30%; 
  min-height: 400px;
  background: #555;
  float:left;
} 
#alt { 
  width:100%;
  min-height: 80px; 
  background: #008080;
  display: block;
  float: none;
} 
.clearfix:after {
  content: "."; 
  display: block; 
  clear: both; 
  visibility: hidden; 
  line-height: 0; 
  height: 0;
}

index.html

 


  
    ApiQ Blog
    
  
  
    
Burası üst(header) alanımız.
Burası içerik(index) alanımız.
Burası alt(footer) alanımız.

Örneğin Görünümü

WordPress Tema Yapımı

Günümüzün hazır scriptlerinden ve hazır script sektörünün bence lideri, eklentisi, bileşeni bol, düzenlemesi rahat ve kolay, arayüz olarak oldukça basit aynı zamanda güvenlik zafiyeti minimum olan bu sistem üzerinde birçok profesyonel tema ve tasarımın kullanılmakta olduğunu görebilirsiniz.  Şimdi bir WordPress sistemi için tema nasıl yapılır konusuna değinelim.

WordPress Tema Nasıl Yapılır?

Yazılım işinde mantığın, sonuca farklı şekillerde gidebilmenizi sağladığını belirtip bu yazı serisinde sizlerle basit bir tema üzerinde temel fonksiyonları gösterip tema işine bakış açınızı genişletmek ve genel manada tema çerçevesini kafamızda oturtmamıza yardımcı olmak istiyorum.

WP Tema Yapımı için ihtiyacımız olan dosyalar nelerdir?

  1. style.css
  2. index.html (Genel şablonumuzu belirledikten sonra sayfalara parçalayacağız.)
  3. index.php
  4. header.php
  5. sidebar.php
  6. footer.php
  7. single.php
  8. comments.php
  9. 404.php
  10. archive.php
  11. author.php – category.php – page.php – search.php – tag.php
  12. functions.php (özel fonksiyonlarımızı barındıracağımız sayfamız.)

Sonraki yazımızda style.css ve index.html ile tasarımın genel hatlarını tamamlayacağız.

ApiQ Blog WordPress Teması Büyük Ölçüde Hazır

Tekrar merhaba. Blog yazmaya yeniden başladıktan sonra bloğun içeriğinde de yer alacak olan WordPress tema yapımı konusuyla alakalı olarak muhakkak kendi temamla bu bloğu kullanmamın gerekliliğini hissetmiştim ve bu sebepten başlamış olduğum blog temasını büyük ölçüde tamamlayıp kullanmaya başladım.

Nasıl bir tema yaptım?

Sade, anlaşılır ve kolay bir tema olmasını hızlı bitmesi ve genel anlamda sizlerle paylaşacağım evreleri bünyesinde barındıracak böyle bir tema oluşturdum.

Temayla ilgili görüşleriniz ve sorularınızı yorum olarak paylaşırsanız sevinirim.

Sağlıcakla kalın efendim 🙂