Blog shorting updated , latest blog will show first

This commit is contained in:
akash 2025-10-23 19:34:56 +05:30
parent 4d8e30a634
commit 208dfa893c
2 changed files with 21 additions and 10 deletions

View File

@ -15,21 +15,28 @@ const Blog = () => {
pagination(".single_box_", sort, active);
let list = document.querySelectorAll(".single_box_");
setstate(getPagination(list.length, sort));
window.scrollTo({
top: 0,
behavior: "smooth" // smooth scrolling effect
});
}, [active]);
const sortedBlogs = [...BlogData].sort((a, b) => new Date(b.date) - new Date(a.date));
return (
<>
<ConsenHead title="Blogs - Web Development, SEO & Digital Marketing"
description="Discover blogs on website development, mobile apps, SEO, digital marketing, UI/UX, and graphic design with insights from MetatronCube India." />
<ConsenHead
title="Blog | Metatroncube"
description="Explore the latest SEO strategies for 2025. Stay ahead with insights from Metatroncube Software Solutions."
/>
<Layout>
<BlogBan pageName={"BLOG"} />
<div className="blog-area style-two page">
<div className="container">
<div className="row">
{
BlogData?.map((blog) => {
sortedBlogs?.map((blog) => {
return (
<div className="col-lg-4 col-md-6 single_box_" key={blog?.id}>
<div className="single-blog-box">
@ -48,12 +55,11 @@ const Blog = () => {
<Link legacyBehavior href={`${blog?.slug}`}>
<a>
{blog?.title.length > 50
? blog.title.substring(0, 40) + '...'
? blog.title.substring(0, 50) + '...'
: blog.title}
</a>
</Link>
</h2>
</div>
<div className="em-blog-icon">
<div className="em-blog-thumb">

View File

@ -2,6 +2,9 @@ import { BlogData } from "@/utils/constant.utils";
import Link from "next/link";
const BlogSection = () => {
const sortedBlogs = [...BlogData].sort((a, b) => new Date(b.date) - new Date(a.date)).slice(0, 3);
return (
<div className="service-area new-style">
<div className="container">
@ -15,7 +18,7 @@ const BlogSection = () => {
</div>
<div className="row">
{
BlogData?.slice(0, 3)?.map((blog) => {
sortedBlogs?.map((blog) => {
return (
<div className="col-lg-4 col-md-6" key={blog?.id}>
<div className="single-service-box">
@ -26,9 +29,11 @@ const BlogSection = () => {
<img src="/assets/images/home/blog/1.webp" alt={blog?.slug} />
</div> */}
<div className="service-content">
<h2> {blog?.title.length > 50
? blog.title.substring(0, 50) + '...'
: blog.title}</h2>
<h2>
{blog?.title.length > 50
? blog.title.substring(0, 50) + '...'
: blog.title}
</h2>
<p>
{blog?.date}
</p>