ARTERY.cn

帝国CMS8.0文章内容代码高亮显示

artery by 2026 / 01 / 29 ∙ Views

下载下面文件:

文章内容代码高亮显示.zip
50a89aaa85b5fbac211a2bdba98d10c9.zip (193.65 KB)

解压上面的压缩文件,将文件夹codesnippet上传到:./eadmin/admin/ecmseditor/infoeditor/plugins/
(eadmin和admin这两个文件夹的名字如果改过,那就上传到你改后的文件夹内~~)
将:monokai-sublime.min.css、highlight.min.js、highlightjs-line-numbers.js这三个文件上传到您的帝国网站根目录,之所以要放到根目录而不放到插件目录,是因为前台需要调用这三个文件,会暴露您的后台管理地址。
把./eadmin/admin/ecmseditor/infoeditor/config.js改为下面内容:

function EcmsEditorDoCKhtml(htmlstr){
    if(htmlstr.indexOf('"')!=-1){return '';}
    if(htmlstr.indexOf("'")!=-1){return '';}
    if(htmlstr.indexOf("/")!=-1){return '';}
    if(htmlstr.indexOf("\\")!=-1){return '';}
    if(htmlstr.indexOf("[")!=-1){return '';}
    if(htmlstr.indexOf("]")!=-1){return '';}
    if(htmlstr.indexOf(":")!=-1){return '';}
    if(htmlstr.indexOf("%")!=-1){return '';}
    if(htmlstr.indexOf("<")!=-1){return '';}
    if(htmlstr.indexOf(">")!=-1){return '';}
    return htmlstr;
}

function EcmsEditorGetCs(){
    var js=document.getElementsByTagName("script");
    for(var i=0;i<js.length;i++)
    {
        if(js[i].src.indexOf("ckeditor.js")>=0)
        {
            var arraytemp=new Array();
            arraytemp=js[i].src.split('?');
            return arraytemp;
        }
    }
}

var arraycs=new Array();
arraycs=EcmsEditorGetCs();
arraycs[0]=arraycs[0].replace('infoeditor/ckeditor.js','');
arraycs[1]=document.getElementById('doecmseditor_eaddcs').value;
arraycs[1]=EcmsEditorDoCKhtml(arraycs[1]);

CKEDITOR.editorConfig = function( config ) {

    config.filebrowserImageUploadUrl = '';
    config.filebrowserFlashUploadUrl = arraycs[0];
    config.filebrowserImageBrowseUrl = arraycs[1];
    config.filebrowserFlashBrowseUrl = arraycs[1];

    config.enterMode = CKEDITOR.ENTER_BR;
    config.shiftEnterMode = CKEDITOR.ENTER_P;

    config.allowedContent = true;

    config.font_names='宋体/宋体;黑体/黑体;仿宋/仿宋_GB2312;楷体/楷体_GB2312;隶书/隶书;幼圆/幼圆;微软雅黑/微软雅黑;'+config.font_names;

    config.extraPlugins = 'codesnippet,etranfile,etranmedia,etranmore,autoformat,ecleanalltext,einsertbr,einsertpage,einserttime,equotetext';

    config.codeSnippet_theme = 'monokai_sublime';

    config.toolbar_full = [
        { name: 'document', groups: [ 'mode', 'document', 'doctools' ], items: [ 'Source', '-', 'Preview', 'Print' ] },
        { name: 'clipboard', groups: [ 'clipboard', 'undo' ], items: [ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ] },
        { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ], items: [ 'NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote', 'CreateDiv', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock', '-', 'BidiLtr', 'BidiRtl' ] },
        '/',
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'CopyFormatting', 'RemoveFormat', 'ecleanalltext', 'autoformat' ] },
        { name: 'links', items: [ 'Link', 'Unlink', 'Anchor' ] },
        { name: 'insert', items: [ 'Image', 'etranmore', 'Flash', 'etranmedia', 'etranfile', '-', 'Table', 'HorizontalRule', 'SpecialChar', 'equotetext', 'einserttime', 'einsertpage', 'einsertbr', '-', 'CodeSnippet' ] },
        '/',
        { name: 'styles', items: [ 'Styles', 'Format', 'Font', 'FontSize' ] },
        { name: 'colors', items: [ 'TextColor', 'BGColor' ] },
        { name: 'tools', items: [ 'ShowBlocks', 'NewPage', 'Templates' ] },
        { name: 'others', items: [ '-' ] },
        { name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ], items: [ 'Find', 'Replace', '-', 'SelectAll', 'Maximize' ] }
    ];

    config.toolbar_basic = [
        { name: 'document', groups: [ 'mode', 'document', 'doctools' ], items: [ 'Source' ] },
        { name: 'clipboard', groups: [ 'clipboard', 'undo' ], items: [ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ] },
        { name: 'links', items: [ 'Link', 'Unlink', 'Anchor' ] },
        { name: 'insert', items: [ 'Image', 'Table', 'HorizontalRule', 'SpecialChar' ] },
        { name: 'tools', items: [ 'Maximize' ] },
        { name: 'others', items: [ '-' ] },
        '/',
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Strike', '-', 'CopyFormatting', 'RemoveFormat' ] },
        { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ], items: [ 'NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote' ] },
        { name: 'styles', items: [ 'Styles', 'Format' ] }
    ];

    config.toolbar = 'full';
};

去后台编辑一下您现用的新闻内容模板,在[!--temp.footer--]前面加:

<!--代码高亮引入脚本 -->  
<link rel="stylesheet" href="[!--news.url--]monokai-sublime.min.css">
<script src="[!--news.url--]highlight.min.js"></script>
<script src="[!--news.url--]highlightjs-line-numbers.js"></script>
<script>document.addEventListener("DOMContentLoaded",()=>{hljs.highlightAll();hljs.initLineNumbersOnLoad?.({singleLine:!0,startFrom:1});document.querySelectorAll("pre").forEach(p=>{if(p.dataset.wrapped)return;p.dataset.wrapped="1";const w=document.createElement("div");w.className="code-wrapper";const h=document.createElement("div");h.className="code-header";const t=document.createElement("span");t.className="title";const c=p.querySelector("code");let lang="CODE";if(c){const m=c.className.match(/language-(html|xml|css|js|javascript|php|java|python|json|sql|bash|shell|cpp|csharp|go|ruby|swift|kotlin|typescript|apache|coffeescript|cs|diff|http|ini|makefile|markdown|nginx|objectivec|perl|vbscript|xhtml)/i);lang=m?m[1].toUpperCase().replace("JAVASCRIPT","JS").replace("COFFEESCRIPT","CoffeeScript").replace("OBJECTIVEC","Objective-C").replace("VBSCRIPT","VBScript"):lang}t.textContent=lang+":";const b=document.createElement("button");b.className="copy-btn";b.textContent="复制";h.append(t,b);p.parentNode.insertBefore(w,p);w.append(h,p);b.onclick=()=>{const txt=c?.innerText.trim()??"",clip=navigator.clipboard;if(clip&&clip.writeText)clip.writeText(txt).then(()=>{b.textContent="已复制!";b.style.color="#4caf50";setTimeout(()=>{b.textContent="复制";b.style.color=""},2000)}).catch(()=>fallback(txt,b));else fallback(txt,b)};function fallback(t,b){const ta=document.createElement("textarea");ta.value=t;ta.style.position="fixed";ta.style.opacity="0";document.body.appendChild(ta);ta.focus();ta.select();try{document.execCommand("copy")?(b.textContent="已复制!",b.style.color="#4caf50",setTimeout(()=>{b.textContent="复制";b.style.color=""},2000)):(alert("复制失败,请手动选中"))}catch(e){alert("复制失败,请手动选中")}document.body.removeChild(ta)}})});</script>

浏览器和帝国后台都更新一下缓存就完成安装了,这样会在编辑器中多出一个按钮:

对于代码语言的类型在前台页面中是自动判断的(因为不同代码语言的高亮方式不一样),但有时也会判断出错,比如有时会把“Html”误判为“PHP”,这样的话就最好在编辑内容时手工去选择一下。
手工选择还有另一个好处,就是在后台编辑时也能高亮显示代码:

全部评论:0收藏本文
0