Beranda
»
Artikel
»
Membuat Image Thumbnail

Membuat Image Thumbnail

Image thumbnail merupakan sebuah gambar-gambar dengan ukuran kecil yang mewakili gambar asli dengan ukuran sebenarnya. Image thumbnail biasanya digunakan pada halaman website e-commerce atau web penjualan untuk menampilkan contoh produk-produk yang akan ditawarkan. Jika image thumbnail tersebut di-click oleh pengunjung, image asli dengan ukuran sebenarnya akan ditampilkan di lengkapi dengan deskripsi produknya.

CSS (Cascade Style Sheet) sebenarnya dapat mengubah ukuran suatu image dalam ukuran piksel. Namun CSS tidak dapat menyusutkan ukuran image dalam bentuk byte. Jika suatu halaman web menyajikan gambar-gambar dalam jumlah banyak hanya dengan menggunakan CSS untuk mengecilkan ukuran image, tentunya saat loading / pengaksesan halaman tersebut akan menjadi sangat lambat. Hal ini karena ukuran (byte) halaman tersebut menjadi overload dengan disisipi gambar-gambar dengan ukuran besar.

Pembuatan image-image thumbnail dengan ukuran (byte) size kecil dengan PHP digunakan untuk menghindari hal tersebut. Image tersebut mewakili image sebenarnya yang jika diklik akan menampilkan image sebenarnya.

Untuk membuat image thumbnail kita membutuhkan dua buah file misalnya "thumbnail.php" sebagai halaman memasukkan input data dan "thumbnail2.php" sebagai halaman pemrosesnya. Konsep image thumbnail adalah mengubah ukuran image asli menjadi ukuran yang lebih kecil. Scipt PHP pada file thumbnail2.php akan melakukan upload image ke server dengan mengubah ukuran lebar(piksel) sesuai dengan keinginan kita.

Berikut file thumbnail.php :

PHP

<!DOCTYPE html>
<html>
<head>
<title>Membuat Image Thumbnail</title>
<style>
   form input{margin:3px;padding:3px 5px;}
</style>
<head>
<body>
   <h4>Membuat Image Thumbnail</h4>
   <form name="form1" action="thumbnail2.php" enctype="multipart/form-data" method="post">
     Masukkan file untuk di upload :<br>
     <input type="file" name="gambar"><br>
     <input type="submit" value="kirim"> <input type="reset" value="reset">
   </form>
</body>
</html>

Berkut file thumbnail2.php :

PHP

<?php
$tmp_file=$_FILES["gambar"]['tmp_name'];
$nama_file=$_FILES["gambar"]['name'];
$tipe_file=$_FILES["gambar"]['type'];
$uk_file=$_FILES["gambar"]['size'];
$arr_=explode(".",$nama_file);
$ektensi_file=end($arr_); /*mendapatkan ekstensi file*/
$dir_tujuan="images/";
$dir_thumbnail="images/thumbnail/";
if(!empty($tmp_file)){
   $move=move_uploaded_file($tmp_file,$dir_tujuan.$nama_file);
   if($move){
     if($ektensi_file=="jpeg" || $ektensi_file=="jpg"){$real_image=imagecreatefromjpeg($dir_tujuan.$nama_file);}
     if($ektensi_file=="png"){$real_image=imagecreatefrompng($dir_tujuan.$nama_file);}
     $ox=imagesx($real_image); /*lebar image asli*/
     $oy=imagesy($real_image); /*tinggi image asli*/
     $nx=110; /*lebar image thumbnail 110px*/
     $ny=floor(($nx/$ox)*$oy);
     $tmp_image=imagecreatetruecolor($nx,$ny); /*create temporary image*/
     imagecopyresampled($tmp_image,$real_image,0,0,0,0,$nx,$ny,$ox,$oy);
     imagejpeg($tmp_image,$dir_thumbnail.$nama_file,100);
     imagedestroy($real_image);
     imagedestroy($tmp_image);
     echo "<b>Image Berhasil di upload</b><br/>";
     echo "Nama file : $nama_file <br/>";
     echo "Type file : $tipe_file <br/>";
     echo "Ukuran file : $uk_file <br/>";
   }else{
     echo "<script>alert('Image gagal di upload..'); window.location.href='thumbnail.php';</script>";
     die();
   }
}
?>

Sebelum script di atas deksekusi, hal pertama yang perlu disiapkan adalah membuat terlebih dahulu direktori dengan nama "images" dan sub direktori "thumbnail" pada server untuk menempatkan file asli dan file thumbnail. Jika direktori tersebut belum dibuat terlebih dahulu akan menghasilkan halaman error.

File yang dikirim pada file thumbnail.php akan ditangkap dengan variabel global $_FILE dalam bentuk array dengan berbagai isi data dari gambar yang dikirim. Untuk memindahkan file digunakan perintah "move_uploaded_file" yang akan menghasilkan gambar asli sesuai ukuran aktualnya.

Script di depannya merupakan rangkaian perintah untuk membuat image baru sekaligus memperkecil ukuran image. Lebar image yang akan diperkecil adalah 110px dengan tinggi proporsional otomatis menyesuaikan dengan ukuran asli. Script "imagejpeg($tmp_image,$dir_thumbnail.$nama_file,100);" merupakan perintah untuk membuat gambar baru dengan format jpeg dan quality gambar 100%. Untuk menurunkan quality gambar dapat diatur dengan menaikkan dan menurunkan nilai persentase quality. Jika diturunkan akan menghasilkan gambar dengan quality rendah dan sekaligus menyusutkan ukuran file.

Jika berhasil akan menghasilkan gambar :

27 Agt 2022 0 3.228

Kategori : html - css - php

facebook twitter whatapp linkedin pinterest

Tinggalkan Balasan

Formulir ini hanya bagi member yang sudah terdaftar. Silahkan disini.

Belum terdaftar? silahkan queue Daftar disini.

Mengirim Komentar

Setiap pengunjung situs ini dapat memposting komentar disini, namun tidak semua komentar dapat ditampilkan. Gunakan kalimat baku bahasa Indonesia yang mudah dimengerti. Dilarang memposting kalimat yang berisi ujaran kebencian, SARA, pornografi, perjudian dan spam. Komentar harus sesuai dengan topik. Untuk bahasan lainnya yang lebih mendalam dapat menggunakan sarana forum. Anda dapat mengirimkan suatu pertanyaan dan member lainnya akan menjawab pertanyaan Anda.

Informasi

Silahkan login terlebih dahulu
untuk berinteraksi..

Peringatan

Penulisan email salah.

Informasi

Isi komentar tidak memenuhi batas minimal karakter yang diperbolehkan.

Peringatan!

Apakah ingin menghapus komentar ini?

	Membuat Database Dan Tabel Melalui CMD Pada Xampp Server 62.009
	Daftar Kode ASCII 47.783
	Membuat Menu Navigasi Horisontal dan Vertikal Pada HTML 45.253
	Mendownload File Dengan Menggunakan PHP 29.388
	Validasi Form Menggunakan Plugin Validation Jquery 26.464
	Menggunakan Barcode Scanner Pada Aplikasi Berbasis Web 20.132
	Membuat Barcode Generator Dengan PHP 16.075
	Cara Mudah Membuat QR Code Generator Dengan PHP 15.103
	Merubah Warna Latar Text Editor Notepad++ 14.335
	Tanda Tangan Digital Dengan Javascript, PHP Dan Menyimpannya Dalam Bentuk Gambar PNG 13.870

Visitor Name
Email