src/app/blog/page.tsx

@@ -7,8 +7,8 @@ import { useBlogPosts } from "@/hooks/useBlogPosts";
 // Navbar Import
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 
-// Blog Section Import
-import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
+// Section Import
+import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 
 // Footer Import
 import FooterMedia from '@/components/sections/footer/FooterMedia';
@@ -18,14 +18,23 @@ export default function BlogPage() {
 
     const navItems = [
         { name: 'Home', id: '/' },
-        { name: 'Shop', id: '/shop' },
-        { name: 'Blog', id: '/blog' },
         { name: 'About', id: '/#about' },
         { name: 'Features', id: '/#features' },
         { name: 'Testimonials', id: '/#testimonials' },
         { name: 'FAQ', id: '/#faq' },
         { name: 'Contact', id: '/#contact' },
-      ];
+    ];
+
+    const blogProducts = posts?.map((post: any) => ({
+        id: post.id,
+        brand: post.author?.name || 'By Find Me',
+        name: post.title,
+        price: post.publishedAt ? new Date(post.publishedAt).toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' }) : '',
+        rating: 5,
+        reviewCount: '',
+        imageSrc: post.coverImage?.url || '/placeholders/placeholder1.webp',
+        imageAlt: post.title,
+    })) || [];
 
     return (
         <ThemeProvider
@@ -58,14 +67,14 @@ export default function BlogPage() {
             ) : (
                 <main className="pt-24">
                      <div id="blog" data-section="blog">
-                        <BlogCardTwo
-                            posts={posts}
+                        <ProductCardTwo
+                            products={blogProducts}
                             title="From Our Blog"
                             description="Explore the latest stories, tips, and insights from our team."
                             animationType="slide-up"
                             textboxLayout="default"
                             useInvertedBackground={false}
-                            carouselMode="buttons"
+                            gridVariant='uniform-all-items-equal'
                         />
                     </div>
                 </main>

src/app/page.tsx

@@ -17,8 +17,6 @@ import FooterMedia from '@/components/sections/footer/FooterMedia';
 export default function LandingPage() {
   const navItems = [
     { name: 'Home', id: '/' },
-    { name: 'Shop', id: '/shop' },
-    { name: 'Blog', id: '/blog' },
     { name: 'About', id: '/#about' },
     { name: 'Features', id: '/#features' },
     { name: 'Testimonials', id: '/#testimonials' },

src/app/shop/[id]/page.tsx

@@ -17,8 +17,6 @@ interface ProductPageProps {
 
 const navItems = [
     { name: 'Home', id: '/' },
-    { name: 'Shop', id: '/shop' },
-    { name: 'Blog', id: '/blog' },
     { name: 'About', id: '/#about' },
     { name: 'Features', id: '/#features' },
     { name: 'Testimonials', id: '/#testimonials' },

src/app/shop/page.tsx

@@ -9,8 +9,6 @@ import { useProductCatalog } from "@/hooks/useProductCatalog";
 
 const navItems = [
     { name: 'Home', id: '/' },
-    { name: 'Shop', id: '/shop' },
-    { name: 'Blog', id: '/blog' },
     { name: 'About', id: '/#about' },
     { name: 'Features', id: '/#features' },
     { name: 'Testimonials', id: '/#testimonials' },