Update

app/Http/Controllers/FrontHomeController.php

@@ -4,6 +4,7 @@
 
 use App\Models\BackgroundMedia;
 use App\Models\MemeMedia;
+use Artesaos\SEOTools\Facades\JsonLd;
 use Illuminate\Support\Facades\App;
 use Illuminate\Support\Facades\Cache;
 use Inertia\Inertia;
@@ -24,8 +25,68 @@ public function index()
             ];
         });
 
+        // Get FAQ data
+        $faqData = $this->getFaqData();
+
+        // Add FAQ JSON-LD structured data
+        $this->addFaqJsonLd($faqData);
+
         return Inertia::render('home/home', [
             'stats' => $stats,
+            'faqData' => $faqData,
         ]);
     }
+
+    private function getFaqData()
+    {
+        return [
+            [
+                'q' => 'How can I create a meme video?',
+                'a' => 'Use the video editor on top to start making your meme!<br><br>Edit your caption, background and meme. Once satisfied, press the Export button to download your video!',
+            ],
+            [
+                'q' => 'Why is video export slow for me?',
+                'a' => 'Video processing happens entirely in your browser using advanced web technology.<br><br> Export speed depends on your video content complexity and device performance. High-end devices export quickly, while older/slower devices may take longer or even crash. <br><br>If your phone is too slow, it\'s probably a potato. Try using a faster device like a desktop computer for better performance.',
+            ],
+            [
+                'q' => 'What is a potato device?',
+                'a' => 'Potato devices are old, dated computers, laptops, phones or tablets with little RAM and CPU power - typically devices from before '.(now()->year - 6).' (pre-'.(now()->year - 6).').<br><br>These devices are usually too weak for the modern web and may not work properly with our video editor, or may crash during video processing.',
+            ],
+            [
+                'q' => 'What video format do you export?',
+                'a' => 'We export high-quality MP4 videos optimized for all social media platforms in 9:16 format.<br><br>This is compatible for TikTok, Youtube Shorts, Instagram Reels, and more.',
+            ],
+            [
+                'q' => 'Is there a mobile app?',
+                'a' => 'Our web app is fully responsive and works perfectly on mobile devices.<br><br>Do you want a mobile app? We\'ll see what can be done. Let us know in our Discord group.',
+            ],
+            [
+                'q' => 'How often do you add new content?',
+                'a' => 'We just started building this platform and will gradually add more meme templates and backgrounds over time, so everyone can continue using it for free with fresh content!<br><br>Want a certain content? Let us know in our Discord group.',
+            ],
+            [
+                'q' => 'I found a bug!',
+                'a' => 'Great, report it into the Discord group and we\'ll fix it as soon as possible!',
+            ],
+            [
+                'q' => 'I have more questions!',
+                'a' => 'Great! Join our Discord group and ask away!',
+            ],
+        ];
+    }
+
+    private function addFaqJsonLd($faqData)
+    {
+        JsonLd::addValue('@type', 'FAQPage');
+        JsonLd::addValue('mainEntity', collect($faqData)->map(function ($faq) {
+            return [
+                '@type' => 'Question',
+                'name' => $faq['q'],
+                'acceptedAnswer' => [
+                    '@type' => 'Answer',
+                    'text' => strip_tags(str_replace('<br><br>', ' ', $faq['a'])),
+                ],
+            ];
+        })->toArray());
+    }
 }

resources/js/pages/home/home.tsx

@@ -5,7 +5,7 @@ import Footer from './partials/Footer.jsx';
 import Hero from './partials/Hero.jsx';
 import { useEffect, useState } from 'react';
 
-const Home = () => {
+const Home = ({ faqData }) => {
     const [isClient, setIsClient] = useState(false);
     const [Editor, setEditor] = useState(null);
 
@@ -33,7 +33,7 @@ const Home = () => {
             <div className="space-y-16">
                 <Hero />
                 <Features />
-                <FAQDiscord />
+                <FAQDiscord faqData={faqData} />
             </div>
             <Footer />
             <AuthUser />

resources/js/pages/home/partials/FAQDiscord.jsx

@@ -1,42 +1,7 @@
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';
 import { ExternalLinkIcon } from '@radix-ui/react-icons';
 
-const FAQDiscord = () => {
+const FAQDiscord = ({ faqData }) => {
-    const faqData = [
-        {
-            q: 'How can I create a meme video?',
-            a: 'Use the video editor on top to start making your meme!<br><br>Edit your caption, background and meme. Once satisfied, press the Export button to download your video!',
-        },
-
-        {
-            q: 'Why is video export slow for me?',
-            a: "Video processing happens entirely in your browser using advanced web technology.<br><br> Export speed depends on your video content complexity and device performance. High-end devices export quickly, while older/slower devices may take longer or even crash. <br><br>If your phone is too slow, it's probably a potato. Try using a faster device like a desktop computer for better performance.",
-        },
-        {
-            q: 'What is a potato device?',
-            a: `Potato devices are old, dated computers, laptops, phones or tablets with little RAM and CPU power - typically devices from before ${new Date().getFullYear() - 6} (pre-${new Date().getFullYear() - 6}).<br><br>These devices are usually too weak for the modern web and may not work properly with our video editor, or may crash during video processing.`,
-        },
-        {
-            q: 'What video format do you export?',
-            a: 'We export high-quality MP4 videos optimized for all social media platforms in 9:16 format.<br><br>This is compatible for TikTok, Youtube Shorts, Instagram Reels, and more.',
-        },
-        {
-            q: 'Is there a mobile app?',
-            a: "Our web app is fully responsive and works perfectly on mobile devices.<br><br>Do you want a mobile app? We'll see what can be done. Let us know in our Discord group.",
-        },
-        {
-            q: 'How often do you add new content?',
-            a: 'We just started building this platform and will gradually add more meme templates and backgrounds over time, so everyone can continue using it for free with fresh content!<br><br>Want a certain content? Let us know in our Discord group.',
-        },
-        {
-            q: 'I found a bug!',
-            a: "Great, report it into the Discord group and we'll fix it as soon as possible!",
-        },
-        {
-            q: 'I have more questions!',
-            a: 'Great! Join our Discord group and ask away!',
-        },
-    ];
 
     return (
         <section className="">