Laravel Add Watermark on Image

avatar
May 02, 2019 · Article · 4 min, 792 words

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

  1. Install and Configure Package
  2. Create a Controller
  3. Register Routes
  4. Create a Blade File
  5. 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', '[email protected]');
Route::get('watermark-text', '[email protected]');

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.

Comments

No comments yet…