Pada postingan sebelumnya kita sudah belajar membuat atau menampilkan thumbnail gambar agar post summary kita yang tampil di halaman depan nampak cantik nan anggun.

Nah… berikut ane sampaikan cara yang tidak kalah mudah nya di apply oleh antum semua agar thumbnail gambar pada setiap postingan yang mengandung gambar muncul di setiap postingan.

Dengan cara ini kita tidak perlu lagi melakukan resize gambar secara manual dan menset custom field. Karena begitu antum ikuti cara ini, secara otomatis gamabr sudah diresize.

Pada cara yang berikut kita akan membutuhkan bantuan file timthum.php yang dibuat oleh Tim Mc Daniels .

Dan berikut screenshot hasilnya :

Berikut caranya :

1.  Donlot file timthumb.php dari SINI atau SINI .

2. Dibawah folder theme yang antum gunakan saat ini, buat lah folder dengan nama= scripts

3. Upload file timthumb.php ke dalam folder “scripts”

4. Dibawah folder “scripts” buat folder dengan nama= cache . ubah hak akses dari folder “cache” menjadi 777 . ***Karena timthumb membuat resize dari gambar, maka dibutuhkan tempat untuk menampung gambar -gambar hasil resize tersebut.

*** folder theme >scripts >timthumb.php +cache

5.  Untuk mendapatkan gambar dari masing-masing postingan, tambahkan kode berikut di file function.php yang berada didalam folder theme antum.

Sorot
Kode

// retrieves 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; } //retrieve image ends

***Jika theme yang antum pakai tidak mempunyai file function.php , buat lah file baru dengan bantuan notepad dan beri nama function.php  dengan isi file diatas dan tambahkan = <? php pada awal kode serta tutup dengan ?> pada akhir kode. Lalu upload kedalam folder theme antum.

atau donlot kode diatas disini.

6.  Letakkan kode berikut pada index.php atau home.php untuk menampilkan gambar thumbnail nya sebelum isi ( the_content() / the_excerpt() )

Postingan hebat lainnya yang berhubungan :

1. Cara Mudah Menampilkan Thumbnail Gambar di Postingan Pada Mesin WordPress
2. Cara Mudah Membuat Blinking Text Dengan Bantuan CSS Theme
3. Cara Membuat ScrollBar Box Dengan Isi Random Post
4. Cara Membuat Transparansi Unsur dengan Opacity di CSS3
5. Membuat Link to Post Secara Acak
6. Cara membuat list-style dengan css
7. Cara Mudah Membuat Fadding Marquee Text ( Efeks teks menghilang secara perlahan) Pada Mesin WordPress
8. Cara Membuat Scrollbar Box Warna Dengan Bantuan CSS (style.css)