Laravel Add Watermark on Image

May 02, 2019
Article · 4 min
792 words

Like (0)
Favorite (0)

Today I am going to share how to add watermark on an image in Laravel. By using intervention image, we can easily add watermark on the image. So, let’s start:

Table of Contents

Install and Configure Package
Create a Controller
Register Routes
Create a Blade File
Run the Project and Test

Step 1 : Install and Configure Package

We are going to use intervention/image package. To install this, go to your project folder using CMD and type this command:

composer require intervention/image

Laravel 5.4 or lower: After installation, we need to set provider and alias in config>app.php. Open app.php and add two lines in providers and aliases array like this:

app.php

.....
'providers' => [
	....
	Intervention\Image\ImageServiceProvider::class,
]
'aliases' => [
	....
	'Image' => Intervention\Image\Facades\Image::class,
]
.....

Step 2 : Create a Controller

Let’s create a controller named “WaterMarkController”. Type this command to create the controller:

php artisan make:controller WaterMarkController

Open the controller from app>Http>Controllers and paste this code:

WaterMarkController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Image;

class WaterMarkController extends Controller
{
    public function imageWatermark()
    {
        $img = Image::make(public_path('images/background.png'));

        /* insert watermark at bottom-right corner with 10px offset */
        $img->insert(public_path('images/watermark.png'), 'bottom-right', 10, 10);

        $img->save(public_path('images/new-image.png'));

        $img->encode('png');
        $type = 'png';
        $new_image = 'data:image/' . $type . ';base64,' . base64_encode($img);

        return view('show_watermark', compact('new_image'));
    }

    public function textWatermark()
    {
        $img = Image::make(public_path('images/background.png'));

        $img->text('MyNotePaper', 710, 370, function ($font) {
            $font->file(public_path('font/amandasignature.ttf'));
            $font->size(30);
            $font->color('#f4d442');
            $font->align('center');
            $font->valign('top');
            $font->angle(0);
        });

        $img->save(public_path('images/new-image.png'));

        $img->encode('png');
        $type = 'png';
        $new_image = 'data:image/' . $type . ';base64,' . base64_encode($img);

        return view('show_watermark', compact('new_image'));
    }
}

I have created two methods. One for image watermark called imageWatermark() and another for text watermark textWatermark().

Step 3 : Register Routes

Open routes>web.php and define two routes:

WaterMarkController.php

<?php

Route::get('watermark-image', 'WaterMarkController@imageWatermark');
Route::get('watermark-text', 'WaterMarkController@textWatermark');

Step 4 : Create a Blade File

Navigate to resources>views and create a file called ”
show_watermark.blade.php”. Then open the file and paste this code:

show_watermark.blade.php

<!doctype html>
<html lang="en">
<head>
    <title>Laravel Add Watermark on Images</title>
</head>
<body style="margin-top: 40px; text-align: center;">

<h1>Laravel Add Watermark</h1>

<img src="{{$new_image}}" alt="Watermark">

</body>
</html>

Step 5 : Run the Project and Test

Now run the project and visit the http://localhost:8000/watermark-image route to see the image watermark output:

Visit http://localhost:8000/watermark-text to see the text watermark. For the text watermark, I’ve used Amanda Signature font.

You can see more integration way from Intervention Image’s official website.

Thank you.

Laravel

Md Obydullah

Software Engineer | Ethical Hacker & Cybersecurity...

Md Obydullah is a software engineer and full stack developer specialist at Laravel, Django, Vue.js, Node.js, Android, Linux Server, and Ethichal Hacking.