diff --git a/app/detail/slug/[slug]/page.tsx b/app/detail/slug/[slug]/page.tsx
deleted file mode 100644
index 69af48a..0000000
--- a/app/detail/slug/[slug]/page.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import DetailContent from "@/components/details/details-content";
-import Navbar from "@/components/landing-page/navbar";
-
-import Image from "next/image";
-import { Footer } from "react-day-picker";
-
-export default function Slug() {
-  return (
-    <div className="relative min-h-screen font-[family-name:var(--font-geist-sans)]">
-      <div className="fixed top-0 left-0 w-full h-auto z-0">
-        <Image
-          src="/rumput.jpg"
-          alt="Background"
-          width={1450}
-          height={600}
-          className="w-full h-auto object-cover"
-          priority
-        />
-      </div>
-
-      <div className="relative z-10 bg-[#F2F4F3] max-w-7xl mx-auto">
-        <Navbar />
-        <div className="flex-1">
-          <DetailContent />
-        </div>
-
-        <Footer />
-      </div>
-    </div>
-  );
-}
diff --git a/components/details/details-content.tsx b/components/details/details-content.tsx
index 724f846..1c6ee5d 100644
--- a/components/details/details-content.tsx
+++ b/components/details/details-content.tsx
@@ -299,7 +299,7 @@ export default function DetailContent() {
 
   async function initStateData() {
     loading();
-    const res = await getArticleBySlug(slug);
+    const res = await getArticleById(id);
     const data = res?.data?.data;
 
     setThumbnail(data?.thumbnailUrl);
diff --git a/components/landing-page/header.tsx b/components/landing-page/header.tsx
index 83c1262..e0bcae6 100644
--- a/components/landing-page/header.tsx
+++ b/components/landing-page/header.tsx
@@ -118,7 +118,7 @@ export default function HeroNewsSection() {
         <div className="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-2 m-8 ">
           {articles.length > 0 && (
             <div className="md:col-span-2 lg:col-span-3 relative">
-              <Link href={`/detail/slug/${articles[0]?.slug}`}>
+              <Link href={`/detail/${articles[0]?.id}`}>
                 <Image
                   src={
                     articles[0]?.files?.[0]?.fileUrl ||
@@ -172,10 +172,10 @@ export default function HeroNewsSection() {
           <div className="md:col-span-1 lg:col-span-2 grid grid-cols-1 sm:grid-cols-2 gap-2">
             {articles.slice(1, 5).map((article, index) => (
               <div key={index} className="relative">
-                <Link href={`/detail/slug/${article?.slug}`}>
+                <Link href={`/detail/${article?.id}`}>
                   <Image
                     src={
-                      article.thumbnailUrl ||n
+                      article.thumbnailUrl ||
                       article?.files?.[0]?.fileUrl ||
                       "/default-image.jpg"
                     }