• Hi fellow developers,

    I’m looking for (preferably a wordpress plugin, but a custom github project is also okay) a tool and hoping you guys have some suggestions.

    The idea is as follows: A user can upload an image trough a form. When the image is uploaded an overlay / filter is added to the image. Then the user gets back the image with the overlay and can download the full result as a single jpg/png file. A little bit of repositioning of the image is optional but would be a plus.

    The filter is something a designer has made and is placed over the image. It is a bit similar to how you can place a filter over your facebook profile picture. So the result that the user can download is the image with the extra design included.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Hello,

    just so I understand this correct, by filter you mean a png that is just laid on top? What about the size, should the filter be scaled to fit the image?

    Thread Starter wdbkn

    (@wdbkn)

    Yeah, exactly. Maybe the better word for it is a frame. The image should be cropped to be square which is the size of the filter, and indeed either the filter/frame should be scaled to fit the image or the image should be scaled to fit the filter.

    Hi, this php code would fit the filter to the image:

    function apply_filter_to_image($original_image_path, $filter_image_path, $output_image_path) {
        // Load the original image
        $original_image = imagecreatefromstring(file_get_contents($original_image_path));
    
        // Load the filter image
        $filter_image = imagecreatefromstring(file_get_contents($filter_image_path));
    
        // Get the dimensions of the original image
        $original_width = imagesx($original_image);
        $original_height = imagesy($original_image);
    
        // Get the dimensions of the filter image
        $filter_width = imagesx($filter_image);
        $filter_height = imagesy($filter_image);
    
        // Scale the filter image to fit the original image
        $scaled_filter_width = $original_width;
        $scaled_filter_height = ($filter_height * $original_width) / $filter_width;
    
        // Create a new image with the dimensions of the original image
        $output_image = imagecreatetruecolor($original_width, $original_height);
    
        // Resize the filter image
        $resized_filter_image = imagecreatetruecolor($scaled_filter_width, $scaled_filter_height);
        imagecopyresampled(
            $resized_filter_image,
            $filter_image,
            0, 0, 0, 0,
            $scaled_filter_width, $scaled_filter_height,
            $filter_width, $filter_height
        );
    
        // Apply the filter to the original image
        imagecopy(
            $output_image,
            $original_image,
            0, 0, 0, 0,
            $original_width, $original_height
        );
    
        // Overlay the filter image on top of the original image
        $filter_x = 0; // Adjust the X-coordinate if you want to position the filter image
        $filter_y = 0; // Adjust the Y-coordinate if you want to position the filter image
        imagecopy(
            $output_image,
            $resized_filter_image,
            $filter_x, $filter_y, 0, 0,
            $scaled_filter_width, $scaled_filter_height
        );
    
        // Save the final image
        imagepng($output_image, $output_image_path);
    
        // Free up memory
        imagedestroy($original_image);
        imagedestroy($filter_image);
        imagedestroy($resized_filter_image);
        imagedestroy($output_image);
    }
    
Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Image edit plugin’ is closed to new replies.