diff --git a/module/block/view/preference.html.php b/module/block/view/preference.html.php
index 3f93a22484..e55c9bde39 100644
--- a/module/block/view/preference.html.php
+++ b/module/block/view/preference.html.php
@@ -204,4 +204,5 @@ $(function()
     initPreference();
 })
 
-</script>
\ No newline at end of file
+</script>
+
diff --git a/module/dev/css/langitem.css b/module/dev/css/langitem.css
index 98b680089f..bc9dc7b982 100644
--- a/module/dev/css/langitem.css
+++ b/module/dev/css/langitem.css
@@ -12,10 +12,11 @@
 /* menu-tree */
 .menu-tree {flex: 0 0 200px; background: #fff; padding: 10px 10px;}
 .menu-tree > .tree {padding-top: 20px;}
-.menu-tree li {padding: 5px 25px;}
+li.has-list > ul > li {padding-left: 10px;}
+.tree ul {margin-bottom: 0;}
 
 /* side-left */
-.main-content > .side-left {flex: 0 0 160px; margin-left: 64px;}
+.main-content > .side-left {flex: 0 0 160px; margin-left: 44px;}
 .label-list {background: #F8F8F8; padding: 5px 0;}
 .label-list > .input-label {display: flex; align-items: center; cursor: pointer; padding-left: 40px;}
 
diff --git a/module/dev/js/langitem.js b/module/dev/js/langitem.js
index 4a9c7a3742..28d63e0312 100644
--- a/module/dev/js/langitem.js
+++ b/module/dev/js/langitem.js
@@ -48,9 +48,14 @@ $(function()
       {
         $('#menuTree').tree(
         {
-            data: menuTree
+            data: menuTree,
+            itemCreator: function($li, item) 
+            {
+                $li.append('<a data-module="' + item.module  + '" data-method="' + item.method + '" data-has-children="' + (item.children ? !!item.children.length : false)  + '"class="text-muted""' + '" href=# >' + item.title + '</a>');
+	    }
         });
       }
+
       $('.menu-tree .search-input').on('input', function()
       {
           var val = $(this).val();
@@ -77,10 +82,21 @@ $(function()
 		      }
                       item.children = children;
 		  }
-                  updateData.push(item);
+                  if (item.children.length || item.title.includes(val) ||(item.key && item.key.includes(val)))
+                  {
+                      updateData.push(item);
+		  }
               }
           }
           $('#menuTree').data('zui.tree').reload(updateData);
       })
+      
+      $('#menuTree').on('click', 'a', function(e)
+      {
+          var target = $(e.target);
+          if (target.attr('data-has-children') === 'true') return
+
+          self.location.href = createLink('dev', 'langItem', 'type=' + type + '&module=' + target.attr('data-module') + '&method=' + target.attr('data-method'));
+      })
     }
 })
diff --git a/module/dev/view/langitem.html.php b/module/dev/view/langitem.html.php
index b9d3fc4d37..f1de76bee7 100644
--- a/module/dev/view/langitem.html.php
+++ b/module/dev/view/langitem.html.php
@@ -30,7 +30,7 @@
       <input type="search" class="form-control search-input" />
       <label class="input-control-icon-left search-icon flex align-center justify-center"><i class="icon icon-search"></i></label>
     </div>
-    <div id="menuTree"></div>
+    <div id="menuTree" class="menu-active-primary menu-hover-primary"></div>
   </div>
 <?php endif;?>
   <form class='main-form form-ajax flex-1' method='post'>