WordPress Blog

Nasıl Yapılır: Yazılarda iki farklı arkaplan rengi kullanmak

08.03.2008 | Haberler

Amacımız; anasayfadaki yazılarımızda iki farklı arkaplan rengi kullanmak yani bir yazıda beyaz iken bir öncekinde gri daha öncekinde yine beyaz şeklinde bir döngü şeklinde bir görünüm sağlamak. Aslında bu sadece arkaplan renkleri için değil tüm sisteme uygulanabilecek bir yöntem yani iki değişik class oluşturup bunları değiştirip kullanarak yazı boyutlarından rengine kadar her türlü değişikliği yapabiliriz. Bu yöntemi kullanarak çift sütunu yazılardan oluşan magazin stili bir tema yapmak bile mümkün, (hatta bunun üzerine biraz kafa yormak zamanlanan görevlere eklendi bile.)

Burada anlatılan yöntemi şu şekilde kullanıyoruz; örnekle açıklamak gerekirse yapmak istediğimiz şey yazıların arkaplan rengini değiştirmek olsun, bir yazınına arkaplan rengi varsayılan renkte diğer yazıda ise silver(#CCC) olsun.
Temamızın index.php dosyasını (eğer varsa home.php dosyasını) açıyoruz.

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
// ya da temanızda şu şekilde de olabilir.
<?php if (have_posts()) : ?>

olan satırı bularak buraya bir değişken ekliyoruz, bu satırı şu şekilde değiştiriyoruz;

<?php $x=0; if (have_posts()) : while (have_posts()) : the_post(); ?>

sonra değiştirmek istediğimiz kısma gelelim yani değişikliği uygulayacağımız döngü içindeki kısım. Biz yazının tamamının arkaplan rengini değiştirmek istediğimizden yukarıdan koddan hemen sonraya gelerek şunları ekliyoruz;

<?php if ($odd = $x%2){?>
<div style="background-color:silver;">
<?php }?>

bu kodu sonlandırmak (açılan div tagını kapatmak için)

<?php the_content(__('devamı'));?>

kodunun hemen sonrasına da şunları ekliyoruz;

<?php if( $odd = $x%2 ){?>
</div>
<?php }?>

Son olarak en başta tanımladığımız değişkeni ($x) bir artırmak için döngünün sonuna gelerek yani

<?php endwhile; else: ?>

satırına gelerek bu satırı şu şekilde değiştiriyoruz;

<?php $x++; endwhile; else: ?>

« | »

Bu yazıya link verenler: