diff --git a/templates/features/hotlist-issues-page.ezt b/templates/features/hotlist-issues-page.ezt
new file mode 100644
index 0000000..79898e0
--- /dev/null
+++ b/templates/features/hotlist-issues-page.ezt
@@ -0,0 +1,120 @@
+[define title]Hotlist [hotlist.name][end]
+[define category_css]css/ph_list.css[end]
+[define category2_css]css/ph_detail.css[end]
+[include "../framework/header.ezt" "showtabs"]
+
+<table width="100%" cellpadding="0" cellspacing="0" border="0" class="hotlist-issues-page" id="meta-container"
+       style="margin: 1em">
+<tbody class="collapse">
+  <tr>
+    <td nowrap="nowrap" style="min-width:9em;" class="sidebar">
+      <div style="text-align: center">
+       [if-any read_only][else]
+         <a id="hotlist_star"
+         style="color:[if-any hotlist.is_starred]cornflowerblue[else]gray[end]"
+         title="[if-any hotlist.is_starred]Un-s[else]S[end]tar this hotlist">
+         [if-any hotlist.is_starred]&#9733;[else]&#9734;[end]
+         </a>
+       [end]
+       Followed by [hotlist.num_followers]
+      </div>
+      <div id="meta-float">
+        [include "hotlist-meta-part.ezt"]
+      </div>
+    </td>
+    <td width="80%" class="vt" style="padding-left: 1em">
+      <h1 style="margin-top: 0"><a href="[hotlist.url]">Hotlist [hotlist.name]</a></h1>
+      <div>Summary: [hotlist.summary]</div>
+      Description: [hotlist.description]
+     </td>
+  </tr>
+
+
+</tbody>
+</table>
+
+<div id="colcontrol">
+
+  <span id="qq"><input type="hidden" id="searchq" name="q"
+                            value="[query]" autocomplete="off" ignore-dirty></span>
+       [if-any sortspec]<input type="hidden" id="sort" name="sort" value="[sortspec]">[end]
+       [if-any groupby]<input type="hidden" id="groupby" name="groupby" value="[groupby]">[end]
+       [if-any colspec]<span id="search_colspec"><input type="hidden" name="colspec" value="[colspec]"></span>[end]
+       <input type="hidden" id="hotlist_name" value="[hotlist.name]"></input>
+  <input type="hidden"  id="can" value="[can]"></span>
+
+  [if-any grid_mode]
+   [include "../tracker/issue-grid-controls-top.ezt"]
+  [end]
+
+  [if-any list_mode]
+   [include "../tracker/issue-list-controls-top.ezt"]
+  [end]
+
+  [if-any chart_mode]
+   [include "../tracker/issue-chart-controls-top.ezt"]
+  [end]
+
+  [include "../tracker/issue-hovercard.ezt"] [# TODO(jojwang): no hovercard appears right now]
+
+  <div id="cursorarea">
+  <table cellspacing="0" cellpadding="2" border="0" class="results striped drag_container" id="resultstable" width="100%">
+
+    [if-any grid_mode]
+     [include "../tracker/issue-grid-body.ezt"]
+    [end]
+
+    [if-any list_mode]
+     [include "hotlist-issues-body.ezt"]
+    [end]
+
+    [if-any chart_mode]
+     [include "../tracker/issue-chart-body.ezt" "testparam"]
+    [end]
+
+  </table>
+  </div>
+
+  [if-any list_mode]
+    [include "../tracker/issue-list-controls-bottom.ezt"]
+    [for panels]
+      [include "../tracker/issue-list-menus.ezt"]
+    [end]
+  [end]
+</div>
+
+[if-any grid_mode][else]
+  [include "../tracker/issue-list-js.ezt" "hotlist"]
+[end]
+
+<script type="text/javascript" nonce="[nonce]">
+runOnLoad(function() {
+  if ($("hotlist_star")) {
+    [# The user viewing this page wants to star this hotlist]
+    $("hotlist_star").addEventListener("click", function () {
+       _TKR_toggleStar($("hotlist_star"), null, null, null, "[hotlist_id]");
+    });
+  }
+
+
+    window.addEventListener("beforeunload", function(e) {
+      var selectedElement = document.activeElement;
+      if (selectedElement.classList.contains("itemnote")){
+        saveNote(selectedElement, "[hotlist_id]");
+      }
+      return;
+    });
+
+    $("hide-closed").addEventListener("click", function(e) {
+      HTL_toggleIssuesShown(e.target);
+    });
+    $("show-all").addEventListener("click", function(e) {
+      HTL_toggleIssuesShown(e.target);
+    });
+
+});
+</script>
+
+[#TODO(jojwang):make pretty]
+
+[include "../framework/footer.ezt"]