花魁直播高品质美女在线视频互动社区 - 花魁直播官方版

 歡迎來到素材無憂網(wǎng),按 + 收藏我們
登錄 注冊 退出 找回密碼

帝國cms編輯器中使用代碼高亮的方法

時間: 2020-09-16 10:31 閱讀: 作者:素材無憂網(wǎng)

帝國cms編輯器中使用代碼高亮的方法,教大家如何在帝國cms編輯器中整合highlight。

帝國cms編輯器中使用代碼高亮的方法

1.首先下載highlight
下載地址:https://highlightjs.org/download/

下載解壓后styles文件夾里面是風格樣式。
2.接下來開始整合到編輯器 
在/e/admin/ecmseditor/infoeditor/styles.js 代碼中添加

{ name: 'Preformatted Text',element: 'pre' },

添加完后編輯器樣式會多出一個Preformatted Text選項

在我們需要使用代碼高亮的地方使用Preformatted Text樣式。
3.在需要使用代碼高亮的模板中引入highlight。 可以調(diào)整樣式在styles文件中,我們這里使用的是tomorrow-night-eighties.css樣式。

<link rel="stylesheet" type="text/css" href="[!--news.url--]skin/web/css/tomorrow-night-eighties.css" /> 
<script type="text/javascript" src='[!--news.url--]skin/web/js/highlight.js'></script> //放在模板最底部 
<script type="text/javascript"> hljs.initHighlightingOnLoad(); var allpre = document.getElementsByTagName("pre"); for(i = 0; i < allpre.length; i++) { var onepre = document.getElementsByTagName("pre")[i]; var mycode = document.getElementsByTagName("pre")[i].innerHTML; onepre.innerHTML = '<code id="mycode">'+mycode+'</code>'; } </script>

至此插件整合完成。  

版權(quán)聲明: 本站資源均來自互聯(lián)網(wǎng)或會員發(fā)布,如果侵犯了您的權(quán)益請與我們聯(lián)系,我們將在24小時內(nèi)刪除!謝謝!

轉(zhuǎn)載請注明: 帝國cms編輯器中使用代碼高亮的方法

標簽:  
相關(guān)文章
模板推薦