Image not found

Social Media Share Integration in Laravel.

Comment (0)

Admin

281


Step 1: Install jorenvanhocht/laravel-share Package

First step, we need install jorenvanhocht/laravel-share composer package so let's use bellow command to install: 

composer require jorenvanhocht/laravel-share

 

Register Laravel Share

Make sure to register the library package that we have installed in the config/app.php file.

<?php
  return [
    'providers' => [
        ...
        ...        
        Jorenvh\Share\Providers\ShareServiceProvider::class,
    ];
    'aliases' => [
        ...
        ...                
        'Share' => Jorenvh\Share\ShareFacade::class,
    ];
  ];

 

after installing successfully, we need to publish configuration file using bellow command:

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

 

Step 2: Create Route 

In this is step we need to create some routes for social share example view. 

routes/web.php

<?php
  
use Illuminate\Support\Facades\Route;
  
use App\Http\Controllers\SocialShareController;
  
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('social-share', [SocialShareController::class, 'index']);

 

How to filter data with date

 

After create controller add following code on that file:

app/Http/Controllers/SocialShareController.php 

<?php
  
namespace App\Http\Controllers;
  
use Illuminate\Http\Request;
use App\Models\Post;
  
class SocialShareController extends Controller
{
    /**
     * Write code on Method
     *
     * @return response()
     */
    public function index()
    {
        $shareComponent = \Share::page(
            'https://www.nijwel.xyz/stories/details/social-media-share-integration-in-laravel/',
            'Your share text comes here',
        )
        ->facebook()
        ->twitter()
        ->linkedin()
        ->telegram()
        ->whatsapp()        
        ->reddit();
        
        return view('posts', compact('shareComponent'));
    }
}

 

Step 4: Create Blade Files 

here, we need to create blade files for socialshare. so let's create one by one files:

<!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 - nijwel.xyz</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>
            .social-btn-sp #social-links {
                margin: 0 auto;
                max-width: 500px;
            }
            .social-btn-sp #social-links ul li {
                display: inline-block;
            }          
            .social-btn-sp #social-links ul li a {
                padding: 15px;
                border: 1px solid #ccc;
                margin: 1px;
                font-size: 30px;
            }
            table #social-links{
                display: inline-table;
            }
            table #social-links ul li{
                display: inline;
            }
            table #social-links ul li a{
                padding: 5px;
                border: 1px solid #ccc;
                margin: 1px;
                font-size: 15px;
                background: #e3e3ea;
            }
        </style>
    </head>
    <body>
        <div class="container mt-4">
            <h2 class="mb-5 text-center">Laravel Social Share Buttons Example - nijwel.xyz</h2>
 
            <div class="social-btn-sp">
                {!! $shareButtons !!}
            </div>
        </div>
    </body>
</html> 

 

If you want to share single social platform (Ex: Only facebook share or only whatsapp share ) 

<!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 - nijwel.xyz</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>
            .social-btn-sp #social-links {
                margin: 0 auto;
                max-width: 500px;
            }
            .social-btn-sp #social-links ul li {
                display: inline-block;
            }          
            .social-btn-sp #social-links ul li a {
                padding: 15px;
                border: 1px solid #ccc;
                margin: 1px;
                font-size: 30px;
            }
            table #social-links{
                display: inline-table;
            }
            table #social-links ul li{
                display: inline;
            }
            table #social-links ul li a{
                padding: 5px;
                border: 1px solid #ccc;
                margin: 1px;
                font-size: 15px;
                background: #e3e3ea;
            }
        </style>
  
    </head>
    <body>
        <div class="container mt-4">
            <h2 class="mb-5 text-center">Laravel Social Share Buttons Example - nijwel.xyz</h2>
  
            <div class="social">
               <ul class="social-ul">
                  <li class="social-list" style="margin-right: 10px;">
                    <span style="font-size:26px;" >{!! Share::page(url('/stories/details/social-media-share-integration-in-laravel'))->facebook() !!}</span>
                  </li>
                  <li class="social-list" style="margin-right: 10px;">
                    <span style="font-size:26px;" > {!! Share::page(url('/stories/details/social-media-share-integration-in-laravel'))->twitter() !!}</span>
                  </li>
                  <li class="social-list" style="margin-right: 10px;">
                     <span style="font-size:26px;" >{!! Share::page(url('/stories/details/social-media-share-integration-in-laravel'))->whatsapp() !!}</span>
                  </li>
                  <li class="social-list" style="margin-right: 10px;">
                     <span style="font-size:26px;" >{!! Share::page(url('/stories/details/social-media-share-integration-in-laravel'))->linkedin() !!}</span>
                  </li>
                  <li class="social-list" style="margin-right: 10px;">
                     <span style="font-size:26px;" >{!! Share::page(url('/stories/details/social-media-share-integration-in-laravel'))->telegram() !!}</span>
                  </li>
                  <li class="social-list" style="margin-right: 10px;">
                     <span style="font-size:26px;" >{!! Share::page(url('/stories/details/social-media-share-integration-in-laravel'))->reddit() !!}</span>
                  </li>
               </ul>
             </div>
        </div>
    </body>
</html>

 

Hope it will help you......

Any Question please comment.

Thanks ! 


Others Problem Fix Stroy



Comments (0)

Your Comment