kindeditor4.x代码高亮功能默认使用的是prettify插件,prettify是Google提供的一款源代码语法高亮着色器,它提供一种简单的形式来着色HTML页面上的程序代码,实现方式如下:

首先在编辑器里面插入javascript代码:

确定后会在编辑器插入这样的代码:

<pre class="prettyprint lang-js">&lt;script&gt;

var KE;

KindEditor.ready(function(K) {

KE = K.create('#content',{

filterMode : false

});

});

&lt;/script&gt;</pre>

这里要主的就是class=”prettyprint lang-js”

接下来换web页面显示了,首先载入css和js

<link href="/Public/plug/kindeditor/plugins/code/prettify.css"  rel="stylesheet" type="text/css">

<script src="/Public/plug/kindeditor/plugins/code/prettify.js"></script>

注意:你的改成你自己的路径

然后在</body>的前面加:

<script type="text/javascript">

prettyPrint();

</script>

效果如下:

不过prettify感觉着色不是很好,所以决定要换一个,下一个我们将讲SyntaxHighlighter的的集成。

原文地址:http://www.d8jd.com/art/55803.html

让kindeditor显示高亮代码的更多相关文章

  1. 新浪博客如何显示高亮代码,DIY

    新浪博客对代码的支持功能不尽完美,或者说一点都不好,可是对于一个追求完美的技术痴而言,代码不能够完美的显示,心里总有那么一些不爽,那么如何在新浪中显示那些带颜色的代码呢?经过探究,可以如下设置:   ...

  2. sublime高亮代码导出

    何在word/博客中使用SublimeText风格的代码高亮样式 原文链接:http://www.cnblogs.com/Wayou/p/highlight_code_with_sublimetext ...

  3. 轻量级jQuery语法高亮代码高亮插件jQuery Litelighter。

    <!DOCTYPE html><html><head><meta charset="UTF-8" /><title>jQ ...

  4. php 两段文本对比,不同的文字显示高亮

    php 两段文本对比,不同的文字显示高亮[下面这个只能区分错误后面的..]   <?php $str1 ="MIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwgg ...

  5. 解决 git 中文路径显示 unicode 代码的问题

    解决 git 中文路径显示 unicode 代码的问题 当被修改的文件中带有中文字符时,中文字符会被转换为 unicode 代码,看不出原来的文件名. 这时,只要配置 :: git config -- ...

  6. [置顶] 如何更改CSDN博客高亮代码皮肤的样式,使博客看起来更有范(推荐)

    由于本人写博客的时候,也没有配置博客的相关属性,因此贴出来的代码块都是CSDN默认的,因此代码背景色都是白色的,如下所示: 但是本人在浏览他人博客的时候,发现有些博客的代码块看起来比较有范,整个代码库 ...

  7. 一段文字中的几个keyword显示高亮

    将一段文字中的几个keyword显示高亮 演示样例:将"我的愿望是当个绿巨人,所以我想让我的皮(derma)肤是绿色"中的"皮肤"显示绿色. <span ...

  8. 在Word2010文档中显示域代码而非域值

    当Word2010文档中含有域内容时,默认情况下显示域值,这样可以使插入的域内容清晰明了.用户可以根据需要选择显示域代码或显示域值,操作步骤如下所述: 步骤/方法 第1步,打开Word2010文档窗口 ...

  9. 浏览器直接显示html代码,不解析代码

    在某些时候,我们可能因为某些特殊的原因,不想让浏览器解析html代码. 1,把代码放到js中,如下 <script type='text/html' style='display:block'& ...

随机推荐

  1. 从I/O复用谈epoll为什么高效

    上一篇文章中,谈了一些网络编程的基本概念.在现实使用中,用的最多的就是I/O复用了,无非就是select,poll,epoll 很多人提到网络就说epoll,认为epoll效率是最高的.单纯的这么认为 ...

  2. 开源:Taurus.MVC 框架

    为什么要创造Taurus.MVC: 记得被上一家公司忽悠去负责公司电商平台的时候,情况是这样的: 项目原版是外包给第三方的,使用:WebForm+NHibernate,代码不堪入目,Bug无限,经常点 ...

  3. 一个免费的、跨平台的、开源音频编辑器Audacity

    Audacity 是一个免费的开源程序,用于编辑音频录制.它可在多个平台(windows/linux)上运行.Audacity 基于 GUI,是一个具有多种选项的强大程序.它支持您录制各种类型的声音. ...

  4. 细说WebSocket - Node篇

    在上一篇提高到了 web 通信的各种方式,包括 轮询.长连接 以及各种 HTML5 中提到的手段.本文将详细描述 WebSocket协议 在 web通讯 中的实现. 一.WebSocket 协议 1. ...

  5. iframe用法

    <iframe src="http://caiyanli.top/" height="500"  width="500" frameb ...

  6. category中重写方法?

    问:可以在category中重写方法吗? 答:代码上可以实现 在category中重写方法,但在实际开发中,不建议这样做.如果确实需要重写原有方法也建议使用子类进行重写. category是为了更方便 ...

  7. nodejs项目mysql使用sequelize支持存储emoji

    nodejs项目mysql使用sequelize支持存储emoji 本篇主要记录nodejs项目阿里云mysql如何支持存储emoji表情. 因由 最近项目遇到用户在文本输入emoji进行存储的时候导 ...

  8. maven-sprigmvc-mybatis配置

    pom.xml配置 <?xml version="1.0"?> <project xsi:schemaLocation="http://maven.ap ...

  9. Android之Dedug--Circular dependencies cannot exist in AnimatorSet

    今日,在学习AnimatorSet时,使用play.with.after.before时,代码书写如下: ObjectAnimator animator1 = ObjectAnimator.ofFlo ...

  10. Atitit.cto 与技术总监的区别

    Atitit.cto 与技术总监的区别 1. 核心区别1 2. Cto主要职责1 3. 如何提升到cto1 4. CTO五种基本的必备素质:2 5. 2 1. 核心区别 技术总监(Chief Tech ...