WordPress Öne Çıkarılmış Görsel ve Tımthumb

Öne çıkarılmış Görsel Nedir ?
Öne çıkarılmış görsel anasayfalarımızda sol’da bulunan küçük resimleri gösterme işlemine yarar.

Örnek:

wordpress-once-cikarilmis-gorsel-timthumb

Timthumb.php Nedir ?

Timthumb.php ile öne çıkarılmış görselin bir arada kullanılmasının türlü avantajları vardır en önemlisi ise resimleri istediğiniz boyutlarda ölçeklendirip o şekilde listeleme yapabilmenizdir. Resmin boyutlarında büyük çapta bozulma olmamaktadır.Aynı Zamanda resim optimize işlemi yaparak resimlerimizi küçük boyutlarda cacheler site hızınızın artmasına vesile olur.
Şimdi İşlemlere Geçelim..

1.Aşama

functions.php dosyamızı açıyoruz <?php kodlar ?> şeklinde aşağıdaki kodlarımızı yerleştiriyoruz.

add_theme_support('post-thumbnails');[php]
 
Bu işlemle birlikte WP-Admin &gt; Yeni Yazı ekle Dediğimizde Sağ Alt Tarafta <strong>Öne Çıkan Görseli</strong> Görebileceksiniz.
 
<strong>Örnek</strong>
 
<a href="http://www.metinsarac.net/wp-content/uploads/wordpress-one-cikan-gorsel-alani.png"><img class="alignnone  wp-image-635" alt="wordpress-one-cikan-gorsel-alani" src="http://www.metinsarac.net/wp-content/uploads/wordpress-one-cikan-gorsel-alani.png" width="479" height="158" /></a>
<h2>2.Aşama</h2>
Şimdi Timthumb.php dosyasını ediniyoruz. <strong><a href="http://www.metinsarac.net/wp-content/uploads/timthumb.php_.txt">Buradan</a> </strong>indirebilirsiniz.
<ul>
	<li>İndirdiğiniz Dosyası Tema içerisine gönderin.</li>
</ul>
<h2>3.Aşama</h2>
 
[php]
<?php $image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full'); if ( has_post_thumbnail() ) { ?>
 
<a title="<?php the_title(); ?>" href="<?php the_permalink() ?>" rel="bookmark"><img src="<?php bloginfo('template_url'); ?>/timthumb.php?src=<?php echo $image_url[0]; ?>&w=255&h=250&zc=1" alt="<?php the_title(); ?>" width="255" height="250" /></a>
 
<?php } ?>

Kod Hakkında

  • &w=255&h=250&zc=1 (255 değeri yükseklik 250 değeri genişliği temsil eder.)

Varsayalım ki işlemleri yaptınız fakat bazı yazılarınıza Öne çıkarılmış görsel belirlemedik bunun için ise aşağıda ki kodu kullanıyoruz.

4.Aşama

<?php $image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full'); if ( has_post_thumbnail() ) { ?>
<a title="<?php the_title(); ?>" href="<?php the_permalink() ?>" rel="bookmark"><img src="<?php bloginfo('template_url'); ?>/timthumb.php?src=<?php echo $image_url[0]; ?>&w=255&h=250&zc=1" alt="<?php the_title(); ?>" width="255" height="250" /></a>
<?php } else { ?>
<a title="<?php the_title(); ?>" href="<?php the_permalink() ?>" rel="bookmark"><img src="<?php bloginfo('template_url'); ?>/timthumb.php?src=Resim Adresi&w=255&h=250&zc=1" alt="<?php the_title(); ?>" width="255" height="250" /></a>
<?php } ?>

Kod Hakkında

  • Resim Adresi kısmını düzenliyoruz.
  • &w=255&h=250&zc=1 (255 değeri yükseklik 250 değeri genişliği temsil eder