Laravel 8 Add Watermark On Image

In this article, we will see laravel 8 add watermark on the image. When you want to display any text like any important information, any copyrighted content on your website, or any other name in the image at that time we can use watermark text. Here we will use PHP image intervention library for Intervention image watermark text example or laravel 8 add text overlay watermark on image.

So, let's see  how to add watermark on the image in laravel 8, how to add watermark text on the image in laravel 8, laravel 8 add watermark to image, add watermark to the image in laravel 7/8, intervention image watermark, intervention image laravel

Intervention Image is an open-source library it is used for image manipulation in PHP-based projects.

Step 1: Create New Laravel Application For Laravel 8 Add Watermark On Image

Step 2: Install Image Intervention Package For Add Watermark Text on Image In Laravel 8

Step 3: Update Config/app.php File

Step 4: Create Controller

Step 5: Add Route

Step 6: Create Blade File For Upload Image

 

Step 1: Create New Laravel Application For Laravel 8 Add Watermark On Image

In this step, we will create a new project for laravel 8 add text overlay watermark on the image example.

composer create-project --prefer-dist laravel/laravel Blog

 

 

Step 2: Install Image Intervention Package For Add Watermark Text On Image in Laravel 8

Now, we will install the intervention/image package using the composer command.

composer require intervention/image

 

Step 3: Update Config/app.php File

In this step, we will add providers and aliases in the Config/app.php file.

<?php

return [

	$providers => [
		
		'Intervention\Image\ImageServiceProvider'
	],

	$aliases => [
		
		'Image' => 'Intervention\Image\Facades\Image'
	]

]

 

Step 4: Create Controller

Here, we will create AddImageController.

php artisan make:controller AddImageController

 

 

<?php

namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Image;


class AddImageController extends Controller
{

    public function index()
    {
        return view('welcome');
    }
 
    public function imageFileUpload(Request $request)
    {
        $this->validate($request, [
            'file' => 'required|image|mimes:jpg,jpeg,png,gif,svg|max:4096',
        ]);

        $image = $request->file('file');
        $input['file'] = time().'.'.$image->getClientOriginalExtension();

        $imgFile = Image::make($image->getRealPath());

        $imgFile->text('© 2022 Techsolutionstuff', 100, 100, function($font) { 
            $font->size(50);  
            $font->color('#f1f1f1');  
            $font->align('center');  
            $font->valign('bottom');  
        })->save(public_path('/upload').'/'.$input['file']);          

        return back()
        	->with('success','File uploaded successfully ')
        	->with('fileName',$input['file']);         
    }
}

Note: Create upload folder in your public directory, path look like public/upload.

 

Step 5: Add Route
<?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\AddImageController;


Route::get('/file-upload', [AddImageController::class, 'index']);

Route::post('/add-watermark', [AddImageController::class, 'imageFileUpload'])->name('image.watermark');

 

 

Step 6: Create Blade File For Upload image

Now, add the below code in the resources/views/welcome.blade.php file.

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <title>Laravel 8 Add Watermark On Image - Techsolutionstuff</title>
</head>

<body>
    <div class="container">
        <h1>Laravel 8 Add Watermark On Image - Techsolutionstuff</h2>

        <form action="{{route('image.watermark')}}" enctype="multipart/form-data" method="post">
            @csrf
            @if ($message = Session::get('success'))
            <div class="alert alert-success">
                <strong>{{ $message }}</strong>
            </div>

            <div class="col-md-12 text-center">                
                <img src="/uploads/{{ Session::get('fileName') }}" width="100%"/>
            </div>
            @endif

            @if (count($errors) > 0)
            <div class="alert alert-danger">
                <ul>
                    @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
            @endif

            <div class="mb-3">
                <input type="file" name="file" class="form-control"  id="formFile">
            </div>

            <div class="d-grid mt-4">
                <button type="submit" name="submit" class="btn btn-primary">
                    Upload File
                </button>
            </div>
        </form>
    </div>
</body>

</html>

 


You might also like :

techsolutionstuff

Techsolutionstuff | The Complete Guide

I'm a software engineer and the founder of techsolutionstuff.com. Hailing from India, I craft articles, tutorials, tricks, and tips to aid developers. Explore Laravel, PHP, MySQL, jQuery, Bootstrap, Node.js, Vue.js, and AngularJS in our tech stack.

RECOMMENDED POSTS

FEATURE POSTS