I am testing a script where I watermark an image in my webpage.

The script works fine and the image is watermark but my problem is that only the image is displayed on the page.

As soon as I add the script to my page it's like the web page is converted to the image that I'm watermarking.

I think it's because of header("content-type: image/jpeg"); from the code.

I need to watermark the image on my webpage but I also need the rest of my webpage to be displayed too.

How is this done? I'm quite confused on how this works.

The script I'm using is from here

Here's the code I'm using:

<?php  

$main_img       = "Porsche_911_996_Carrera_4S.jpg"; // main big photo / picture
$watermark_img  = "watermark.gif"; // use GIF or PNG, JPEG has no tranparency support
$padding        = 3; // distance to border in pixels for watermark image
$opacity        = 100;  // image opacity for transparent watermark

$watermark  = imagecreatefromgif($watermark_img); // create watermark
$image      = imagecreatefromjpeg($main_img); // create main graphic

if(!$image || !$watermark) die("Error: main image or watermark could not be loaded!");


$watermark_size     = getimagesize($watermark_img);
$watermark_width    = $watermark_size[0];  
$watermark_height   = $watermark_size[1];  

$image_size     = getimagesize($main_img);  
$dest_x         = $image_size[0] - $watermark_width - $padding;  
$dest_y         = $image_size[1] - $watermark_height - $padding;


// copy watermark on main image
imagecopymerge($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_width, $watermark_height, $opacity);


// print image to screen
header("content-type: image/jpeg");   
imagejpeg($image);  
imagedestroy($image);  
imagedestroy($watermark);  

?>

NOTE: I'm getting the image path from the database so I cannot hardcode the image filename as it's dynamic.