御墅临枫 發表於 2025-6-16 00:00:00

通过syntaxhighlight实现帝国cms代码高亮/语法高亮(二) 在编辑器中加载

<p>在进行整合之前,首先要保证syntaxhighlight能在网站中正常使用。<br /><br />1.这时候需要下载另外一个插件:<br /><br />地址:http://psykoptic.com/userfiles/files/FCKEditor-syntaxhighlight_2.1.0.zip<br />2.将syntaxhighlight2解压到e\admin\ecmseditor\infoeditor\editor\plugins目录,如图<br /><br /><img style="max-width:100%!important;height:auto!important;"alt="4解压到.jpg" height="227" src="https://zhuji.jb51.net/uploads/allimg/20250616/1-250616142502135.jpg" width="660" /><br /><br />3.syntaxhighlight2的lang文件夹新建文件zh-cn.js,这其实是对syntaxhighlight的汉化。<br /><br />内容如下:<br />&nbsp;</p>
<div class="msgheader"><div class="right"><u>复制代码</u></div>代码如下:</div>
<div class="msgborder" id="phpcode22"><br />FCKLang.SyntaxhighlightBtn = &#39;插入/编辑高亮源代码&#39;;<br />FCKLang.DlgSyntaxhighlightTitle = &#39;Syntax Highlighter 2&#39;;<br />FCKLang.SyntaxHightlightTab1 = &#39;源代码&#39;;<br />FCKLang.SyntaxHightlightTab2 = &#39;高级选项&#39;;<br />// source code tab<br />FCKLang.SyntaxHightlightLang = &#39;选择语言&#39;;<br />FCKLang.SyntaxHightlightEnterCode = &#39;输入代码&#39;;<br />// advanced tab<br />FCKLang.SyntaxHightlightGutter = &#39;行号&#39;;<br />FCKLang.SyntaxHightlightGutterDetail = &#39;隐藏行号&#39;;<br />FCKLang.SyntaxHightlightNoControls = &#39;工具面板&#39;;<br />FCKLang.SyntaxHightlightNoControlsDetail = &#39;隐藏工具面板.&#39;;<br />FCKLang.SyntaxHightlightCollapse = &#39;Collapse&#39;;<br />FCKLang.SyntaxHightlightCollapseDetail = &#39;代码块是否默认折叠。(controls need to be turned on)&#39;;<br />FCKLang.SyntaxHightlightLineCount = &#39;起始行号&#39;;<br />FCKLang.SyntaxHightlightLineCountDetail = &#39;该配置项允许修改起始行的行号. 默认值为 1.&#39;;<br />FCKLang.SyntaxHightlightShowcolumns = &#39;显示列&#39;;<br />FCKLang.SyntaxHightlightShowcolumnsDetail = &#39;在第1行显示列.(好像没有效果)&#39;;<br />FCKLang.SyntaxHightlightLines = &#39;显示高亮行&#39;;<br />FCKLang.SyntaxHightlightLinesDetail = &#39;该配置项用来着重显示某些代码行。例如 3,10,15.&#39;;<br />FCKLang.SyntaxHightlightInformation = &#39;<strong>注意:</strong>该插件必须配合<strong>Java Script SyntaxHighlighter</strong>alexgorbatchev.com使用. 如果您的网站没有配置SyntaxHighlighter,该插件不会有任何效果!&#39;;</div>
<p></p>
<p><br />4.修改e/admin/ecmseditor/infoeditor/fckconfig.js文件</p>
<div class="msgheader">代码如下:</div>
<div class="msgborder" id="phpcode23"><br />FCKConfig.Plugins.Add(&#39;syntaxhighlight2&#39;,&#39;zh-cn&#39;);<br />// default language options:<br />// c++,csharp,css,delphi,java,jscript,php,python,ruby,sql,vb,xhtml<br />FCKConfig.SyntaxHighlight2LangDefault =&#39;css&#39;;</div>
<p></p>
<p><img style="max-width:100%!important;height:auto!important;"alt="5加载.jpg" height="377" src="https://zhuji.jb51.net/uploads/allimg/20250616/1-250616142502421.jpg" width="651" /></p>
<p>5.接着修改该文件的FCKConfig.ToolbarSets[&quot;Default&quot;]值,找到FCKConfig.ToolbarSets[&quot;Default&quot;]相关项,添加SyntaxHighlight2按钮。</p>
<p></p>
<p></p>
<p><img style="max-width:100%!important;height:auto!important;"alt="6添加按钮.jpg" height="276" src="https://zhuji.jb51.net/uploads/allimg/20250616/1-250616142503414.jpg" width="660" /><br />&nbsp;<br />&nbsp;</p>
<p>6.清空浏览器缓存,重新登录,在编辑器上出现syntaxhighlight2按钮。</p>
<p><br /><img style="max-width:100%!important;height:auto!important;"alt="7按钮效果.jpg" height="128" src="https://zhuji.jb51.net/uploads/allimg/20250616/1-250616142503153.jpg" width="660" /></p>
<p></p>
<p>单击该按钮,出现syntaxhighlight2插件的对话框,如下图</p>
<p><br />&nbsp;<img style="max-width:100%!important;height:auto!important;"alt="8按钮效果2.jpg" height="498" src="https://zhuji.jb51.net/uploads/allimg/20250616/1-250616142503L0.jpg" width="484" /></p>
<p><img style="max-width:100%!important;height:auto!important;"alt="9按钮效果3.jpg" height="497" src="https://zhuji.jb51.net/uploads/allimg/20250616/1-250616142503421.jpg" width="489" /><br />&nbsp;&nbsp;<br />至此我们完成了帝国cms6.6整合syntaxhighlight,实现了内容页面代码高亮。</p>
<div class="clearfix"></div>
頁: [1]
查看完整版本: 通过syntaxhighlight实现帝国cms代码高亮/语法高亮(二) 在编辑器中加载