In this quick guide, we will explain how to implement social media share buttons on every page of the Laravel application using the exorbitantly handy jorenvanhocht/laravel-share package.
Social media share buttons are comprehensively helpful in making your content to reach a larger audience; social share icons proliferate the quality of your site’s content.
The social sharing button enhances the chance of free promotion of your content. These buttons are added to every page of your site and provide an eloquent way to share the most useful content of your site with your site visitors.
If you are a laravel developer, you better deserve to know how to integrate the social media share button in the laravel app.
In order to make this process tutorial facile, we will use the jorenvanhocht/laravel-share package, and you can download this package using the Composer tool, as you won’t have to reinvent the wheel.
This Laravel8 social media share buttons example is utterly dependent on the jorenvanhocht/laravel-share package.
It is a PHP-based library that allows you to generate various social share links. After installing this package into your project, you will be able to create social share links for Facebook, Twitter, Linkedin, WhatsApp, Reddit and Telegram.
How to Integrate Social Share Button in Laravel 9
- Step 1: Download Laravel App
- Step 2: Add Laravel Share Package
- Step 3: Register Laravel Share
- Step 4: Set Up New Controller
- Step 5: Create Route
- Step 6: Add Social Media Share Buttons in View
- Step 7: Start Application
Download Laravel App
Let us start by creating a new laravel app; use provided command, you may change the project name as per your choice.
composer create-project --prefer-dist laravel/laravel laravel-democd laravel-demoAdd Laravel Share Package
In your view, bring up the console screen, next type the suggested command, after that hit enter to start installing the laravel share library.
composer require jorenvanhocht/laravel-shareRegister Laravel Share
In order to take complete advantage of the package, make sure to register the ServiceProvider and the facade, respectively, in the config/app.php file.
<?php
return [
'providers' => [
...
...
Jorenvh\Share\Providers\ShareServiceProvider::class,
];
'aliases' => [
...
...
'Share' => Jorenvh\Share\ShareFacade::class,
];
];Head over to the console window again and bother to publish the package config & resource files.
php artisan vendor:publish --provider="Jorenvh\Share\Providers\ShareServiceProvider"Remember, if you update to the latest version of laravel, then make sure to republish the config file again.
Set Up New Controller
Generate a controller file; here, you will define the functions to add the social media share buttons and loading the view template to show the share buttons in the browser.
php artisan make:controller SocialShareButtonsControllerUpdate the code inside the app/Http/Controllers/SocialShareButtonsController.php file.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class SocialShareButtonsController extends Controller
{
public function ShareWidget()
{
$shareComponent = \Share::page(
'https://www.positronx.io/create-autocomplete-search-in-laravel-with-typeahead-js/',
'Your share text comes here',
)
->facebook()
->twitter()
->linkedin()
->telegram()
->whatsapp()
->reddit();
return view('posts', compact('shareComponent'));
}
}Create Route
Eventually, you need a route to be added in the route/web.php; it helps to integrate the social share button on every page.
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\SocialShareButtonsController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
*/
Route::get('/social-media-share', [SocialShareButtonsController::class,'ShareWidget']);Add Social Media Share Buttons in View
Now, head over to resources/views inside here create post.blade.php file, in this file you have to import the bootstrap css, font-awesome links also add the {!! $shareComponent !!} variable to show the social share buttons in laravel.
Update code in resources/views/posts.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">
<title>Implement Social Share Button in Laravel</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
<style>
div#social-links {
margin: 0 auto;
max-width: 500px;
}
div#social-links ul li {
display: inline-block;
}
div#social-links ul li a {
padding: 20px;
border: 1px solid #ccc;
margin: 1px;
font-size: 30px;
color: #222;
background-color: #ccc;
}
</style>
</head>
<body>
<div class="container mt-4">
<h2 class="mb-5 text-center">Laravel Social Share Buttons Example</h2>
{!! $shareComponent !!}
</div>
</body>
</html>Start Application
Every piece has been placed at its place, finally invoke the laravel development server and view the app on the browser using the below url.
php artisan servehttp://127.0.0.1:8000/social-media-share
Conclusion
In this quick guide, we did our level’s best to explain about adding social media share buttons on every page of your Laravel application.
We took the help of a third-party PHP library (laravel-share) to ease down our work, hope we did our level best and offered the best solution for adding the social media share button in laravel.
