Képek vízjelezése PNG képpel és PHP-val


Webáruház fejlesztés közben jött a megrendelő kérése, hogy szeretné, ha a termék képek vízjellel lennének ellátva. Nos, hosszas keresés és kutakodás után, nem találtam olyan szkriptet, amely megfelelően működött is volna, ezért nekiültem, és írtam egyet. Íme:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<?
 
	$wm_file = 'watermark.png';	
 
	$filename = $_GET['file'];
 
	// Content type
	header('Content-type: image/jpeg');		
 
	$watermark = imagecreatefrompng($wm_file);
	$image = imagecreatefromjpeg($filename);
 
	$img_width = imagesx($image);
	$img_height = imagesy($image);
 
	list($wm_width,$wm_height) = getimagesize($wm_file);
 
	for($h=0;$h<=$img_height;$h+=$wm_height)
	{
		for($w=0;$w<=$img_width;$w+=$wm_width)
		{
			imagecopyresampled($image,$watermark,$w,$h,0,0,$wm_width,$wm_height,$wm_width,$wm_height);
		}
	}
 
	imagejpeg($image, NULL, 100);
?>

Használat: a $wm_file-ban kell megadnunk, azt a PNG képet, amelyet a képen szeretnénk viszontlátni. Majd meghívjuk a fájlt a következőképpen:

watermark.php?file=kep.jpg

HTML-be illesztve:

1
<img src="watermark.php?file=kep.jpg" alt="" />

FIGYELEM: A vízjel ismétlődve (mozaikszerűen) jelenik meg a képen, illetve e megoldásban nincs cache réteg illetve nem figyeli a bejövő fájlnevet.

Kapcsolódó bejegyzések:
  • A képek kezelésére eddig is jó néhány igen különböző függvény tár a rendelkezésünkre állt (gd, gd2, imagemagick, netpbm, Magick Wand), de használatukhoz mindig e …

  • Ezt a leírást abból az apropóból írom, hogy végre megírtam függvénybe a képfelöltő form feldolgozását. Boldogul 1 vagy több kép mezővel is, és csak jpg, gif és p …

  • Felmerült ma délután egy kérdés és mivel hirtelen én sem tudtam rá a pontos választ, utánanéztem. A kérdés az alábbi volt: hogy lehet a böngészőt letöltési ablak …

  • Háttérként egyéni képek használata egyszerű módja annak, hogy érdekesebbé tedd az űrlapjaidat. CSS-vel ezt pár soros egyszerű kóddal megtehetjük.…

  • Az előző cikkben (Intype editor) volt már arról szó, hogy lehet az Intype-ban 1-1 plusz snippet-et felvenni, ami 1 tag begépelésére kiír egy megadott kódot. Ez n …

A cikket beküldte: Methos (http://methos.fishworks.hu/)

10 hozzászólás

  1. Satya says:

    Hy!

    Mgcsináltam amit írtál, létrehoztam a két fájlt. Beillesztem a léplinket a php-ba, aztán uj html oldalt nyitok hivatkozok a kép (kepek.php?file=hirek.jpeg. és nem tolt be a kép. a kép amugy hirek.png volt.

  2. Javit says:

    Ha a hirek.png -ét akarod konvertalni, akkor miért a hirek.jpg-et adod meg… annak úgy nem sok érteleme van.

  3. Lala says:

    Sziasztok,
    csak olvasgattam eddig és tanultam sokmindent, amit itt-ott hasznosítottam is.
    De most ez a cikk nagyon kapóra jött, pont ilyet kellett nekem is csinálnom, bár csak a kép közepére kellett betennem egy logót. De innen indulva nagyon könnyedén ment :)

    Köszi Nektek a sok jó ötletet!

  4. Devil says:

    Sziasztok!
    Én is megcsináltam ezt a vizjelezést,de nekem sem müxik…..
    mindent megprobáltam,de nem hívja meg a képet….
    kiterjesztésre is odafigyeltem
    valakinek van ötlete?

  5. Vöri says:

    Üdv!

    Jelezném mindenkinek, hogy ez a megoldás JÓ! Csak azért írom, mert csomót küzdöttem több megoldással, de ez azonnal, pofa nélkül megy, ráadásul .png-vel, nem .gif-el!

    Már csak valahogy be kell rakni a sarokba :D!

  6. tsaby says:

    hali!
    én is irtam erre egy függvényt. kicsit talán túlbonyolítottam… ez egyből el is menti úgy a képet hogy rajta van a vízjel.

    1
    2
    3
    4
    5
    6
    7
    
     100){
    		$percent = 100;
    	}
    	$destination = imagecreatefromjpeg($picture);
    	$dest_data = getimagesize($picture);
    	$waterMarkData = getimagesize($wmpic);
    	if ($dest_data[0]*($percent/100)

    Viszont!!! A vízjel ugye többnyire PNG… de mikor rákerül a képre, a PNG átlátszó részei nem lesznek átlátszóak.(tehát pl egy szöveg ami átlátszó háttér előtt van, mikor rákerül vízjelként, a háttér is látszódni fog) Erre valakinek megoldás? Vagy mi? vagy hogy? :)

  7. Lala says:

    Én írtam egy függvényt, ami elvégzi a vízjel elhelyezést.
    A függvény vár egy imagecreatexxx-szel előkészített image azonosítót és azt, hogy hová pozícionálja a vízjelet (F-fent, középen; L-lent, középen, egyébként pedig középen).
    Ráteszi a vízjelet és visszaadja az image azonosítót, de immár az image-ben benne van a vízjel.
    Nekem tökéletesen működik.

    Íme a függvény:
    function includeWatermark( $image, $hol=’F’)
    {
    $vizjel = $this->rootdir.”/aingatlan_watermark.png”;

    $watermark = imagecreatefrompng($vizjel);

    $img_width = imagesx($image);
    $img_height = imagesy($image);

    $wm_width = imagesx($watermark);
    $wm_height = imagesy($watermark);

    $w = 0; #floor( ($img_width-$wm_width)/2);
    if ( $hol==”F”)
    $h = 0;
    elseif ($hol==’L’)
    $h = $img_height-$wm_height;
    else
    $h = floor( ($img_height-$wm_height)/2);

    imagecopyresampled($image,$watermark,$w,$h,0,0,$wm_width,$wm_height,$wm_width,$wm_height);

    return $image;
    }

  8. Lala says:

    oppá, lemaradt a kódbeillesztő kód :(

    Egyébként jópár cikket nem tudok elolvasni, mert csak a szerző van kiírva, a cikk nem jelenik meg (a hozzászólások és egyéb ilyesmi azonban látható). Ilyen többek között a wp-syntax cikk is, ahol meg akartam nézni, hogy hogyan kell beilleszteni a kódot.

  9. swad says:

    watermark.png ill a kep .png eleresi utjat persze meglehet adni másképp is

    1
    
    (GET[]); ($system->SETTINGS['siteurl'].'images/watermark.png';)

    etc

  10. B says:

    Nálam is baj van a cikkekkel. De az előnézet szerint
    (Ctrl+í)pre lang=”programnyelv” line=”szám”(Ctrl+y)
    kód
    (ctrl+í)/pre(ctrl+y)

    Ui. A kisebb-nagyobb zárójeleket a ctrl+í ctrl+y jellel láttam el, mert nem akarja egyébként megjeleníteni. Azt hiszem.

Szólj hozzá
a Képek vízjelezése PNG képpel és PHP-val c. bejegyzéshez

- Engedélyezett HTML elemek: <a> <em> <strong> <ul> <ol> <li>
- Forráskód beküldéséhez tedd a kódot ezek közé: <pre lang="php" line="1">Kódrészlet helye itt</pre>