feat: add Open Graph meta tags to enhance SEO and sharing capabilities

- Added Open Graph locale, title, type, URL, description, and image meta tags to the public layout. - Updated the portfolio show view to pass description and image data for Open Graph tags.

feat: add Open Graph meta tags to enhance SEO and sharing capabilities
5a1fb32d · Sofiane Lasri · 0d045a4a · 5a1fb32d · 5a1fb32d
Verified Commit 5a1fb32d authored 4 months ago by Sofiane Lasri
--- a/resources/views/layouts/public.blade.php
+++ b/resources/views/layouts/public.blade.php
@@ -8,6 +8,23 @@
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    @vite(['resources/scss/public.scss', 'resources/js/app.js'])
+    <meta property="og:locale" content="{{ config('app.locale') }}">
+    <meta property="og:locale:alternate" content="{{ config('app.fallback_locale') }}">
+    @if(!empty($title))
+        <meta property="og:title" content="{{ $title }}">
+    @endif
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="{{ url()->current() }}">
+    @if(!empty($description))
+        <meta name="description" content="{{ $description }}">
+        <meta property="og:description" content="{{ $description }}">
+    @endif
+    @if(!empty($image) && is_a($image, \App\Models\UploadedPicture::class))
+        <meta property="og:image" content="{{ $image->getFullsizeUrl() }}">
+        <meta property="og:image:width" content="{{ $image->width }}">
+        <meta property="og:image:height" content="{{ $image->height }}">
+    @endif
 </head>
 <body>
 @yield('content')

--- a/resources/views/public/portfolio-show.blade.php
+++ b/resources/views/public/portfolio-show.blade.php
-@extends('layouts.public', ['title' => $creation->nameTranslationKey->getTranslation()])
+@extends('layouts.public', [
+    'title' => $creation->nameTranslationKey->getTranslation(),
+    'description' => $creation->shortDescriptionTranslationKey->getTranslation(),
+    'image' => $creation->coverUploadedPicture
+])
 @section('content')
    <x-public.navbar class="container mx-auto px-4"/>