帝国cms7.5ckeditor编辑器代码高亮插件

开心阅读    2021-03-25   827

  帝国cms自带的编辑器不带代码高亮插件,而作为技术博客,要经常分享一些代码,所以就需要这个高亮插件,网上发的很多都不能用,这个是本人亲自测试可行的,分享给大家HdO外贸大学城

  使用说明:HdO外贸大学城

  注意压缩包内有两个文件和两个文件夹:HdO外贸大学城

  如果你的网站没有二开过,请直接覆盖config.js和plugins文件到/e/admin/ecmseditor/infoeditor/目录下HdO外贸大学城

  如果你的网站二开过或修改过默认的CK编辑器,请手动修改/e/admin/ecmseditor/infoeditor/目录下的config.js文件,修改方法如下:HdO外贸大学城

  1.查找:{ name: 'insert',在 items:里面找增加元素CodeSnippet,注意大小写;HdO外贸大学城

  2.查找config.extraPlugins,在后面增加codesnippet;HdO外贸大学城

  增加默认样式:config.codeSnippet_theme= 'obsidian';放到尾部即可,可以参考我修改的config.jsHdO外贸大学城

  样式有很多,可以访问http://www.xxxxx.com/e/admin/ecmseditor/infoeditor/plugins/codesnippet/samples/codesnippet.html,找到你喜欢的样式,复制样式名到这里即可HdO外贸大学城

  最后一步,将skin目录直接上传到网站根目录下,PS:里面的obsidian.css和上面设置的默认样式名要对应,其他样式可以到/e/admin/ecmseditor/infoeditor/plugins/codesnippet/lib/highlight/styles目录下去找HdO外贸大学城

  然后在文章模板中增加以下代码:HdO外贸大学城

  <script src="[!--news.url--]skin/liuge/obsidian.css"></script>
<script src="[!--news.url--]skin/liuge/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

  HdO外贸大学城

  HdO外贸大学城

  安装完后请强制刷新浏览器再到编辑器界面看是否有插入代码段按钮HdO外贸大学城

  注:若发现怎么改config.js里面的配置,编辑器还是不显示代码按钮,试着覆盖我提供的eshoweditor.php文件到/e/admin/ecmseditor/目录下HdO外贸大学城

  本插件适用于帝国cms7.5,其他版本请自行测试HdO外贸大学城

帝国cms7.5ckeditor编辑器代码高亮插件HdO外贸大学城

演示截图:HdO外贸大学城

发表评论

请选择支付方式

×
支付宝支付
微信支付
余额支付
×
微信扫码支付 0 元