WordPress (Wp) Tema Yapımı 3
WordPress tema yapımı serimizin 3. bölümdeyiz . Çok yoğun üniversite ve iş hayatım yüzünden bloguma fazla zaman harcayamasamda sizlere gerekli gördüğüm paylaşımlarımı sunmaya gayret ediyorum . Şimdi gelelim bu bölümde öğreneceklerimize . Wp tema yapımı 1 ve Wp tema yapımı 2 derslerinde öğrendiklerimizin üstüne bu derste artık sitemizin içini doldurmaya başlıyoruz .
Blog başlık , url ve açıklamasının yazılması
WordPress Fonksiyon arşivim sayfasında sizlere daha önceden wp ' de kullanılabilecek fonksiyonları yazmıştım şimdi o fonksiyonları kullanmanınn zamanı geldi .
Blogumuzun adını (başlığını) ekrana yazdırmamız gerekiyor diyelim .
Blogumuzun index.php ksımını açıkıyoruz ve body tagları arasına şu kodları yazıyoruz .
-
<a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a>
bloginfo('name') bize blogumuzun adını çekiyorken bloginfo('url') bize blogumuzun url adresini çekiyor ve ekranda göstermemizi sağlıyor .
Ekran Görüntüsü :
Biz adımlarımızı biraz daha geliştirip buranın altınada blogumuzun açıklamasını yazmak istiyoruz o zaman kodları şu hale getirmemiz lazım .
-
<a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a>
-
<?php bloginfo('description'); ?>
bloginfo('description') bize blogumuz için belirlediğimiz açıklamamızı (sloganımızı) yazdırma imkanı sunuyor .
Ekran Görüntüsü :
İşte blogumuzun adını , url adresini ve açıklamasını aldık ve ekrana yazdık fakat şuanda çok şekilsiz görünüyor biraz bunu stillendirelim . Onun için index.php kısmına yazdığım kodları şu hale getiriyorum .
-
<div id="header">
-
<div id="blogadi">
-
<a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a>
-
</div>
-
<div id="blogaciklama">
-
<?php bloginfo('description'); ?>
-
</div>
-
</div>
gerekli xhtml , html kodlamaları ekledim şimdi style.css dosyasına geçiyorum ve bunlara biraz style kazandırıyorum .
style.css dosyamızı şu hale getirelim :
-
/*
-
Theme Name: İlk Tema
-
Theme URI: http://www.byumut.com
-
Description: Byumut ilk Tema
-
Version: 1.0
-
Author: UMUT CETİNKAYA
-
Author URI: http://www.byumut.com
-
*/
-
body{
-
margin:2px;
-
}
-
#header{
-
border:1px solid silver;
-
background-color:#F0F0F0;
-
padding:5px;
-
font-family:"Verdana";
-
}
-
#header #blogadi{
-
font-size:25px;
-
color:#330033;
-
}
-
#header #blogadi a{
-
text-decoration:none;
-
color:#990000;
-
}
-
#header #bloaciklama{
-
width:100%;
-
color:#A6A6A6;
-
}
Ekran Görüntüsü :
Bilgi için çok teşekkürler.İşime çok yarayacak.Eline sağlık.
güzel ve detaylı anlatım için teşekkürler 4. yazıyıda bekliyoruz.
teşekkürler paylaşım için saol dostum