This post is also available in:
English
Hallo apa kabar teman semuanya, semoga kalian sehat dan sukses selalu. Kembali lagi bersama mantan programmer, kali ini kita akan membahas cara integrasi Social Media Share dengan Laravel.
Kita akan implementasi social media share di setiap halaman menggunakan paket jorenvanhocht/laravel-share. Kita akan membuat button dari setiap halaman yang akan kita gunakan untuk membagi konten di setiap social media yang telah kita aktifkan.
Social media sangat membantu untuk meningkatkan jumlah pengunjung website dan ini merupakan promosi gratis. Agar fitur ini berjalan maka kita harus install paket jorenvanhocht/laravel-share, kalian dapat download menggunakan composer.
Ini adalah library berbasis PHP yang memungkinkan Anda menghasilkan berbagai tautan berbagi sosial. Setelah menginstal paket ini ke dalam proyek Anda, Anda akan dapat membuat tautan berbagi sosial untuk Facebook, Twitter, Linkedin, WhatsApp, Reddit, dan Telegram.
Ikuti beberapa tahapan cara intergasi social media share sebagai berikut:
- Download Laravel App
- Tambahkan laravel paket share
- Tambahkan Controller
- Tambahkan Route
- Buatlah View
- Start Application
kalian dapat mempelajari tutorial yang lainnya di sini:
Integrasi Paypal Payment Gateway Dengan Laravel
Membuat Rating dan Ulasan Dengan Laravel
Download Laravel App
Kita mulai dengan membuat project laravel baru kita, menggunakan composer.
composer create-project --prefer-dist laravel/laravel laravel-socmedcd laravel-socmedTambahkan laravel paket share
Dalam tampilan Anda, buka layar terminal, selanjutnya ketik perintah yang disarankan, setelah itu tekan enter untuk mulai menginstal perpustakaan berbagi laravel.
composer require jorenvanhocht/laravel-shareRegister Laravel Share
Pastikan untuk mendaftarkan paket library yang telah kita install di file config/app.php.
<?php
return [
'providers' => [
...
...
Jorenvh\Share\Providers\ShareServiceProvider::class,
];
'aliases' => [
...
...
'Share' => Jorenvh\Share\ShareFacade::class,
];
];Dan buka kembali terminal masukan perintah ini.
php artisan vendor:publish --provider="Jorenvh\Share\Providers\ShareServiceProvider"Tambahkan Controller
Buat file controller menggunakan php artisan untuk memasukan kode media share. Ini merupakan fungsi utama yang akan kita buat.
php artisan make:controller SocialShareButtonsControllerSesuaikoan kode seperti di bawah ini
File app/Http/Controllers/SocialShareButtonsController.php.
<?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'));
}
}Tambahkan Route
Kalian perlu menambahkan route di route/web.php. Ini akan menghubungkan view dengan controller yang kita buat.
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\SocialShareButtonsController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
*/
Route::get('/social-media-share', [SocialShareButtonsController::class,'ShareWidget']);Buatlah View
Sekarang kita akan buat view untuk menampilkan button share di resources/views. Berikan nama post.blade.php. Import bootstrap dan buatlah beberapa baris css.
File resources/views/posts.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">
<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
Setelah beberapa file kita buat, maka langkah selanjutnya jalankan aplikasi menggunakan terminal.
php artisan servehttp://127.0.0.1:8000/social-media-share
Demikian tutorial kali kali ini yang dapat saya buat, semoga bermanfaat.
Terimakasih.
