SEO技术博客dede教程 ↬ 正文dede教程

dede织梦更换百度ueditor编辑器实现代码高亮教程

深山2019-05-17 23:54dede教程快速评论

对于个人博客、网站建设等文章中需要设计到代码展示的网站,要直接复制代码上去,前台显示美观,要对织梦本身自带的编辑进行二开,过于麻烦,不是很适合,所以今天深山就来说说给织梦换上百度编辑器实现代码高亮显示:

1.下载百度编辑器:百度编辑器官网下载对应编码的百度编辑器https://ueditor.baidu.com/website/download.html

另一种织梦编辑器插入代码并且前台高亮显示可参考《织梦编辑器增加插入代码功能且前台文章中高亮显示》这也是深山博客目前在用的方法!

下载百度编辑器

2.安装百度编辑器:解压出来,得到的是utf8-php文件夹,我们将它改名为:ueditor,并将它上传到/include文件夹下

utf8-php改名为ueditor

3.配置百度编辑器:打开/include/inc/inc_func_funcAdmin.php找到184行,贴入以下代码。

else if($GLOBALS['cfg_html_editor']=='ueditor')
{
 $fvalue = $fvalue=='' ? '<p></p>' : $fvalue;
$code = '<script type="text/javascript" charset="utf-8" src="/include/ueditor/ueditor.config.js"></script>
 <script type="text/javascript" charset="utf-8" src="/include/ueditor/ueditor.all.js"></script>
<link rel="stylesheet" type="text/css" href="/include/ueditor/themes/default/css/ueditor.css"/>
<textarea name="'.$fname.'" id="'.$fname.'" style="width:100%;height:320px;">'.$fvalue.'</textarea>
<script type="text/javascript">var ue = new baidu.editor.ui.Editor();ue.render("'.$fname.'");</script>';
if($gtype=="print")
{
  echo $code;
 }
 else
{
 return $code;
}
}

4.设置dede编辑器:进入织梦网站后台,依次找到:系统-->系统基本参数-->核心设置-->将Html编辑器的值改为ueditor ,然后保存。

将Html编辑器的值改为ueditor

5.在需要显示代码高亮的模板文件中引入以下两个文件,也可以复制到其他目录再进行引用:

<link rel="stylesheet" type="text/css" href="/include/ueditor/third-party/SyntaxHighlighter/shCoreDefault.css"/> 
<script type="text/javascript" charset="UTF-8" src="/include/ueditor/third-party/SyntaxHighlighter/shCore.js"></script> 

6.调用函数,在需要显示代码高亮页面的模板中调用函数,例如我要在文章页实现代码高亮,则在article_article.htm中调用下面的函数

<script type="text/javascript">SyntaxHighlighter.all()</script>

7.后台可以插入代码,并且前台代码高亮显示

百度编辑器织梦后台插入代码


织梦前台代码高亮显示

本次深山个人博客分享的织梦更换百度编辑器并实现文章中代码高亮显示,到此结束,百度编辑器也有很大一部分人群在使用,但是深山始终不喜欢它。

- END -

浏览完了?你可以点我去评论留下观点!

评论

    不发表一下观点,这个评论功能拿来做什么?
    • 全部评论(0
      还没有评论,快来抢沙发吧!

本月热门

站点信息

  • 网站运行
  • 共有文章:78 篇
  • 标签管理标签云
  • 网站程序DedeCMS V5.7 SP2
  • 群二维码:加入SEO技术交流群