百度ueditor編輯器程式碼高亮
阿新 • • 發佈:2018-12-31
百度的ueditor是國內比較好用的富文字編輯器,這裡要講解的是ueditor中一個很小的功能:程式碼高亮;
對於我們這些寫個部落格三句不離程式碼的碼農們來說,能看到段高亮的程式碼那欣喜是無以言表的;
沒圖我說個。。;上圖;以上篇文章為例;
示例環境:ueditor1.4.3
未高亮的程式碼:
程式碼高亮後:
如此大的反差;就不廢話再吹噓它的優美了;重點來說使用ueditor如何程式碼高亮;
很簡單,但是很多人都不知道這個功能,或者是不知道怎麼用;
首先在編輯文章的時候選擇對應的程式碼語言;
然後在文章展示頁面的head頭內引入
1 2 3 4 5 |
< script type = "text/javascript" src = "/Public/static/ueditor1_4_3/third-party/SyntaxHighlighter/shCore.js" ></ script >
< link rel = "stylesheet" href = "/Public/static/ueditor1_4_3/third-party/SyntaxHighlighter/shCoreDefault.css" >
< script type = "text/javascript" >
SyntaxHighlighter.all();
</ script >
|
自行調整自己實際專案中的路徑即可;