dongu

WordPress tema yap─▒m─▒ derslerine, index.php dosyas─▒n─▒ olu┼čturmay─▒ ama├žlayan dersimizle devam ediyoruz. Bu derste wordpressÔÇÖte loop olarak adland─▒r─▒lan d├Âng├╝leri olu┼čturmaya ba┼člayaca─č─▒z. Bu dersteki d├Âng├╝de anasayfada yani index.phpÔÇÖde yaz─▒lar─▒ g├Âstermek i├žin kullanaca─č─▒z. ├ľncelikle index.phpÔÇÖye eklememiz gereken kodlarla ba┼člayal─▒m.

<?php get_header(); ?>

─░ndex.php dosyam─▒za ilk olarak yazmam─▒z gereken kod, yukar─▒daki get_header kodu. Bu kod bizim ge├žen derste olu┼čturdu─čumuz header.php dosyas─▒n─▒ i├žeriye aktarmam─▒z─▒ sa─čl─▒yor. E─čer header.php dosyas─▒n─▒ daha olu┼čturmad─▒ysan─▒z a┼ča─č─▒daki linkten bu dosyay─▒ olu┼čturmay─▒ ├Â─črenebilirsiniz.

WordPress Tema Yap─▒m─▒ {Header.php dosyas─▒n─▒ olu┼čturmak}

E─čer bu dersi daha ├Ânce okuduysan─▒z ve header.php dosyan─▒z─▒ olu┼čturduysan─▒z devam edebiliriz. ┼×imdi localhostta ├žal─▒┼č─▒yorsan─▒z e─čer sayfan─▒z─▒ yenileyip header.phpÔÇÖnin i├žine daha ├Ânce yazd─▒─č─▒m─▒z kodlar─▒n g├Âz├╝k├╝p g├Âz├╝kmedi─čini kontrol edebilirsiniz. E─čer her┼čeyi d├╝zg├╝n yapm─▒┼čsak ┼ču anda sitemizde site ba┼čl─▒─č─▒ ve logonun g├Âz├╝k├╝yor olmas─▒ gerekiyor. Sayfa kayna─č─▒na bakt─▒─č─▒n─▒zda da sayfaya head tag─▒n─▒n i├žerisinde bir ├žok i├žerik eklendi─čini g├Âr├╝rs├╝n├╝z.

HeaderÔÇÖ─▒ i├žeriye aktard─▒ktan sonra art─▒k i├žerik k─▒sm─▒nda neler olaca─č─▒na karar verebiliriz. Ben i├žeri─čimin ÔÇťcontainerÔÇŁ ad─▒n─▒ verdi─čim bir class i├žerisinde olmas─▒n─▒ istiyorum. Bu b├╝t├╝n i├žeri─či kapsayacak bir class olacak ve site i├žeri─čimin nerede olmas─▒n─▒ istedi─čime karar verece─čim class bu olacak. ┼×imdi bu classÔÇÖ─▒ tan─▒mlayal─▒m.

<div class="container">
</div>

┼×eklinde bir kod ile container isimli bir classÔÇÖ─▒ olu┼čturan div tag─▒m─▒ a├žt─▒m ve kapad─▒m. Kapama i┼člemini divi a├žt─▒─č─▒n─▒z anda yaparsan─▒z sitenizde meydana gelebilecek herhangi bir kayma probleminin ├Ân├╝ne ge├žmi┼č olursunuz. Bunun alt─▒na 2 adet div daha a├žaca─č─▒m. Bu divlerden birisi benim d├Âng├╝m├╝ i├žine alacakken di─čerinin i├žerisine de sidebarÔÇÖ─▒m─▒ yerle┼čtirece─čim.

<div class="container">
     <div class="sol-kolon">
     </div>
     
     <div class="sag-kolon">
     </div>
</div>

B├╝t├╝n divlerimi a├žt─▒m ve kapad─▒m. Sol kolon ve sa─č kolon isimli iki adet class─▒m oldu ve bu classlar container isimli bir ana classÔÇÖ─▒n i├žerisinde. Bu kolonlarda birisine sidebar di─čerine de d├Âng├╝ gelecek. Siz hangisini isterseniz se├žebilirsiniz. Ancak css dosyan─▒z─▒ ona g├Âre ┼čekillendirmeyi unutmay─▒n. ┼×imdi sol kolonun i├žerisine d├Âng├╝m├╝ yerle┼čtirece─čim. Bunun i├žin a┼ča─č─▒daki kod ile d├Âng├╝y├╝ ba┼člat─▒yorum.

<?php
     if (have_posts()) :
          while (have_posts()):
               the_post(); ?>

Kulland─▒─č─▒m kodun ikinci sat─▒r─▒nda if (e─čer) kodu ile daha ├Ânceden yay─▒nlanan yaz─▒lar─▒n olup olmad─▒─č─▒n─▒ kontrol ediyorum. Ard─▒ndan while (iken) kodu ile yaz─▒lar var ÔÇťikenÔÇŁ ne olaca─č─▒n─▒ yazaca─č─▒m─▒ belirtiyorum. Ard─▒ndan 4. sat─▒rda da yaz─▒lar─▒n gelmesini istedi─čimi s├Âyl├╝yorum. Buradan sonra yazaca─č─▒m─▒z kodlar tamamen size kalm─▒┼č durumda. Ben a┼ča─č─▒daki gibi ilerleyece─čim.

<?php the_title(); ?>

Yukar─▒daki the_title kodu ile konular─▒m─▒n ba┼čl─▒klar─▒n─▒ yazd─▒rd─▒m. ┼×imdi sadece konu ba┼čl─▒klar─▒n─▒n nas─▒l yazd─▒r─▒ld─▒─č─▒n─▒ kontrol etmek isterseniz e─čer bu koddan sonra a┼ča─č─▒daki kod ile if ve while kodlar─▒n─▒ kapat─▒p sayfan─▒z─▒ yenileyebilirsiniz.

<?php endwhile; else: endif;?>

Bu kodu the_title dan sonra ekleyip sayfan─▒z─▒ yeniledi─činizde sayfan─▒zda headerÔÇÖ─▒n bitiminden sonra daha ├Ânceden ekledi─činiz yaz─▒lar─▒n ba┼čl─▒klar─▒n─▒n yazd─▒r─▒ld─▒─č─▒n─▒ g├Ârebilirsiniz. Peki bu ba┼čl─▒klar─▒n alt─▒nda yaz─▒lar─▒m─▒n ├Âzetlerini g├Âstermek istersem ne yapmam gerekir diye soracak olursan─▒z bunun i├žin de the_title kodundan hemen sonra ve endwhile, else, endif kodlar─▒ndan hemen ├Ânce a┼ča─č─▒daki kodu eklemeniz gerekiyor.

<?php the_excerpt(); ?>

Excerpt kodu yaz─▒m─▒z─▒n ├Âzetini olu┼čturan kodumuzdur. Bu kodu koydu─čunuz yerde yaz─▒n─▒z─▒n ilk 55 kelimesi g├Âz├╝kecek ve ard─▒ndan [DevamÔÇŽ] ┼čeklinde bir link ├ž─▒kacakt─▒r. Bu kelime say─▒s─▒n─▒ de─či┼čtirmeyi ba┼čka bir yaz─▒mda anlataca─č─▒m.
┼×imdiye kadar yazd─▒klar─▒m─▒zda sayfan─▒z─▒ yeniledi─činizde sayfan─▒zda ├Ânce yaz─▒ ba┼čl─▒─č─▒ ard─▒ndan da yaz─▒n─▒n ├Âzetinin geldi─čini g├Ârmeniz gerekiyor.

Bu ba┼čl─▒klar─▒ ve ├Âzeti ┼čekillendirmek i├žin de bunlar─▒ birer div veya span i├žerisine alarak ┼čekillendirebilirsiniz. Yaz─▒n─▒n sonunda hepsini bir arada verece─čim. Ama ├Âncelikle anasayfada g├Âz├╝ken yaz─▒lar─▒n ÔÇť├ľne ├ç─▒kar─▒lm─▒┼č G├ÂrselÔÇŁlerini nas─▒l ekleyece─čimizi g├Âstermek istiyorum. Bunu yapmak i├žin d├Âng├╝m├╝z├╝n i├žerisinde the_title ya da the_excerptÔÇÖin oldu─ču b├Âl├╝mde bu kodlardan ├Ânce veya sonra a┼ča─č─▒daki kodumuzu ekleyece─čiz.

<?php if ( has_post_thumbnail()) : ?>
     <?php the_post_thumbnail();?>
     <?php else: ?>
     <?php endif;?>

Bu kod ne i┼č yapar ondan bahsedelim biraz. ├ľncelikle 1 sat─▒rda e─čer ko┼čulu ile yaz─▒ya eklenen bir ├ľne ├ç─▒kar─▒lm─▒┼č G├Ârsel var m─▒, yok mu onu kontrol ediyoruz. E─čer varsa the_post_thumbnail kodu ile bu g├Ârseli sayfaya yazd─▒r─▒yoruz. Ard─▒ndan else kodu ile e─čer g├Ârsel yoksa ne olaca─č─▒n─▒ yaz─▒yoruz. Bu ┼čekilde else; kodundan sonra bir┼čey yazmay─▒p direkt in ko┼čulunu kapat─▒rsan─▒z g├Ârsel yoksa yerine hi├žbir┼čey konulmayacakt─▒r. Ard─▒ndan endif; ile ko┼čulumuzu bitiriyoruz.

┼×imdi sayfay─▒ yeniledi─čimizde sayfada ba┼čl─▒k, g├Ârsel ve ├Âzetin oldu─čunu g├Ârebiliriz. Art─▒k d├Âng├╝m├╝z haz─▒r ve index.php sayfam─▒z─▒n i├žerisine footerÔÇÖ─▒m─▒z─▒ dahil edip sayfan─▒n d├╝zg├╝n g├Âz├╝kmesini sa─člayabiliriz. Bunun i├žin a┼ča─č─▒daki kod ile footer.php dosyam─▒z─▒ ├ža─č─▒r─▒yoruz.

<?php get_footer(); ?>

Bu kod gt_header kodu ile ayn─▒ mant─▒kta ├žal─▒┼č─▒yor ve footer dosyam─▒z─▒ i├žeriye aktarmam─▒za olanak sa─čl─▒yor.

Art─▒k t├╝m kodlar─▒m─▒z─▒ bir araya getirirsek ┼čunun gibi g├Âz├╝kmesi gerekmektedir.

<?php get_header(); ?>
	<div class="container">
        <div class="sol-kolon">
        <?php
			if (have_posts()) :
				while (have_posts()):
					the_post(); ?>
                    	<h2><?php the_title(); ?></h2>
                        
                        <span><?php the_excerpt(); ?></span>
                        
                        <?php if ( has_post_thumbnail()) : ?>
							<span><?php the_post_thumbnail();?></span>
								<?php else: ?>
							<?php endif;?>
                            
			<?php endwhile; else: endif;?>
		</div>
         
		<div class="sag-kolon">
		</div>
	</div>

<?php get_footer(); ?>

Geriye sadece sidebarÔÇÖ─▒ eklemek kal─▒yor. Onu da bir sonraki desimizde anlataca─č─▒m. Herhangi bir sorunuz olursa sorabilirsiniz. ─░yi ├žal─▒┼čmalar.

Facebook Profile photo

#r00tadmin #Basit Bir kuL #Allah (c.c) Bir kuLu i┼čte bazen bir adem bazen bir aLem !

Leave a Comment

E-posta hesab─▒n─▒z yay─▒mlanmayacak. Gerekli alanlar * ile i┼čaretlenmi┼člerdir