diff --git a/html/index.html b/html/index.html
index f9f94c6..1dfaaba 100644
--- a/html/index.html
+++ b/html/index.html
@@ -3,22 +3,13 @@
 <script src="/ports.js"></script>
 <script src="/main.js"></script>
 <script src="/main_info.js"></script>
-
 <head>
   <link rel="stylesheet" href="style.css">
   <title>FreeSwitchOS Main Page</title>
 </head>
 
 <body>
-  <ul>
-    <li><a href="index.html">Overview</a></li>
-    <li><a href="stat.html">Port Statistics</a></li>
-    <li><a href="vlan.html">VLAN</a></li>
-    <li><a href="mirror.html">Mirroring</a></li>
-    <li><a href="trunk.html">Port Aggregation</a></li>
-    <li><a href="mirror.html">Mirroring</a></li>
-    <li><a href="update.html">Firmware Update</a></li>
-  </ul>
+  <nav id="sidebar"></nav>
   <div style="margin-left:16%;padding:1px 16px;height:1000px;">
     <div id="ports"></div>
     <h1>Switch Configuration</h1>
@@ -31,5 +22,5 @@
     </table>
   </div>
 </body>
-
+<script src="/navigation.js"></script>
 </html>
diff --git a/html/navigation.js b/html/navigation.js
new file mode 100644
index 0000000..dc92450
--- /dev/null
+++ b/html/navigation.js
@@ -0,0 +1,9 @@
+document.getElementById('sidebar').innerHTML =
+ "<ul><li><a href='index.html'>Overview</a></li>"
+ + "<li><a href='stat.html'>Port Statistics</a></li>"
+ + "<li><a href='vlan.html'>VLAN</a></li>"
+ + "<li><a href='mirror.html'>Mirroring</a></li>"
+ + "<li><a href='trunk.html'>Port Aggregation</a></li>"
+ + "<li><a href='mirror.html'>Mirroring</a></li>"
+ + "<li><a href='update.html'>Firmware Update</a></li></ul>";
+ 
diff --git a/html/stat.html b/html/stat.html
index 17bd1b7..f91f9b4 100644
--- a/html/stat.html
+++ b/html/stat.html
@@ -7,9 +7,7 @@
     <title>FreeSwitchOS Port Statistics</title>
   </head>
   <body>
-     <ul> <li><a href="index.html">Overview</a></li> <li><a href="stat.html">Port Statisitcs</a></li>
-     <li><a href="vlan.html">VLAN</a></li> <li><a href="mirror.html">Mirroring</a></li>
-     <li><a href="trunk.html">Port Aggregation</a></li></ul>
+    <nav id="sidebar"></nav>
     <div style="margin-left:16%;padding:1px 16px;height:1000px;">
     <div id="ports"></div>
     <h1>Port Statistics</h1>
@@ -19,4 +17,5 @@
     </table>
     </div>
   </body>
+  <script src="/navigation.js"></script>
 </html>
diff --git a/html/update.html b/html/update.html
index ab99b67..b68b70f 100644
--- a/html/update.html
+++ b/html/update.html
@@ -5,9 +5,7 @@
     <title>Firmware update</title>
   </head>
   <body>
-     <ul><li><a href="index.html">Overview</a></li> <li><a href="stat.html">Port Statisitcs</a></li>
-     <li><a href="vlan.html">VLAN</a></li> <li><a href="mirror.html">Mirroring</a></li>
-     <li><a href="trunk.html">Port Aggregation</a></li></ul>
+    <nav id="sidebar"></nav>
     <div style="margin-left:16%;padding:1px 16px;height:1000px;">
     <div id="ports"></div>
     <h1>Firmware Update</h1>
@@ -17,4 +15,5 @@
     <input type="submit" value="Upload File" />
     </form>
   </body>
+<script src="/navigation.js"></script>
 </html>
diff --git a/html/vlan.html b/html/vlan.html
index fd7ed86..5a5265c 100644
--- a/html/vlan.html
+++ b/html/vlan.html
@@ -7,9 +7,7 @@
     <title>FreeSwitchOS VLAN Configuration</title>
   </head>
   <body>
-     <ul> <li><a href="index.html">Overview</a></li> <li><a href="stat.html">Port Statisitcs</a></li>
-     <li><a href="vlan.html">VLAN</a></li> <li><a href="mirror.html">Mirroring</a></li>
-     <li><a href="trunk.html">Port Aggregation</a></li></ul>
+    <nav id="sidebar"></nav>
     <div style="margin-left:16%;padding:1px 16px;height:1000px;">
     <div id="ports"></div>
     <h1>VLAN Configuration</h1>
@@ -33,4 +31,5 @@
     </form>
     </div>
   </body>
+  <script src="/navigation.js"></script>
 </html>
