In this article, we will how to add a watermark to an image in laravel 10. Here we will learn about laravel 10 adding a watermark on the image. You can add image and also you can add text to the image. Here, we are using an intervention/image package in laravel 10.
When you want to display any text like any important information, any copyrighted content, your website, or any other name in the image at that time we can use watermark text. Here, we will use the PHP image intervention library for the Intervention image watermark text example
Intervention Image is a PHP image handling and manipulation library providing an easier and more expressive way to create, edit, and compose images. The package includes ServiceProviders and Facades for easy Laravel integration.
Intervention Image is an open-source library it is used for image manipulation in PHP-based projects.
So, let's see laravel 10 add a watermark to the image, laravel add a watermark on the Image, laravel 10 watermark pdf, laravel 10 add text to the image, and image intervention watermark in laravel 10.
In this step, we will install laravel 10 using the following command. So, run the below command to the terminal.
composer create-project --prefer-dist laravel/laravel laravel_10_watermark_exampleNow, we will install the intervention/image package using the composer command in laravel 10.
composer require intervention/imageIn this step, we will add providers and aliases in the app.php file. This step is optional.
config/app.php
<?php
return [
$providers => [
'Intervention\Image\ImageServiceProvider'
],
$aliases => [
'Image' => 'Intervention\Image\Facades\Image'
]
]By default, Intervention Image uses PHP's GD library extension to process all images. If you want to switch to Imagick, you can pull a configuration file into your application by running one of the following artisan commands.
Publish configuration in Laravel
php artisan vendor:publish --provider="Intervention\Image\ImageServiceProviderLaravelRecent"Here, we will create AddWatermarkImageController using the following command.
php artisan make:controller AddImageControllerapp/Http/Controllers/AddWatermarkImageController
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Image;
class AddWatermarkImageController extends Controller
{
public function index()
{
return view('index');
}
public function imageFileUpload(Request $request)
{
$this->validate($request, [
'file' => 'required|image|mimes:jpg,jpeg,png|max:4096',
]);
$image = $request->file('file');
$input['file'] = time().'.'.$image->getClientOriginalExtension();
$imgFile = Image::make($image->getRealPath());
$imgFile->text('© 2021 websolutionstuff.com', 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 an upload folder in your public directory, the path looks like public/upload.
Then, we will add routes to the web.php file.
routes/web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\AddWatermarkImageController;
Route::get('/', [AddWatermarkImageController::class, 'index']);
Route::post('/add-watermark', [AddWatermarkImageController::class, 'imageFileUpload'])->name('image.watermark');Now, we are creating the index.blade.php file. So, add the following HTML to that file.
resources/views/index.blade.php
<!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/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<title>How To Add Watermark On Image In Laravel 10- Websolutionstuff</title>
</head>
<body>
<div class="container">
<h1>How To Add Watermark On Image In Laravel 10- Websolutionstuff</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:
- Read Also: Laravel 10 CRUD Operation Step By Step
- Read Also: Google Map With Draggable Marker Example
- Read Also: Crop Image Before Upload Using Croppie Plugin
- Read Also: Drag and Drop File Upload Using Dropzone js in Laravel 9
