Sukandia Personal Blog

Pada tulisan terdahulu saya pernah menyampaikan sebuah artikel singkat tentang cara menambahkan sebuah thumbnail image (gambar kecil) pada setiap daftar tulisan pada sebuah blog yang dibangun dengan WordPress. Namun ada beberapa orang mengatakan hal ini sangat sulit sekali dan memakan waktu, manakala pada sebuah blog mempunyai ratusan dan bahkan ribuan artikel yang didalam masing-masing artikel sudah terdapat satu atau beberapa buah photo atau gambar. Maka mereka harus mengedit ulang seluruh artikel yang jumlahnya sudah ribuan atau bahkan jutaan artikel dan menambahkan “Custom Fields” pada masing-masing artikel tersebut, dan tentunya akan membuat kepala menjadi  mumet dan bahkan rambut menjadi rontok ..hehehee :p Nah berikut adalah cara termudah dan dalam sekejap semua artikel anda yang jumlahnya sudah milyaran artikel itu masing-masing akan memiliki sebuah thumbnail secara otomatis (tentunya syarat dan ketentuan tetap berlaku dong!)

Berikut adalah langkah-langkah praktisnya;

1. Langkah I: download file phpThumb, dan extract dengan menggunakan WinZip atau program sejenis seperti TUGZip atau 7-Zip.Lalu uploadlah kedalam folder theme WP yang sedang anda pakai atau aktif.
2. Langkah II: bukalah file functions.php dan tambahkan fungsi php berikut pada bagian akhir sebelum tanda “?>”:

   /***************
   Thumbnail Images
   ********************/
   function show_thumb($width,$height,$crop,$quality,$blank) {
   
   global $post;
   $custom_field_value = get_post_meta($post->ID, 'Image', true);
   $attachments = get_children( array('post_parent' => $post->ID, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => 'ASC', 'orderby' => 'menu_order ID', 'numberposts' => 1) );
   
   if ($attachments == true) {
   
   foreach($attachments as $id => $attachment) {
   $img = wp_get_attachment_image_src($id, 'full');
   $tweak = str_replace('/', '%2F', $img[0]);
   $img_url = str_replace(':', '%3A', $tweak);
   print '<img class="kiri" src="'.get_template_directory_uri().'/phpThumb/phpThumb.php?src='.$img_url.'&amp;w='.$width.'&amp;h='.$height.'&amp;zc='.$crop.'&amp;q='.$quality.'" title="'.$post->post_title.'" alt="'.$post->post_title.'" />';
   }
   
   } elseif ( $custom_field_value == true) {
   
   $tweak = str_replace('/', '%2F', $custom_field_value);
   $img_url = str_replace(':', '%3A', $tweak);
   print '<img class="kiri" src="'.get_template_directory_uri().'/phpThumb/phpThumb.php?src='.$img_url.'&amp;w='.$width.'&amp;h='.$height.'&amp;zc='.$crop.'&amp;q='.$quality.'" title="'.$post->post_title.'" alt="'.$post->post_title.'" />';
   
   } elseif ($blank == true && $attachments == false && $custom_field_value == false) {
   
   print '<img class="kiri" src="'.get_template_directory_uri().'/phpThumb/cache/blank.gif" width="'.$width.'" height="'.$height.'" title="Story has no image" alt="Story has no image" />';
   } else {
   // do nothing
   }
   }
   

   simpan dan uploadlah!

3. Langkah III: buka file style.css dan tambahkan kode css berikut, simpan dan uploadlah,

   img.kiri {
   background: #fff;
   float: left;
   display: inline;
   border: 1px solid #b3d2fc;
   padding: 2px;
   margin: 0 10px 0 0;
   overflow: hidden;
   }
   

4. Langkah IV: bukalah file index.php yang ada di directory template php anda dan tambahkan kode html berikut:

   <a href="<?php the_permalink(); ?>"><?php show_thumb($width=100,$height=80,$crop='T',$quality=95,$blank=false); ?></a>
   

   ditambahkannya pas sebelum kode ini ya:

   <?php the_content('Read the rest of this entry &amp;amp;amp;raquo;'); ?>
   

   lalu save atau simpan dan uploadlah ke server anda.

5. Ulangi langkah ke-4 diatas pada file seperti archive.php dan search.php jika anda memilikinya di folder theme anda.
6. Langkah V: Coba buka halaman depan blog anda, jika telah ada penampakan thumbnail image, berarti anda telah berhasil. Jika tidak, coba cek kembali langkah-langkahnya dari awal dan jangan lupa berdoa.

Catatan: thumbnnail yang ditampilkan diambil dari image/photo yang telah ada dimasing-masing artikel berdasarkan urutan terkecil, anda bisa merubah urutan (order) sesuai dengan keinginan anda di media gallery pada artikel yang bersangkutan.

Selamat mencoba, semoga sukses dan berhasil…. and have a nice weekend