diff --git a/modules/personal_lab/index.html.erb b/modules/personal_lab/index.html.erb
index e313629..b7144fc 100644
--- a/modules/personal_lab/index.html.erb
+++ b/modules/personal_lab/index.html.erb
@@ -1,22 +1,41 @@
-<table class="table table-hover table-striped writing-conferences-index index-lab">
+<table class="table table-hover table-striped projects-index personal-lab dt-responsive">
   <caption><h3>{{widget-title}}</h3></caption>
   <thead>
     <tr>
-      <th class="col-md-2">{{th_year}}</th>
       <th class="col-md-3">{{th_lab_title}}</th>
       <th class="col-md-2">{{th_location}}</th>
       <th class="col-md-3">{{th_member}}</th>
-      <th class="col-md-2"></th>
     </tr>
   </thead>
   <tbody data-level="0" data-list="labs">
     <tr>
-      <td>{{year}}</td>
-      <td>{{lab_title}}</td>
+      <td><a href="{{link_to_show}}">{{lab_title}}</td>
       <td>{{location}}</td>
       <td>{{member}}</td>
-      <th><a href="{{link_to_show}}">{{th_detail}}</a></th>
     </tr>
   </tbody>
 </table>
-{{pagination_goes_here}}
\ No newline at end of file
+{{pagination_goes_here}}
+
+<script>
+for ( var i = 0; i < $('thead th').length ; i++ ) {
+	if( $('thead th').length > 2 ) {
+    var th = $('thead th');
+    for ( var q = 3; q < th.length ; q++ ) {
+      th.eq(q).addClass('min-tablet-l');
+    }
+  }
+}
+
+$('table.personal-lab').each(function(){
+  if($(this).find('thead').length!=0 && $(this).find('td').length!=0 && !$(this).hasClass('dataTable')){
+    $(this).DataTable({
+      searching: false,
+      paging:   false,
+      ordering: false,
+      info:     false,
+      autoWidth: false
+    });
+  }
+});;
+</script>
\ No newline at end of file
diff --git a/modules/personal_lab/index.html.erb.bak b/modules/personal_lab/index.html.erb.bak
new file mode 100644
index 0000000..edfdb53
--- /dev/null
+++ b/modules/personal_lab/index.html.erb.bak
@@ -0,0 +1,40 @@
+<table class="table table-hover table-striped projects-index personal-lab dt-responsive nowrap">
+  <caption><h3>{{widget-title}}</h3></caption>
+  <thead>
+    <tr>
+      <th class="col-md-2">{{th_year}}</th>
+      <th class="col-md-3">{{th_lab_title}}</th>
+      <th class="col-md-2">{{th_location}}</th>
+      <th class="col-md-3">{{th_member}}</th>
+      <th class="col-md-2">更多內容</th>
+    </tr>
+  </thead>
+  <tbody data-level="0" data-list="labs">
+    <tr>
+      <td>{{year}}</td>
+      <td><a href="{{link_to_show}}">{{lab_title}}</td>
+      <td>{{location}}</td>
+      <td>{{member}}</td>
+      <th><a href="{{link_to_show}}">{{th_detail}}</a></th>
+    </tr>
+  </tbody>
+</table>
+{{pagination_goes_here}}
+
+<script>
+for ( var i = 0; i < $('thead th').length ; i++ ) {
+	if( $('thead th').length > 2 ) {
+    var th = $('thead th');
+    for ( var q = 3; q < th.length ; q++ ) {
+      th.eq(q).addClass('min-tablet-l');
+    }
+  }
+}
+
+$('table.personal-lab').DataTable({
+  searching: false,
+  paging:   false,
+  ordering: false,
+  info:     false
+});
+</script>
\ No newline at end of file
diff --git a/modules/personal_lab/info.json b/modules/personal_lab/info.json
index b347042..cda3d13 100644
--- a/modules/personal_lab/info.json
+++ b/modules/personal_lab/info.json
@@ -1,12 +1,12 @@
-{
-    "frontend": [
-        {
-            "filename" : "index",
-            "name" : {
-                "zh_tw" : "1. 列表",
-                "en" : "1. List"
-                },
-            "thumbnail" : "thumb.png"
-        }
-    ]
+{
+    "frontend": [
+        {
+            "filename" : "index",
+            "name" : {
+                "zh_tw" : "1. 列表",
+                "en" : "1. List"
+                },
+            "thumbnail" : "thumb.png"
+        }
+    ]
 }
\ No newline at end of file