WordPress Teması Yapıyoruz: category.php – page.php
Merhaba Arkadaşlar,
Eğitim serisinin sıradaki makalesinde kategori ve sayfa içeriklerinin gösterileceği şablonları oluşturacağız. ” Category.php ” sayfası içerisinde Kategoriye ait yazılar aynı index.php içerisinde yaptığımız gibi sıralanırken ” Page.php ” sayfası içerisinde ise genellikle ” Hakkımızda, Referanslar, İletişim ” gibi isimler ile oluşturduğumuz sayfaların içerikleri görüntülenecektir.
İlk olarak page.php sayfası ile başlayalım. Bu sayfayı oluştururken eğitim serisinin ilk makalesinde sizlere verdiğim zip dosyası içerisinde yer alan ” page.html ” sayfasından yararlanacağız. Html sayfa ile birlikte ” page.php ” sayfasını da bir metin editörü ile açıyoruz. Php sayfa içerisinde alt alta şu kodları ekleyerek header ve footer alanlarımızı çağırıyoruz :
<?php get_header(); ?> <?php get_footer(); ?>
Daha sonra bu iki satır arasına ” page.html ” sayfası içerisinden
<section id="content"> // </section><!-- content end -->
satırları da dahil olmak üzere aralarında ki tüm kod satırlarını kopyalayarak ” page.php ” sayfasına yapıştırıyoruz. Daha sonra
<aside id="sidebar" class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> // </aside><!-- sidebar end -->
satırları arasında kalan kodları silerek yerine
<?php get_sidebar(); ?>
satırını ekliyoruz. Bu yaptığımız işlem sonucunda sidebar alanı da dinamik bir şekilde yerleştirilmiş oldu. Şu an ki hali ile ” page.php ” sayfasını ftp’ye yüklediğimizde artık sayfa linklerinin çalıştığını göreceğiz. Şimdi yapacağımız işlem sonrasında da sayfa içerik alanlarında yazan ” lorem ipsum ” yazıları da sayfa içeriğinde ne yazması gerekiyorsa o şekilde değişecektir.
Bunun için lorem ipsum yazılı paragrafları siliyoruz. Şu an page.php sayfasında şu şekilde görülen kod satırlarını
<?php get_header(); ?> <section id="content"> <section class="container"> <section id="text-side" class="col-lg-8 col-md-8 col-sm-8 col-xs-12"> <article class="box"> <header class="header"> <a href="#">Yazı Başlığı 1</a> </header> <div class="text"> </div> </article> </section><!-- text-side end --> <aside id="sidebar" class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> <?php get_sidebar(); ?> </aside><!-- sidebar end --> </section> </section><!-- content end --> <?php get_footer(); ?>
Şu şekilde değiştiriyoruz.
<?php get_header(); ?> <section id="content"> <section class="container"> <section id="text-side" class="col-lg-8 col-md-8 col-sm-8 col-xs-12"> <article class="box"> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <header class="header"> <a href="#"><?php the_title(); ?></a> </header> <div class="text"> <?php the_content(); ?> </div> <?php endwhile; ?> <?php endif; ?> </article> </section><!-- text-side end --> <aside id="sidebar" class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> <?php get_sidebar(); ?> </aside><!-- sidebar end --> </section> </section><!-- content end --> <?php get_footer(); ?>
Yeni eklediğimiz php satırları incelediğimizde başlık ve içerik alanlarının bir if döngüsü içerisine alındığını görüyoruz. Döngü içerisinde de ” the_title(); ” ile sayfa başlığını ve ” the_content(); ” ile sayfa içeriğini çekiyoruz. Page.php sayfası ile yapacaklarımız bu kadar. Şimdi Category.php sayfasına geçelim.
” category.php ” isimli bir sayfa yaratarak metin editörü ile açıyoruz. Sayfa parçalamayı yukarıda anlattığım için tekrar anlatmıyorum. Bu sayfa içeriği için ” index.html ” sayfasından yararlanacağız. Header, Footer, Sidebar alanlarını ayırdıktan sonra içerik olarak listelenen yazılardan da bir tanesi kalacak şekilde bırakıyoruz. Category.php sayfası bunları yaptıktan sonra şu şekilde görüntülenecektir :
<?php get_header(); ?> <section id="content"> <section class="container"> <section id="text-side" class="col-lg-8 col-md-8 col-sm-8 col-xs-12"> <article class="box"> <header class="header"> <a href="#">Yazı Başlığı 1</a> </header> <div class="text"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris molestie condimentum iaculis. Etiam aliquet tincidunt egestas. Curabitur sed tellus odio. Pellentesque diam nisi, congue eget nunc nec, sagittis tincidunt magna. Proin auctor, mauris id blandit malesuada, tortor ligula posuere elit, eget aliquam quam nunc hendrerit augue. Vestibulum dignissim vestibulum lorem. Cras consequat gravida blandit. Vivamus molestie tellus non massa tempor rutrum. Etiam eu gravida lectus. Vestibulum mattis interdum augue nec tempus. Nunc in massa id nibh pharetra gravida vel sit amet odio. Donec quis felis nec risus luctus convallis. In nunc nisi, laoreet sed rhoncus lobortis, lobortis ut magna. </div> <a href="#" class="btn btn-blog">Devamını Oku</a> </article> </section><!-- text-side end --> <aside id="sidebar" class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> <?php get_sidebar(); ?> </aside><!-- sidebar end --> </section> </section><!-- content end --> <?php get_footer(); ?>
Kategoriye ait yazıları listelemek için yukarıda ki kodu şu şekilde değiştirelim :
<?php get_header(); ?> <section id="content"> <section class="container"> <section id="text-side" class="col-lg-8 col-md-8 col-sm-8 col-xs-12"> <?php while(have_posts()) : the_post(); ?> <article class="box"> <header class="header"> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> </header> <div class="text"> <?php the_excerpt(); ?> </div> <a href="<?php the_permalink(); ?>" class="btn btn-blog">Devamını Oku</a> </article> <?php endwhile; ?> </section><!-- text-side end --> <aside id="sidebar" class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> <?php get_sidebar(); ?> </aside><!-- sidebar end --> </section> </section><!-- content end --> <?php get_footer(); ?>
Not : Bu ders içeriğinde kullanılan dosyaları İndir Sayfası 51 No ‘lu Maddeden İndirebilirsiniz..
Tüm Yorumlar