【syntaxhighlighter的使用】的更多相关文章

kindeditor4整合SyntaxHighlighter，让代码亮起来

这一篇我将介绍如何让kindeditor4.x整合SyntaxHighlighter代码高亮,因为SyntaxHighlighter的应用非常广泛,所以将kindeditor默认的prettify替换为SyntaxHighlighter代码高亮插件 上一篇"让kindeditor显示高亮代码"中已经说过,高亮代码主要用的是class,所以 第一步:首先修改kindeditor代码高亮写入pre标签时的class类名: 打开/kindeditor4/plugins/code/code.j…

博客代码美化(SyntaxHighlighter)

这篇博文主要讲解自己使用SyntaxHighlighter对代码进行美工中遇见的问题以及如何使用SyntaxHighlighter? 首先来看看SyntaxHighlighter对代码美工的效果吧! 2015年8月23日以前贪玩小神个人博客代码效果如下: function helloSyntaxHighlighter(){return "hi!";} 使用SyntaxHighlighter美化代码效果如下: ? 1 2 3 4 5 6 function helloSyntaxHighl…

代码高亮美化插件-----SyntaxHighlighter

IT类文章博客,代码高亮美化插件-----SyntaxHighlighter 最近在做一个类似个人博客的网站,因为文章中会用到各种代码,主要是Javascript,CSS,PHP,XML等.这些代码如果单纯的用html&css来处理,稍显繁琐.于是,在网上搜索了一些关于文章中代码如何美化高亮的信息,找到有关于SyntaxHighlighter和Google-Code-Prettify的资料.鉴于SyntaxHighlighter已经是一个相对比较成熟稳定的老牌语法高亮插件了,而且还支持复制.在新…

代码高亮插件SyntaxHighlighter

http://alexgorbatchev.com/SyntaxHighlighter/download/…

解决代码着色组件SyntaxHighlighter行号显示问题

SyntaxHighlighter是根据代码中的换行符分配行号的.但是,如果一行代码或者注释比较长,在页面显示时需要分成多行显示,这时行号就对不上了.如下图: 通过下面的css强制不换行,可以避开这个问题. .syntaxhighlighter .line { white-space: pre !important; } 但这样会出现横向滚动条,而不想出现横向滚动条,css要改为这样: .syntaxhighlighter .line { white-space: pre-wrap !impor…

cnblog code syntaxhighlighter view

wlw代码插件 测试多款 wlw插入代码插件 在博客园的代码高亮效果 1.Code Snippet 1: public override void Update() 2: { 3: base.Update(); 4: } 5:  6: public virtual void Standup() 7: { 8: SetState(CCharacterState.Idle); 9: } 2.Insert Code 1: public override void Update() 2: { 3: ba…

SyntaxHighlighter -- 代码高亮插件

SyntaxHighlighter 下载文件里面支持皮肤匹配. 地址:http://alexgorbatchev.com/SyntaxHighlighter/…

syntaxhighlighter语法高亮

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> &l…

主题: 为kindsoft编辑器替换SyntaxHighlighter代码高亮，整合DEDECMS

作者: fmamcn, 发布日期: 2012-09-29 12:28:39, 浏览数: 1567 看了狼魂发表的将kindeditor中的代码高亮插件prettify换为SyntaxHighlighter 自己试了一下,总有一些问题,后来还是自己研究了一下,找了一些文档,做了一个 DeDeCMS本身的标记其不好用,更换为KindEditor后确实很不错了,但是KindEditor编辑器的代码高亮确实不怎么好看,也不怎么使用,虽然很简洁,但是功能上还是显得匮乏一些,所以就动手改了改,现在分享出来!…

[原]SyntaxHighlighter使用笔记

[Date]2013-09-21 [Environment]SyntaxHighlighter 3.0.83 [Author]wintys (wintys@gmail.com) http://wintys.cnblogs.com [Content]: 1.下载 SyntaxHighlighter 3.0.83 : http://alexgorbatchev.com/SyntaxHighlighter 2.配置 (1) SyntaxHighlighter解析的默认标签,默认为pre SyntaxH…

SyntaxHighlighter代码高亮插件

SyntaxHighlighter它是Google Code在一个开源项目,主要用于对代码着色页, 使用十分方便,效果也不错,并且差点儿支持常见的全部语言. 使用步骤: 一.下载并解压缩SyntaxHighlighter(http://download.csdn.net/detail/itmyhome/7757359)当前版本号3.0.83 二.引入文件 将解压后的scripts和styles目录拷贝到项目中,在页面中引入shCore.js和核心CSS文件shCore.css 其次引入你要高亮的…

代码高亮插件推荐——SyntaxHighlighter++

SyntaxHighlighter++这个插件的最大的优点就是可以在编辑器的下方有一个输入框,里面可以输入代码,然后插入到文章中.就不用编辑文章的时候,在可视化和文本之间来回切换了.非常适合不熟悉html的博主. 支持的语言有AppleScript.AS3.Bash.C.C++.C#.ColdFusion.CSS.Delphi.Diff.Erlang.Groovy.HTML.Java.JavaFX.JavaScript.Perl.PHP.Plain.PowerShell.Python.Ruby.…

syntaxhighlighter的使用

第一 解压压缩包,scripts文件夹中包含了各种语言的JS文件,在styles文件夹中是各种显示高亮的主题 第二 如何使用?首先要引入其核心javascript文件shCore.js和核心CSS文件shCore.css,这两个是必选要引入的.其次引入你要高亮的语言JS,比如我想高亮显示的是C#,那么必须引入在scripts文件夹中的shBrushCSharp.js,最后引入高亮显示的主题CSS,默认的为shThemeDefault.css 第三 下面以高亮显示JavaScript代码为例讲解.…

SyntaxHighlighter去掉右上角帮助图标的正确方法

先贴出问题图片: 关于这个问题.网上有很多的帖子,说了三种方法,经过测试,发现其中有些方法是有问题的,有的方法虽然能过解决问题,但是却会带来其他的错误.现在说明如下: 网上的原话: syntaxhighlighter可以高亮着色显示几乎所有语言形式的源代码,还可以显示行号,是一款深受网站建设人员喜爱的工具,并且它还是免费的. 使用免费产品就有帮它宣传的义务,所以,在使用该工具时,会自动显示一个帮助图标,点击它会提示访问官方网站并呼吁捐款,付费后可以去掉该图标. 官方的做法无可非议,不过如果我们想…

SyntaxHighlighter 代码高亮极简单配置

页首Html代码: <!--<link type="text/css" rel="stylesheet" href="https://blog-static.cnblogs.com/files/WNpursue/shCoreRDark.css"/>--> <script type="text/javascript" src="https://blog-static.cnblogs.com…

SyntaxHighlighter行号显示错误问题解决方案

SyntaxHighlighter是根据代码中的换行符分配行号的.但是,如果一行代码或者注释比较长,在页面显示时需要分成多行显示,会出现行号对不上的问题,像这样: 通过设置CSS强制不换行,可以保证行号显示正常,但会出现滚动条,像这样: 使用开发者工具查看SyntaxHighlighter所渲染的元素可以看到,每个行号和每行代码都是一个div,而由于是行号和代码是分别放在两个td中进行的高度计算,导致了在其中一部分出现高度变化时,两部分的高度不同. 这时候考虑在元素渲染完成后,动态改变行号的默认…

JS插件---->SyntaxHighlighter的使用

SyntaxHighlighter是一款用于web页面的代码着色工具,可以用来着色多种语言.今天我们通过实例来学习一下它的用法.旧同桌不是老情人,但与你分享过的青春不比初恋少半分. SyntaxHighlighter的简单实例 一.SyntaxHighlighter的代码流程如下 .Add base files to your page: shCore.js and shCore.css .Add brushes that you want (for example, shBrushJScrip…

UEditor整合代码高亮插件SyntaxHighlighter

1  下载UEditor : http://ueditor.baidu.com/website/download.html 下载SyntaxHighlighter :https://github.com/syntaxhighlighter/syntaxhighlighter (版本:3.0.83) 2 UEditor的功能太多,根本就不用向用户开放这么多功能. 首先,UEditor的元素路径就不用显示给用户看了,没这个必要, 打开ueditor.config.js.如下图所示,将关于元素路径的第…

WP SyntaxHighlighter 初探

继上篇文章发布后,我随即去网上找了下博客园.CSDN他们用的高亮工具,果然都是用的别人的,SyntaxHighlighter.去官网上看了下,很强大,包含各种经典配色以及多语言.要想在wordpress中使用,也很方便,因为已经有前辈把插件都开发出来了. 想试一试的朋友们去插件管理中搜索插件WP SyntaxHighlighter,选评分5颗星的那个点击安装(单纯的认为分高就是靠谱,总不会有人用这个刷分吧),然后就集成在文章编辑中了. 在右上角,我也是刚安装,现在一起试试吧. 首先是pre功能:…

一款代码高亮插件 -- SyntaxHighlighter

SyntaxHighlighter 是当前用得最多的一款代码高亮插件,包括本博客也用到了该插件来显示代码,大家可以看到效果了.只不过这是针对WordPress的一款代码高亮插件,而今天我要给大家介绍的是针对所有类型网站都可以用的juqery插件不容错过额. 使用步骤 1.默认代码格式 <pre class="brush:js;toolbar:false">var myMood ="happy"; //单词“happy”是JavaScript语言中的一个字…

高亮代码 SyntaxHighlighter

SyntaxHighlighter: http://alexgorbatchev.com/SyntaxHighlighter/download/ demo <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/19…

CKeditor插件开发流程(二)SyntaxHighlighter

CKEditor整合SyntaxHighlighter实现代码高亮显示 1,版本说明 CKEditor:ckeditor_4.0.1_standard.zipSyntaxHighlighter:syntaxhighlighter_3.0.83.zip 2,解压syntaxhighlighter_3.0.83.zip,将得到的目录syntaxhighlighter_3.0.83复制到站点目录下,我的是放在/plugins目录下(可以是其它目录,或者根目录),结果得到目录结构/plugins/syn…

才知道 Windows Live Writer Source Code plugin for SyntaxHighlighter 更新到2.0了

这是我用 Windows Live Writer 发布的第一篇文章! 在官方网站看到 Windows Live Writer Source Code plugin for SyntaxHighlighter 源码已经到2.0了,只是没有生成 dll 而已,自己用vs生成了2.0版本,最看中的是可以更改代码区的字体和大小了,很棒! public class HelloBlog { private String txtContent = ""; public void write(Stri…

SyntaxHighlighter使用方法

原名:SyntaxHighlighter,是一款用于web页面的代码着色工具,可以用来着色多种语言,可以是HTML,CSS,Javascript,还可以是C,JAVA等编程语言.最早见于Yahoo的YUI,当时还属于自由软件,最近打开官方网站发现已被goolge收编. 它可以在网页中对各种程序源代码语法进行加亮显示.支持当前流行的各种编程语言:C#.CSS.C++.Delphi.Java.JavaScript.PHP.Python.Ruby.SQL.Visual Basic.XML / HTML…

SyntaxHighlighter

SyntaxHighlighter uses separate syntax files called brushes to define its highlighting functionality. Brush name Brush aliases File name ActionScript3 as3, actionscript3 shBrushAS3.js Bash/shell bash, shell shBrushBash.js ColdFusion cf, coldfusion sh…

让 SyntaxHighlighter 3.x 支持 Lua 语法着色

1. [代码]shBrushLua.js /** * SyntaxHighlighter * http://alexgorbatchev.com/SyntaxHighlighter * * SyntaxHighlighter is donationware. If you are using it, please donate. * http://alexgorbatchev.com/SyntaxHighlighter/donate.html * * @version * 3.0.83 (Jul…

WordPress代码高亮插件SyntaxHighlighter终极使用详解

子曰: 工欲善其事,必先利其器.作为码农一枚,再加上站长这个已经不再光鲜的称呼,岂能没有一款经济实用.操作简单.而且功能必须强大.样式也必须好看的Wordpress代码高亮插件?!作为一个视代码如生命的码农,把代码整的漂漂亮亮是一件多么神圣和伟大的事情啊! 今天就给大家推荐一款这样的代码高亮插件:SyntaxHighlighter Evolved.相信我, 功这款插件能强足够大.并且简单易用,绝对值得推荐.本站就是用的这款插件,大家可以看看“生病的JavaScript代码”,这就是最好的例子.插…

用 Windows Live Writer 和 SyntaxHighlighter 插件写高亮代码

博客园内置支持SyntaxHighlighter代码着色,代码着色语法:<pre class='brush:编程语言'>代码</pre>. 需要注意的是:如何你使用SyntaxHighlighter代码着色,需要将默认编辑器改为TinyMCE.如果使用CuteEditor,CuteEditor会自动去除代码中的空格,造成代码格式破坏. 如果您使用Windows Live Writer写博客(配置步骤),通过Windows Live Writer代码着色插件,可以方便进行Syntax…

防止SyntaxHighlighter.js的闪烁闪一下的方法

SyntaxHighlighter.js是一个代码高亮的JS插件,使用也很简单,但是由于是浏览器段执行JS代码来着色,会出现视觉上闪一下的效果.比如你的20行代码网页打开显示高度为100px,但是SyntaxHighlighter高亮后该区域高度变为120px 加上颜色的变化,这样的体验特别不好. 解决原理:把pre标签的样式定义为 高亮后的样式即可 解决方法:在shCoreDefault.css文件加上如下样式 pre { line-height:22px !important; backgr…

让kindeditor显示高亮代码

kindeditor4.x代码高亮功能默认使用的是prettify插件,prettify是Google提供的一款源代码语法高亮着色器,它提供一种简单的形式来着色HTML页面上的程序代码,实现方式如下: 首先在编辑器里面插入javascript代码: 确定后会在编辑器插入这样的代码: <pre class="prettyprint lang-js"><script> var KE; KindEditor.ready(function(K) { KE = K.cre…