diff --git a/tools/web_monitor/app.py b/tools/web_monitor/app.py
index edce3070..d35f94c7 100644
--- a/tools/web_monitor/app.py
+++ b/tools/web_monitor/app.py
@@ -36,9 +36,15 @@ def scan(request: Request):
 def miner(request: Request, miner_ip):
     return get_miner
 
+
 @app.get("/miner/{miner_ip}")
 def get_miner(request: Request, miner_ip):
-    return miner_ip
+    return templates.TemplateResponse("miner.html", {
+        "request": request,
+        "cur_miners": get_current_miner_list(),
+        "miner": miner_ip
+    })
+
 
 def get_current_miner_list():
     cur_miners = []
diff --git a/tools/web_monitor/templates/miner.html b/tools/web_monitor/templates/miner.html
new file mode 100644
index 00000000..fb10f31f
--- /dev/null
+++ b/tools/web_monitor/templates/miner.html
@@ -0,0 +1,4 @@
+{% extends 'navbar.html'%}
+{% block content %}
+{{miner}}
+{% endblock content %}
diff --git a/tools/web_monitor/templates/navbar.html b/tools/web_monitor/templates/navbar.html
index 0f62b115..1ddf4212 100644
--- a/tools/web_monitor/templates/navbar.html
+++ b/tools/web_monitor/templates/navbar.html
@@ -51,29 +51,27 @@
       <div class="position-sticky pt-3">
         <ul class="nav nav-pills flex-column">
           <li class="nav-item mb-1 mx-2">
-            <a href="/" class="nav-link text-white {% if request.path == url_for('dashboard') %}active{% endif %}">
+            <a href="{{url_for('dashboard')}}" class="nav-link text-white {% if request.path == '/' %}active{% endif %}">
               <svg class="bi me-2" width="16" height="16"><use xlink:href="#dashboard"></use></svg>
               Dashboard
             </a>
           </li>
-
           <li class="nav-item mb-1 mx-2">
-            <a href="/scan" class="nav-link text-white">
-              <svg class="bi me-2" width="16" height="16"><use xlink:href="#scan"></use></svg>
-              Add Miners
-            </a>
-          </li>
-
-          <li class="nav-item mb-1 mx-2">
-            <a href="" class="nav-link text-white" data-bs-toggle="collapse" data-bs-target="#miners-collapse" aria-expanded="false">
+            <a href="" class="nav-link text-white {% if request.path == '/scan' or request.path.split('/')[1] == 'miner' %}active{% endif %}" data-bs-toggle="collapse" data-bs-target="#miners-collapse" aria-expanded="false">
               <svg class="bi me-2" width="16" height="16"><use xlink:href="#miners"></use></svg>
               Miners
             </a>
             <div class="collapse mt-1" id="miners-collapse" style="">
               <ul class="btn-toggle-nav overflow-auto list-unstyled fw-normal pb-1 small">
+                  <li>
+                  <a href="{{url_for('scan')}}" class="nav-link text-white {% if request.path == '/scan' %}active{% endif %}">
+                    <svg class="bi me-2 mt-1" width="16" height="16"><use xlink:href="#scan"></use></svg>
+                    Add Miners
+                  </a>
+                </li>
                 {% for miner in cur_miners %}
                   <li>
-                    <a href="{{url_for('miner')}}/{{miner}}" class="text-white rounded">
+                    <a href="{{url_for('miner')}}/{{miner}}" class="text-white nav-link {% if request.path == '/miner/' + miner %}active{% endif %}">
                       <svg class="bi me-2 mt-1" width="16" height="16"><use xlink:href="#miner"></use></svg>
                       {{miner}}
                     </a>