Akhirnya setelah mencoba berkali-kali script maupun code php untuk membuat auto readmore di blog wordpress, yang awalnya code dari mas deny. Kini saya telah mendapat dan mencoba code php untuk membuat tampilan Auto Readmore versi terbaru dengan gambar Thumbnail .
Kemarin saya udah posting Auto Readmore di Blogspot Banyak yang menanyakan bagimana cara membuat auto readmore dengan thumbnail, tetapi baru kemarin saya mendapat caranya.
Masuk ke dashboard wordpress
Klik Appearence lalu silahkan masuk ke menu editor.
Setelah itu Anda masuk ke functions.php tambakan code berikut :
<?php
// retreives image from the post
function getImage($num) {
global $more;
$more = 1;
$content = get_the_content();
$count = substr_count($content, ‘<img’);
$start = 0;
for($i=1;$i<=$count;$i++) {
$imgBeg = strpos($content, ‘<img’, $start);
$post = substr($content, $imgBeg);
$imgEnd = strpos($post, ‘>’);
$postOutput = substr($post, 0, $imgEnd+1);
$image[$i] = $postOutput;
$start=$imgEnd+1;$cleanF = strpos($image[$num],’src=”‘)+5;
$cleanB = strpos($image[$num],’”‘,$cleanF)-$cleanF;
$imgThumb = substr($image[$num],$cleanF,$cleanB);}
if(stristr($image[$num],’<img’)) { echo $imgThumb; }
$more = 0;
}
//retreive image ends
?>
Script ini berguna untuk memanggil url gambar yang terdapat di dalam postingan. lalau tekan Update File untuk menyimpan code tersebut..
Masuk ke index.php, dan cari kode The _content kemudian paste kode ini di atasnya..
<div>
<a href=”<?php the_permalink(); ?>” title=”<?php the_title_attribute(); ?>”>
<img src=”<?php getImage(’1′); ?>” height=”150″ width=”150″>
</a>
</div>
Lalu Update File untuk menyimpan.. Selanjutnya gimana lagi ??.. tenang tinggal satu langkah lagi yaitu Anda masuk ke intinya, agar tampilan Auto Readmore dengan Thumbnail terlihat menarik tentunya Anda harus mengedit Style.CSS . Tambahkan code dibawah ini di style.css
.thumbnail a:link, .thumbnail a:visited {display:block; float:left; padding:5px; background:#e2e2e2; width:150px; height:150px;
margin:5px 5px 0 0;}.thumbnail a:hover, .thumbnail a:active {background:#C4C4C4;}
Tekan Update File.. dan silahkan lihat hasilnya..
