diff --git a/components/dynamic-page/page-component/templates/navigations/bottoms/Default.vue b/components/dynamic-page/page-component/templates/navigations/bottoms/Default.vue
index 9a5c0a5..65ec563 100644
--- a/components/dynamic-page/page-component/templates/navigations/bottoms/Default.vue
+++ b/components/dynamic-page/page-component/templates/navigations/bottoms/Default.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { isEmpty } from "@/utils/lodash";
-import { nanoid } from "nanoid"
+import { nanoid } from "nanoid";
 import DynamicComponent from "~/components/dynamic-page/page-component/templates/index.vue";
 import RecusiveNavItem from "@/components/dynamic-page/page-component/templates/navigations/components/RecusiveNavItem.vue";
 import { buildTree } from "@/utils/recusive";
@@ -15,16 +15,17 @@ const _props = defineProps<{
   <div class="px-4 mt-4">
     <div class="nav-container">
       <template v-if="_props.content">
-        <div v-for="item, index in buildTree(_props.content)" :key="index" class="nav-items-box">
+        <div v-for="(item, index) in buildTree(_props.content)" :key="index" class="nav-items-box">
           <div class="submenu-container">
-            <h4 class="" >{{ item.title }}</h4>
+            <nuxt-link :to="`/${item.slug}`"
+              ><h4 class="font-raleway">{{ item.title }}</h4></nuxt-link
+            >
             <div class="ml-2">
-              <h5 
-                v-for="_item, _index in item.childs ? item.childs : []" 
-                :key="_index"
+              <nuxt-link v-for="(_item, _index) in item.childs ? item.childs : []" :key="_index" :to="`/${_item.slug}`"
+                ><h5 class="font-raleway">
+                  {{ _item.title }}
+                </h5></nuxt-link
               >
-                {{ _item.title }}
-              </h5>
             </div>
           </div>
         </div>