帝国cms编辑器中运用代码高亮的办法,教咱们如安在帝国cms编辑器中整合highlight。
1.首要下载highlight
下载地址:https://highlightjs.org/download/
下载解压后styles文件夹里边是风格款式。
2.接下来开端整合到编辑器
在/e/admin/ecmseditor/infoeditor/styles.js 代码中增加
{name:'PreformattedText',element:'pre'},
增加完后编辑器款式会多出一个Preformatted Text选项
在咱们需求运用代码高亮的当地运用Preformatted Text款式。
3.在需求运用代码高亮的模板中引进highlight。 能够调整款式在styles文件中,咱们这儿运用的是tomorrow-night-eighties.css款式。
<linkrel="stylesheet"type="text/css"href="[!--news.url--]skin/web/css/tomorrow-night-eighties.css"/> <scripttype="text/javascript"src='[!--news.url--]skin/web/js/highlight.js'></script>//放在模板最底部 <scripttype="text/javascript">hljs.initHighlightingOnLoad();varallpre=document.getElementsByTagName("pre");for(i=0;i<allpre.length;i++){varonepre=document.getElementsByTagName("pre")[i];varmycode=document.getElementsByTagName("pre")[i].innerHTML;onepre.innerHTML='<codeid="mycode">'+mycode+'</code>';}</script>
至此插件整合完结。
声明:有的资源均来自网络转载,版权归原作者所有,如有侵犯到您的权益 请联系邮箱:123456@qq.com 我们将配合处理!
原文地址:帝国cms编辑器中使用代码高亮的方法发布于2022-07-06 07:44:14