Tutorial PHP : Membuat Watermark Sederhana Dalam 5 Menit

thePinkFighter

 

Merasa risih melihat gambar-gambar hasil editan Anda terpajang bebas di website orang lain? Kenapa tidak mencoba untuk menambahkan watermark berupa logo website atau teks tertentu pada gambar di website Anda? Bagaimana ya caranya? Tenang saja, ada cara cukup mudah membuat watermark sederhana menggunakan PHP. Yuk simak lebih lanjut tutorial berikut ini.

Sebelum membuatnya, persiapkan terlebih dahulu file dan direktorinya :



Gunakan file PNG untuk logo agar mendapatkan hasil yang bagus. Font bisa ditaruh di folder yang berbeda, sebagai contoh kita menggunakan font Gilsanub.TTF, Anda juga bisa menggunakan font lainnya sesuai yang Anda inginkan. Nah mari kita mulai untuk membuatnya.

Langkah 1 :

Untuk pertama kali tentukan logo watermark yang akan ditempelkan pada gambar nantinya. Serta tentukan juga judul teks yang ingin Anda pasang nanti. Kalau watermark yang ingin Anda buat berupa teks, tentukan juga ukuran fontnya serta jenis font.

<?php $text_show = "DISKUSIWEB"; // watermark text $image_show = "logo.png"; // watermark image $image_path = ($_GET['mode']=="img")? $image_show : $text_show; $font_path = "GILSANUB.TTF"; // font $font_size = 20; // contoh 20 = 20px $path = "uploads/"; // folder upload gambar setelah proses watermark ?>

Langkah 2 :

Buatlah 2 fungsi berikut : watermark_image() dan watermark_text(). Fungsi ini bisa Anda gabung ataupun ditaruh di file php terpisah. Dalam contoh ini, kita akan menggabungkannya pada file php sebelumnya.

<?php function watermark_image($oldimage_name, $new_image_name){ global $image_path; list($owidth,$oheight) = getimagesize($oldimage_name); $width = $height = 300; // tentukan ukuran gambar akhir, contoh: 300 x 300 $im = imagecreatetruecolor($width, $height); $img_src = imagecreatefromjpeg($oldimage_name); imagecopyresampled($im, $img_src, 0, 0, 0, 0, $width, $height, $owidth, $oheight); $watermark = imagecreatefrompng($image_path); list($w_width, $w_height) = getimagesize($image_path); $pos_x = $width - $w_width; $pos_y = $height - $w_height; imagecopy($im, $watermark, $pos_x, $pos_y, 0, 0, $w_width, $w_height); imagejpeg($im, $new_image_name, 100); imagedestroy($im); unlink($oldimage_name); return true; }   function watermark_text($oldimage_name, $new_image_name){ global $font_path, $font_size, $text_show; list($owidth,$oheight) = getimagesize($oldimage_name); $width = $height = 300; // tentukan ukuran gambar akhir, contoh: 300 x 300 $image = imagecreatetruecolor($width, $height); $image_src = imagecreatefromjpeg($oldimage_name); imagecopyresampled($image, $image_src, 0, 0, 0, 0, $width, $height, $owidth, $oheight); $blue = imagecolorallocate($image, 79, 166, 185); // tentukan warna teks dalam RGB (255,255,255) $shadow = imagecolorallocate($image, 178, 178, 178); // efek teks shadow imagettftext($image, $font_size, 0, 70, 191, $shadow, $font_path, $text_show); // posisikan logo watermark pada gambar imagettftext($image, $font_size, 0, 68, 190, $blue, $font_path, $text_show); imagejpeg($image, $new_image_name, 100); imagedestroy($image); unlink($oldimage_name); return true; } ?>

Langkah 3 :

Buatlah form upload serta tampilan gambar hasil proses watermark. Untuk kali ini kita mengatur gambar contoh dalam ukuran 300x300px. Anda bisa mengubahnya ke ukuran aslinya atau ukuran yang lebih besar ataupun kecil.

<?php $demo_image = ""; if(isset($_POST['createmark']) and $_POST['createmark'] == "Submit"){ $valid_formats = array("jpg","bmp","jpeg"); $name = $_FILES['imgfile']['name']; if(strlen($name)) { list($txt, $ext) = explode(".", $name); if(in_array($ext,$valid_formats)&& $_FILES['imgfile']['size'] <= 1024*1024){ // 1024*1024 = 1 MB limit upload image $upload_status = move_uploaded_file($_FILES['imgfile']['tmp_name'], $path.$_FILES['imgfile']['name']); if($upload_status){ $new_name = $path.time().".jpg"; if($_GET['mode']=="img"){ if(watermark_image($path.$_FILES['imgfile']['name'], $new_name)) $demo_image = $new_name; } else { if(watermark_text($path.$_FILES['imgfile']['name'], $new_name)) $demo_image = $new_name; } } } } else { $msg="File size Max 1 M or Invalid file format supports .jpg and .bmp"; } } ?>   <html> <head> <title>PHP Text Watermark</title> <style type="text/css"> body{ width:800px; margin: 15px auto; padding:0px; font-family: arial} </style> </head> <body> <h1><?php // navigasi Text / Image Watermark echo ($_GET['mode']!="img")? "Text WaterMark | <a href='".$PHP['SELF']."?mode=img'>Image WaterMark</a>" : "<a href='".$_SERVER['PHP_SELF']."'>Text WaterMark</a> | Image WaterMark"; ?></h1> <form name="imageUpload" id="imageUpload" method="post" enctype="multipart/form-data" > <fieldset> <legend>Upload Image</legend> Image :<input type="file" name="imgfile" id="imgfile"/><br /> <input type="submit" name="createmark" id="createmark" value="Submit" /> </fieldset> <?php // tampilkan gambar di sini if(!empty($demo_image)) echo '<br/><center><img src="'.$demo_image.'" /></center>'; else echo '<h3>'.$msg.'</h3>'; ?> </form> </body> </html>

Langkah 4 :

Gabungkan semua kode di atas. Jika sudah benar, maka akan tampil seperti ini :




Cukup mudah bukan untuk membuatnya? Selamat mencoba

DOWNLOAD

(thePinkFighter)

indra_kaze

pusing gan..

e_ndferis

Bagus banget artikelnya. mksh gan jadi nambah pengetahuan kita orang

ableh

http://en.wikipedia.org/wiki/Watermark

:-$

saiddaus

Wow, keren, blehh..! Ngirit waktu, gak perlu lagi ngedit image satu2. Cm ekkeu ada masalah dikit, berhubung sering pake jpeg dan png, gmn cara bedainnya selain dari file extension. Bisa aja kansblm diaplod, gambar.jpg gw rename jd gambar.png. OOT yah? Sori deh kl gitu.

juliyan

terima kasih sharingnya. keren.

tapi bagaimana caranya supaya yang di resize hanya widthnya saja? sedangkan hight diseuaikan dari asli setelah diresize.

trus kalau function yg digunakan hanya image sedangkan yang text tidak mau digunakan bagaimana ya?

thx before

andstm

punya ane sudah berjalan dgn baik, tp kok ada notif gini an ya :

Notice: Undefined index: mode in C:\xampp\htdocs\php-watermark\watermark.php on line 6

Notice: Undefined index: mode inC:\xampp\htdocs\php-watermark\watermark.php on line 78

Notice: Undefined variable: PHP inC:\xampp\htdocs\php-watermark\watermark.php on line 78
Text WaterMark | Image WaterMark

Upload ImageImage :

Notice: Undefined variable: msg in C:\xampp\htdocs\php-watermark\watermark.php on line 90

gmn solusinya ya gn? thanks

Muhamad_Bagus_B

Mantap Gan

adipurnomo_dinus

keren gan

carwaxbsd

wah thx gan tips nya tpi kyk nya lebih enak pake potosop

mefta

makasih atassharenya.
sekalian belajar

ajikarsono

Dicoba dulu ntar ajari ya kalau ERROR,,,

seojati1

Wah saran-sarannya mantep...

Bisa dicoba nih


Thank u Gan...

freezy

boleh di coba...

pagandeng

mantap, segera di bookmark dulu