1.下載帝國cms內容頁插入代碼高亮顯示,附件如下:
帝國cms內容頁插入代碼高亮顯示.zip (44.12 KB)
2.解壓帝國cms內容頁插入代碼高亮顯示.zip之后,得到一個css文件和一個js文件,將兩個文件傳到自己網站目錄中,具體傳到哪里你自己決定。
3.引用剛才上傳的兩個文件,在文章內容頁引用(路徑改為你自己的路徑)。
<link?href="[!--news.url--]skin/moyublog/css/shCoreDefault.css"?rel="stylesheet"?type="text/css"?/>
<script?type="text/javascript"?src="[!--news.url--]skin/moyublog/js/shCore.js"></script>
<script?type="text/javascript">
SyntaxHighlighter.all();
</script>
4.到這里基本上就差不多了,這個帝國CMS文章頁添加代碼如何高亮顯示的方法是半手動的,還需要在發布內容的時候,手動加下面css樣式。具體如下(打個比方,如果你插入的代碼是html,那你就修改為第11行的樣式)
<pre?class="brush:as3;toolbar:false">ActionScript3</pre>
<pre?class="brush:bash;toolbar:false">Bash/Shell</pre>
<pre?class="brush:css;toolbar:false;">Css</pre>
<pre?class="brush:cpp;toolbar:false;">C/C++</pre>
<pre?class="brush:cf;toolbar:false">CodeFunction</pre>
<pre?class="brush:c#;toolbar:false">C#</pre>
<pre?class="brush:delphi;toolbar:false">Delphi</pre>
<pre?class="brush:diff;toolbar:false">Diff</pre>
<pre?class="brush:erlang;toolbar:false">Erlang</pre>
<pre?class="brush:groovy;toolbar:false;">Groovy</pre>
<pre?class="brush:html;toolbar:false">Html</pre>
<pre?class="brush:java;toolbar:false">Java</pre>
<pre?class="brush:jfx;toolbar:false">JavaFx</pre>
<pre?class="brush:js;toolbar:false">javascript</pre>
<pre?class="brush:pl;toolbar:false">perl</pre>
<pre?class="brush:php;toolbar:false">php</pre>
<pre?class="brush:plain;toolbar:false">plainText</pre>
<pre?class="brush:ps;toolbar:false">PowerShell</pre>
<pre?class="brush:python;toolbar:false">Python</pre>
<pre?class="brush:ruby;toolbar:false">Ruby</pre>
<pre?class="brush:scala;toolbar:false">Scala</pre>
<pre?class="brush:sql;toolbar:false">Sql</pre>
<pre?class="brush:vb;toolbar:false">Vb</pre>
<pre?class="brush:xml;toolbar:false">Xml</pre>
5.也就是每次寫文章的時候都要點擊一下編輯器右上角的【源碼】按鈕
然后在源代碼中加入,例如你插入的是html代碼,你就在源代碼中修改樣式,(如下,把其中的html換成你要插入的代碼即可)
<pre class="brush:html;toolbar:false">這里是是html代碼</pre>
說的這么清楚,應該差不多了!
在線下載列表
下載地址1