在帝国CMS编辑器中实现代码高亮的方法
在帝国cms编辑器中使用代码高亮的方法如下： 1. 打开帝国cms后台，找到“系统”-“系统参数设置”。 2. 在“系统参数设置”页面中，找到“模板选项”，将“默认模板风格”设置为“enews”。 3. 点击“保存”按钮，完成设置。 4. 在编辑文章时，切换到HTML编辑模式。 5. 在需要高亮的代码块前后添加`[code]`标签，例如：`[code]
这是一段代码
[/code]`。
6. 点击“预览”按钮，即可看到代码高亮效果。帝国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>至此插件整合完成。
相关专题
