Laravel 8 Social Media Share Buttons Integration Tutorial

Last updated on: by Editorial Team

In this quick guide, we will explain how to implement social media share buttons on every page of the Laravel 8 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 8 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 8

  • 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-demo
cd laravel-demo

Add 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-share

Register 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 SocialShareButtonsController

Update 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 serve
http://127.0.0.1:8000/social-media-share

Laravel Social 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 8 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.