php ueditor代码高亮显示怎么设置

avatar
作者
猴君
阅读量:0

要在PHP中使用UEditor实现代码高亮显示,可以按照以下步骤操作:

  1. 在UEditor的配置文件config.json中添加代码高亮插件。找到"toolbars",在其中添加"code"插件,如下所示:
"toolbars": [     [         "source",         "|",         "undo",         "redo",         "|",         "bold",         "italic",         "underline",         "fontborder",         "strikethrough",         "superscript",         "subscript",         "removeformat",         "formatmatch",         "autotypeset",         "blockquote",         "pasteplain",         "|",         "forecolor",         "backcolor",         "insertorderedlist",         "insertunorderedlist",         "selectall",         "cleardoc",         "|",         "rowspacingtop",         "rowspacingbottom",         "lineheight",         "|",         "customstyle",         "paragraph",         "fontfamily",         "fontsize",         "|",         "directionalityltr",         "directionalityrtl",         "indent",         "|",         "justifyleft",         "justifycenter",         "justifyright",         "justifyjustify",         "|",         "touppercase",         "tolowercase",         "|",         "link",         "unlink",         "anchor",         "|",         "imagenone",         "imageleft",         "imageright",         "imagecenter",         "|",         "simpleupload",         "insertimage",         "emotion",         "scrawl",         "insertvideo",         "music",         "attachment",         "map",         "gmap",         "insertframe",         "highlightcode",         "webapp",         "pagebreak",         "template",         "background",         "|",         "horizontal",         "date",         "time",         "spechars",         "snapscreen",         "wordimage",         "|",         "inserttable",         "deletetable",         "insertparagraphbeforetable",         "insertrow",         "deleterow",         "insertcol",         "deletecol",         "mergecells",         "mergeright",         "mergedown",         "splittocells",         "splittorows",         "splittocols",         "charts",         "|",         "print",         "preview",         "searchreplace",         "drafts",         "help"     ] ] 
  1. 在UEditor的config.json中找到"code"配置,设置代码高亮显示的语言类型。例如:
"code": {     "highlight": true,     "highlightLanguages": [] } 
  1. 在UEditor的引入页面中引入prism.js和prism.css文件,用于实现代码高亮显示。可以在UEditor的官网或者GitHub上下载这两个文件。

  2. 在UEditor的引入页面中添加代码高亮显示的初始化代码,例如:

<script type="text/javascript">     UE.getEditor('editor', {         toolbars: [['highlightcode']],     }); </script> 

通过以上步骤设置,即可在UEditor中实现代码高亮显示功能。

广告一刻

为您即时展示最新活动产品广告消息,让您随时掌握产品活动新动态!