diff --git a/_bottomnav.html b/_bottomnav.html
new file mode 100644
index 0000000..551eb89
--- /dev/null
+++ b/_bottomnav.html
@@ -0,0 +1,5 @@
+<ul id="bottomnav">
+    <li><a href="/">[/]</a></li>
+    <li><a href="#">[/projects]</a></li>
+    <li><a href="#">[/links]</a></li>
+</ul>
\ No newline at end of file
diff --git a/assets/global.js b/assets/global.js
new file mode 100644
index 0000000..6e0ebf2
--- /dev/null
+++ b/assets/global.js
@@ -0,0 +1,9 @@
+const parser = new DOMParser();
+
+fetch("/_bottomnav.html")
+.then(response => response.text())
+.then(text => {
+    const bottomNav = parser.parseFromString(text, "text/html");
+
+    document.body.appendChild(bottomNav.getElementById("bottomnav"));
+});
\ No newline at end of file
diff --git a/assets/index.js b/assets/index.js
deleted file mode 100644
index e69de29..0000000
diff --git a/index.html b/index.html
index 3721de6..d322855 100644
--- a/index.html
+++ b/index.html
@@ -5,6 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Im bad at naming things</title>
     <link rel="stylesheet" href="assets/index.css">
+    <script src="assets/global.js" defer></script>
 </head>
 <body>
     <main>
@@ -13,10 +14,5 @@
             Lucielle
         </div>
     </main>
-    <ul id="bottomnav">
-        <li><a href="/">[/]</a></li>
-        <li><a href="#">[/projects]</a></li>
-        <li><a href="#">[/links]</a></li>
-    </ul>
 </body>
 </html>
\ No newline at end of file
