Öne Çıkarılmış Görsel ve Timthumb Kullanımı

Merhaba arkadaşlar.

Aslında birçok yerde anlatımı mevcut olan önce çıkarılmış görsel kullanımını blogumda anlatmak istemiyorum. Yalnız benim kullandığım yöntemin biraz farklı olması ve bir blogcunun benden bu olayı anlatmamı istediğinde böyle bir yazı yazayım dedim.

Öne çıkarılmış görsel nedir biraz ondan bahsedelim. Mesela benim blogumun anasayfasındaki yazıların sol tarafındaki resimler öne çıkarılmış görseldir. Blogumuza yazı eklerken aynı zamanda yazıya bir resim ekleriz ve altta buluna öne çıkarılmış görsel olarak kullan butonu ile yazımıza öne çıkarılmış görsel belirleyebiliriz.

Anlatım

functions.php dosyamızı açıyoruz ve aşağıdaki kodu buluyoruz.

<?php

Hemen bu kodun altına aşağıdaki kodu ekliyoruz.

add_theme_support('post-thumbnails');

Yaptığımız bu işlem sayesinde temamızda öne çıkarılmış görsel kullanımını aktifleştirdik. Eğer bu işlemi yapmasaydık öne çıkarılmış görsel kullanamayacaktık. Yazı eklerken dikkat ederseniz kategori seçiminin altında öne çıkan görsel diye bir yer geldi.

Daha sonra buradan timthumb dosyamızı indiriyoruz. İndirdiğimiz bu dosyayı tema klasörümüzün içine atıyoruz ve bu dosyayı attığımız konumda cache adında bir klasör oluşturuyoruz.

Şimdi de öne çıkarılmış görselin nerede gözükmesini istiyorsak oraya aşağıdaki kodları yazalım.

<?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 class="left" src="<?php bloginfo('template_url'); ?>/timthumb.php?src=<?php echo $image_url[0]; ?>&w=125&h=127&zc=1" alt="<?php the_title(); ?>" width="125" height="127" /></a>
<?php } ?>

Yukarıdaki 125 ve 127 değerlerini sizin öne çıkarılmış görselinizin boyutları ne olmasını istiyorsanız ona göre düzeltebilirsiniz.

Şimdi işe biraz aksiyon katalım ve eğer öne çıkarılmış görsel belirlememişsek varsayılan bir resim göstersin bize. Onun için yine öne çıkarılmış görselin gözükmesini istediğimiz yere yukarıdaki kodları değil de aşağıdaki kodları ekleyelim.

<?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 class="left" src="<?php bloginfo('template_url'); ?>/timthumb.php?src=<?php echo $image_url[0]; ?>&w=125&h=127&zc=1" alt="<?php the_title(); ?>" width="125" height="127" /></a>
<?php } else { ?>
<a title="<?php the_title(); ?>" href="<?php the_permalink() ?>" rel="bookmark"><img class="left" src="<?php bloginfo('template_url'); ?>/timthumb.php?src=VARSAYILAN YAZI RESMİ ADRESİ&w=125&h=127&zc=1" alt="<?php the_title(); ?>" width="125" height="127" /></a>
<?php } ?>

Yine burada düzeltmemiz gereken yerler var. Öncelikle 125 ve 127 değerlerini kendimize göre düzenliyoruz. Sonrasında varsayılan yazı resmi yazan yere öne çıkarılmış görsel kullanmadığımız zaman gözükecek olan resmin adresini yazıyoruz.

Not: Eğer öne çıkarılmış görseller gözükmüyorsa cache klasörünün yazım iznini 777 yapınız.

Kaynak: http://www.usluer.net/one-cikarilmis...umb-kullanimi/

ben önceden kullanıyorum ama resimler çıkmıyor hocam. 755 miş 777 yaptım gene görünmedi sanırım sunucu kaynaklı.

Acaba otomatik değilde bizim belirlediğimiz özel alanı ekleyince çıksa. Benim kod aşağıda bunu özel alana "resim" yazınca çıkacak şekilde yapamazmıyız.

<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><img src="<?php bloginfo('template_directory'); ?>/timthumb.php?src=<?php echo get_post_image(); ?>&w=398&h=200&zc=1" width="398" height="200" alt="<?php the_title(); ?>"/></a>

<a title="<?php the_title(); ?>" href="<?php the_permalink() ?>" rel="bookmark"><img class="left" src="<?php bloginfo('template_url'); ?>/timthumb.php?src=<?php echo get_post_meta($post->ID, 'resim', true); ?>&w=125&h=127&zc=1" alt="<?php the_title(); ?>" width="125" height="127" /></a>

Yukarıdaki kodlarla yapabilirsiniz.

Kod işe yaradı teşekkür ederim. Ama hocam ufak bir sorun oldu bu kodu koyunca resmin kalitesi bozuluyor ama kendi orjinal kodu koyunca çok net çıkıyor sebeb nedir?

Kalitesinin bozulmaması lazım hocam. Bu işlem resimlerde kırpma yapıyor belki o yüzden farklılık olabilir.

Kırpmayı ekrana basarken yapıyorsa kalite bozulur değil mi? Orjinali sanırım sunucuya eklerken kırpıp ekliyor oda sorun olmuyor.

Aslında buda orjinal resimden kırpıyor hocam. Kafam karıştı.

Hocam resimleri bir türlü sola yaslayamadım. Özet kısım resmin aşağısından akıyor. Bana bu konuda yardımcı olurmunuz.

float: left dediğiniz zaman sıkıntı olmayacaktır.