您现在的位置是：首页 > cms教程 > 帝国CMS教程帝国CMS教程

帝国cms编辑器代码高亮的方法，帝国cms编辑器怎么代码高亮

绿春2023-05-05帝国CMS教程已有人查阅

导读帝国cms编辑器中使用代码高亮的方法，教大家如何在帝国cms编辑器中整合highlight。1.首先下载highlight

帝国cms编辑器中使用代码高亮的方法，教大家如何在帝国cms编辑器中整合highlight。
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。可以调整样式在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>

本文标签：

很赞哦！ ()

上一篇：帝国cms关闭投稿不需要的系统模型和栏目的方法

下一篇：帝国cms搜索页怎么支持php和动态标签

图文教程

相关源码

(自适应响应式)房产合同知识产权企业管理pbootcms模板下载本模板基于PbootCMS系统开发，为知识产权服务、法律咨询及企业合同管理等行业设计。采用严谨专业的布局风格，突出法律文书与知识产权服务行业特色，适合展示各类法律服务和知识产权相关内容。查看源码
(自适应)平面设计网络工作室个人作品展示网站模板免费下载基于PbootCMS内核开发的响应式网站模板，为设计工作室、创意机构打造的作品展示解决方案。通过模块化布局与极简交互设计，呈现设计作品的视觉细节，支持作品分类、案例解析等多维度展示方式。查看源码
(PC+WAP)中英双语户外用品帐篷装备pbootcms网站模板下载这款基于PbootCMS开发的中英文双语模板专为户外装备行业设计，适配PC和移动设备。模板采用现代化设计风格，突出户外产品的功能性和实用性，帮助企业建立专业的国际化展示平台。查看源码
(PC+WAP)楼承板建筑工程合金钢铁材料pbootcms网站源码下载为楼承板生产商及建筑工程企业设计的响应式网站模板，采用PbootCMS内核开发，同步适配电脑与移动设备浏览。通过模块化结构展示工程案例、产品参数等专业内容，帮助建筑建材企业建立标准化数字展示平台，提升行业专业形象。查看源码
(自适应响应式)工业机床工程农业机械设备网站源码下载框架适用于工程机械、机床设备等工业领域。通过模块调整可快速转型为农业机械、物流设备展示系统。预留7种工业产品展示模板。查看源码
(自适应响应式)html5蓝色智能水表营销型网站pbootcms模板下载PbootCMS内核开发，为智能水表企业打造的营销型网站解决方案，本模板基于PbootCMS内核开发，为智能水表及相关行业企业设计，采用HTML5+CSS3技术构建，具有响应式布局。查看源码