diff --git a/src/docs/src/components/ComponentFooter.svelte b/src/docs/src/components/ComponentFooter.svelte
index bc5c3596698..f68ffb2c84f 100644
--- a/src/docs/src/components/ComponentFooter.svelte
+++ b/src/docs/src/components/ComponentFooter.svelte
@@ -9,11 +9,9 @@
 
   let arrayOfPagesInOrder = []
   pages.map((items) => {
-    if (items.name != "excluded") {
-      items.items.forEach((item) => {
-        arrayOfPagesInOrder.push(item)
-      })
-    }
+    items.items.forEach((item) => {
+      arrayOfPagesInOrder.push(item)
+    })
   })
   $: currentPageIndex = arrayOfPagesInOrder.findIndex((item) => item.href == $page.url.pathname.replace(/\/$/, ""))
 </script>
diff --git a/src/docs/src/components/Sidebar.svelte b/src/docs/src/components/Sidebar.svelte
index b207378fd50..eefb10dd8cb 100644
--- a/src/docs/src/components/Sidebar.svelte
+++ b/src/docs/src/components/Sidebar.svelte
@@ -43,22 +43,24 @@
       <li class="menu-title"><span>{$t(name)}</span></li>
     {/if}
     {#if name != "excluded"}
-      {#each items as { name, href, icon, badge }}
-        <li>
-          <a {href} on:click={closeDrawer} id={$page.url.pathname.startsWith(href + "/") ? "active-menu" : ""} class={`flex gap-4 ${$page.url.pathname == href ? "active" : ""} ${$page.url.pathname.startsWith(href + "/") ? "active" : ""}`}>
-            {#if icon != ""}
-              <span class="flex-none">
-                {@html icon}
+      {#each items as { name, href, icon, badge, hidden, highlightAnotherItem }}
+        {#if !hidden}
+          <li>
+            <a {href} on:click={closeDrawer} id={$page.url.pathname.startsWith(href + "/") ? "active-menu" : ""} class={`flex gap-4 ${$page.url.pathname == href ? "active" : ""} ${$page.url.pathname == highlightAnotherItem + "/" ? "active" : ""} ${$page.url.pathname.startsWith(href + "/") ? "active" : ""}`}>
+              {#if icon != ""}
+                <span class="flex-none">
+                  {@html icon}
+                </span>
+              {/if}
+              <span class="flex-1">
+                {@html $t(name)}
               </span>
-            {/if}
-            <span class="flex-1">
-              {@html $t(name)}
-            </span>
-            {#if badge != ""}
-              <span class="badge badge-sm flex-none lowercase">{$t(badge)}</span>
-            {/if}
-          </a>
-        </li>
+              {#if badge != ""}
+                <span class="badge badge-sm flex-none lowercase">{$t(badge)}</span>
+              {/if}
+            </a>
+          </li>
+        {/if}
       {/each}
     {/if}
   </ul>
diff --git a/src/docs/src/lib/data.js b/src/docs/src/lib/data.js
index c1918ece107..f26d9808734 100644
--- a/src/docs/src/lib/data.js
+++ b/src/docs/src/lib/data.js
@@ -188,10 +188,19 @@ export let pages = [
     items: [
       {
         name: "Install",
-        tags: "how setup install npm cdn",
+        tags: "how setup install npm",
         href: "/docs/install",
         icon: '<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="w-6 h-6 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 4H6a2 2 0 00-2 2v12a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-2m-4-1v8m0 0l3-3m-3 3L9 8m-5 5h2.586a1 1 0 01.707.293l2.414 2.414a1 1 0 00.707.293h3.172a1 1 0 00.707-.293l2.414-2.414a1 1 0 01.707-.293H20" /></svg>',
         badge: "",
+        highlightAnotherItem: "/docs/cdn",
+      },
+      {
+        name: "CDN",
+        tags: "how cdn",
+        href: "/docs/cdn",
+        icon: "",
+        badge: "",
+        hidden: true,
       },
       {
         name: "Use",