Laravel - Add Share Social Media Button Example

Laravel 8 – add social media buttons example. In this tutorial you will learn How to add share social media buttons in laravel apps.

Sometimes, you may need to add social media buttons in laravel 8,7,6 app . So, this tutorial will help you step by step to add social share buttons in laravel apps.

How To Add Share Social Media Button In Laravel?

Follow the below given steps and add share social media buttons in laravel apps:

Step 1 – Install Laravel 8 App
Step 2 – Connecting App to Database
Step 3 – Install Social Media Button Package
Step 4 – Add Route
Step 5 – Generate Controller by Command
Step 6 – Create Blade View
Step 7 – Run Development Server
Step 8 – Test This App

Step 1 – Install Laravel 8 App

First of all, Execute the following command on the terminal to install/download laravel 8 application in your system(server):

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

Step 2 – Connecting App to Database

After that, open “.env” file and update the database name, username and password in the env file:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=Enter_Your_Database_Name
DB_USERNAME=Enter_Your_Database_Username
DB_PASSWORD=Enter_Your_Database_Password

Step 3 – Install Social Media Button Package

In this step, execute the folllowing command on your terminal to install social media button package in laravel apps:

composer require jorenvanhocht/laravel-share

After that, visit config directory and open app.php file. And add the following code into it:

config/app.php

'aliases' => [
    'Share' => Jorenvh\Share\ShareFacade::class,
]

Now execute the following command on terminal to publish config file:

php artisan vendor:publish --provider="Jorenvh\Share\Providers\ShareServiceProvider"

Step 4 – Add Route

In this step, add routes in the web.php file. Go to app/routes/web.php file and following routes in web.php file:

use App\Http\Controllers\ShareSocialController; 
 
Route::get('/share-social', [ShareSocialController::class,'shareSocial']);

Step 5 – Generate Controller by Command

In this step, execute the following command on terminal to create a controller name ShareSocialController. So you need to use the below command and create Controller :

php artisan make:controller ShareSocialController

After successfully create controller go to app/controllers/ShareSocialController.php and update the following code :

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;

class ShareSocialController extends Controller
{
    public function shareSocial()
    {
        $socialShare = \Share::page(
            'https://www.abc.com/laravel-custom-foreign-key-name-example',
            'Laravel Custom Foreign Key Name Example',
        )
        ->facebook()
        ->twitter()
        ->reddit()
        ->linkedin()
        ->whatsapp()
        ->telegram();
        
        return view('share-social', compact('socialShare'));
    }
}

Step 6 – Create Blade View

In this step, visit /resources/views/ directory and create a new blade view file, which name share-social.blade.php. And add the following code into it:

<!DOCTYPE html>
<html>
<head>
    <title>How to Add Share Social Media Button in Laravel - Tutsmake.com</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js" integrity="sha512-XKa9Hemdy1Ui3KSGgJdgMyYlUg1gM+QhL6cnlyTe2qzMCYm4nAZ1PsVerQzTTXzonUR+dmswHqgJPuwCq1MaAg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css" integrity="sha512-P5MgMn1jBN01asBgU0z60Qk4QxiXo86+wlFahKrsQf37c9cro517WzVSPPV1tDKzhku2iJ2FVgL67wG03SGnNA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <style type="text/css">
        li{
            list-style: none;
            background: #e2e2e2;
            margin-left: 5px;
            text-align: center;
            border-radius:5px;
        }
        li span{
            font-size: 20px;
        }
        ul li{
            display: inline-block;
            padding: 10px 10px 5px;
        }
        #social-links{
            float: left;
        }
    </style>
</head>
<body>
    <div class="row mt-5">
        <div class="col-md-6 offset-3">
            <div class="card">
                <div class="card-header bg-info text-white">
                    <h5>How to Add Share Social Media Button in Laravel - tutsmake.com</h5>
                </div>
                <div class="card-body">
                    <strong class="float-left pt-2">Social Media : </strong>
                    {!! $socialShare !!}
                </div>
            </div>
        </div>
    </div>
</body>
</html>

Step 7 – Run Development Server

In this step, execute the following command on the terminal to start development server:

 php artisan serve
 If you want to run the project diffrent port so use this below command 
 php artisan serve --port=8080

Step 68- Test This App

Open your browser and hit the following url on it:

http://localhost:8000/share-social

Conclusion

Laravel 8 – add social media buttons example. In this tutorial, you have to learn How to add share social media buttons in laravel apps.

If you want to know more about this package. So you can visit the https://github.com/jorenvh/laravel-share.

Laravel – Add Share Social Media Button Example