diff --git a/public/css/markdown.css b/public/css/markdown.css
index 9f4024ba8..d46fd9436 100644
--- a/public/css/markdown.css
+++ b/public/css/markdown.css
@@ -135,13 +135,12 @@
   box-shadow: inset 40px 0 0 #f5f5f5, inset 41px 0 0 #ccc;
 }
 
-.markdown > pre > code,
-.markdown > pre > ol.linenums > li > code {
+.markdown > pre > code {
   white-space: pre;
   word-wrap: normal;
 }
 
-.markdown > pre > ol.linenums > li > code {
+.markdown > pre > ol.linenums > li {
   padding: 0 10px;
 }
 
diff --git a/public/js/app.js b/public/js/app.js
index e0f92854f..3e995d5b0 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -110,25 +110,6 @@ var Gogits = {
         $pre.addClass('prettyprint linenums');
         prettyPrint();
 
-        var $lineNums = $pre.parent().siblings('.lines-num');
-        if ($lineNums.length > 0) {
-            var nums = $pre.find('ol.linenums > li').length;
-            for (var i = 1; i <= nums; i++) {
-                $lineNums.append('<span id="L' + i + '" rel=".L' + i + '">' + i + '</span>');
-            }
-
-            var last;
-            $(document).on('click', '.lines-num span', function () {
-                var $e = $(this);
-                if (last) {
-                    last.removeClass('active');
-                }
-                last = $e.parent().siblings('.lines-code').find('ol.linenums > ' + $e.attr('rel'));
-                last.addClass('active');
-                window.location.href = '#' + $e.attr('id');
-            });
-        }
-
         // Set anchor.
         var headers = {};
         $md.find('h1, h2, h3, h4, h5, h6').each(function () {
@@ -148,6 +129,30 @@ var Gogits = {
         });
     }
 
+    Gogits.renderCodeView = function () {
+        $('.code-view .lines-code > pre').each(function(){
+            var $pre = $(this);
+            var $lineNums = $pre.parent().siblings('.lines-num');
+            if ($lineNums.length > 0) {
+                var nums = $pre.find('ol.linenums > li').length;
+                for (var i = 1; i <= nums; i++) {
+                    $lineNums.append('<span id="L' + i + '" rel=".L' + i + '">' + i + '</span>');
+                }
+
+                var last;
+                $(document).on('click', '.lines-num span', function () {
+                    var $e = $(this);
+                    if (last) {
+                        last.removeClass('active');
+                    }
+                    last = $e.parent().siblings('.lines-code').find('ol.linenums > ' + $e.attr('rel'));
+                    last.addClass('active');
+                    window.location.href = '#' + $e.attr('id');
+                });
+            }
+        });
+    };
+
 })(jQuery);
 
 // ajax utils
@@ -177,6 +182,7 @@ function initCore() {
     Gogits.initModals();
     Gogits.initDropDown();
     Gogits.renderMarkdown();
+    Gogits.renderCodeView();
 }
 
 function initRegister() {
diff --git a/templates/repo/single_file.tmpl b/templates/repo/single_file.tmpl
index 7bca626aa..40ef44eb1 100644
--- a/templates/repo/single_file.tmpl
+++ b/templates/repo/single_file.tmpl
@@ -16,12 +16,12 @@
                 {{.FileContent|str2html}}
             </div>
         {{else}}
-            <div class="panel-body file-body file-code">
+            <div class="panel-body file-body file-code code-view">
                 <table>
                     <tbody>
                         <tr>
                             <td class="lines-num"></td>
-                            <td class="lines-code markdown"><pre class="linenums lang-{{.FileExt}}"><code>{{.FileContent}}</code></pre></td>
+                            <td class="lines-code markdown"><pre class="prettyprint linenums lang-{{.FileExt}}">{{.FileContent}}</pre></td>
                         </tr>
                     </tbody>
                 </table>