Merhaba arkadaşlar.Önceki yazımda Yazı Başlıklarını Kısaltmayı anlatmıştım.Bu yazımda yine yazı listelemesi üzerine bir konu olan Yazının İlk Resmini Thumbnail Yapma yı anlatacağım.
Yazılarına eklediği resimlerin boyut farklılığından dolayı anasayfa,kategori sayfaları gibi yerlerde görüntü bozukluğu oluşturmasını isteyen webmaster yoktur herhalde.O halde fazla uzatmadan bu sitede de kullandığım yazının ilk resmini thumbnail yapan işlevi anlatıma geçeyim.
Öncelikle herzaman olduğu gibi üzerinde çalışacağımız functions.php,index.php ve style.css dosyalarının yedeklerini alalım.
functions.phpyi açıp en üste aşağıdaki kodu yapıştırın.
Bu kodumuzla temamıza thumbnail özelliğini tanımlatmış olduk.Thumbnail özelliğini kullanmak için şöyle devam edelim
index.phpde aşağıdaki kodu bulalım
Hemen üstüne aşağıdaki kodu yapıştıralım.
Şimdi style.css dosyasını açıp en altına aşağıdaki kodu yapıştıralım.
Functionsda resim özelliğimizi tanıtıp indexte konumlandırdık ve stylede resim özelliklerini boyuttur carttır curttur ekledik ve kullanıma hazır hale getirdik.Şimdi yazılarımızda eklediğimiz ilk resim anasayfada yazının sol tarafında 125*125 boyutlarında aşağıdaki gibi gözükecek.Dilerseniz kodlarda oynama yaparak farklı boyutlarda farklı özelliklerde süsleyerek gösterebilirsiniz ben sadece mantığını anlattım.Takıldığınız yer olursa sorabilirsiniz.
Uygulama sonucu oluşan görüntü:
Kaynak:Yazının İlk Resmini Thumbnail Yapma
Yazılarına eklediği resimlerin boyut farklılığından dolayı anasayfa,kategori sayfaları gibi yerlerde görüntü bozukluğu oluşturmasını isteyen webmaster yoktur herhalde.O halde fazla uzatmadan bu sitede de kullandığım yazının ilk resmini thumbnail yapan işlevi anlatıma geçeyim.
Öncelikle herzaman olduğu gibi üzerinde çalışacağımız functions.php,index.php ve style.css dosyalarının yedeklerini alalım.
functions.phpyi açıp en üste aşağıdaki kodu yapıştırın.
PHP:
<?php
function mstfturkgoster() {
error_reporting(0);
global $post, $posts;
$mstfturkbir = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
$mstfturkbir = $matches [1] [0];
if(empty($mstfturkbir)){ //Eğer mstfturk eklememişseniz
$mstfturkbir = get_bloginfo('stylesheet_directory') .'/images/mstfturk.png';
}
return $mstfturkbir;
}
function mstfturkgoster_by_post($post) {
error_reporting(0);
$mstfturkbir = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
$mstfturkbir = $matches [1] [0];
if(empty($mstfturkbir)){ //Eğer mstfturk eklememişseniz
$mstfturkbir = get_bloginfo('stylesheet_directory') .'/images/curcuna.png';
}
return $mstfturkbir;
}
?>Bu kodumuzla temamıza thumbnail özelliğini tanımlatmış olduk.Thumbnail özelliğini kullanmak için şöyle devam edelim
index.phpde aşağıdaki kodu bulalım
PHP:
<?php the_content(); ?>Hemen üstüne aşağıdaki kodu yapıştıralım.
PHP:
<div class="mstfturk"><img src="<?php echo mstfturkgoster(); ?>" alt="" width="125px" height="125px" /></div>Şimdi style.css dosyasını açıp en altına aşağıdaki kodu yapıştıralım.
PHP:
.mstfturk {
width: 140px;
height: 140px;
float: left;
padding: 10px 10px 10px 10px;
}Uygulama sonucu oluşan görüntü:
Kaynak:Yazının İlk Resmini Thumbnail Yapma
