Windows Live Writer 实现代码高亮

更新时间：2009年05月12日 18:22:30 作者：

有时会包含大量代码，如果能在文章中高亮显示代码文章的可读性肯定会好很多。

为了实现代码高亮，之前找了很多插件，但是效果都不是很理想。经过研究终于找到一个完美的解决方案，这个解决方案具有如下优点：

代码简洁，用<pre>标签实现代码高亮，不会生成太多Html标签。
支持多种语言，包括c#,c++,php,python等10多种语言。
扩充方便，可以通过简单二次开发实现对其它语言的支持。
使用方便，把代码复制到代码高亮转换窗口即可。

下面一步步介绍如何配置WLW+wordpress的代码高亮解决方案：

1.准备工作：

下载 precode code snippet manager

下载成功后得到一个名为PreCodePlugin_4.0.2.msi的文件

下载 SyntaxHighlighter2.0

下载成功后得到一个名为syntaxhighlighter_2.0.296.zip文件。

2.安装：

关闭Windows Live Writer,安装PreCodePlugin_4.0.2.msi。安装成功后启动WLW，此时在插件列表里应该出现一项名为PreCode Snippet的插件。

将syntaxhighlighter_2.0.296.zip解压缩至wordpress的活动主题目录，例如：\www\wp\wp-content\themes\lutuzhi\syntaxhighlighter

3.在header.php 中，在<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />下方添加：

复制代码代码如下:

<script type="text/javascript" src="scripts/shCore.js"></script> 
<script type="text/javascript" src="scripts/shBrushBash.js"></script> 
<script type="text/javascript" src="scripts/shBrushCpp.js"></script> 
<script type="text/javascript" src="scripts/shBrushCSharp.js"></script> 
<script type="text/javascript" src="scripts/shBrushCss.js"></script> 
<script type="text/javascript" src="scripts/shBrushDelphi.js"></script> 
<script type="text/javascript" src="scripts/shBrushDiff.js"></script> 
<script type="text/javascript" src="scripts/shBrushGroovy.js"></script> 
<script type="text/javascript" src="scripts/shBrushJava.js"></script> 
<script type="text/javascript" src="scripts/shBrushJScript.js"></script> 
<script type="text/javascript" src="scripts/shBrushPhp.js"></script> 
<script type="text/javascript" src="scripts/shBrushPlain.js"></script> 
<script type="text/javascript" src="scripts/shBrushPython.js"></script> 
<script type="text/javascript" src="scripts/shBrushRuby.js"></script> 
<script type="text/javascript" src="scripts/shBrushScala.js"></script> 
<script type="text/javascript" src="scripts/shBrushSql.js"></script> 
<script type="text/javascript" src="scripts/shBrushVb.js"></script> 
<script type="text/javascript" src="scripts/shBrushXml.js"></script> 
<link href="styles/shCore.css" type="text/css" rel="stylesheet" /> 
<link href="styles/shThemeEmacs.css" type="text/css" rel="stylesheet" /> 
<script type="text/javascript">SyntaxHighlighter.config.clipboardSwf = 'scripts/clipboard.swf';SyntaxHighlighter.all();</script>

如此配置之后,通过Windows Live Writer插入的代码，在wordpress中可以十分优雅的显示出来。

您可能感兴趣的文章:

代码高亮

为SyntaxHighlighter添加新语言的方法
因为经常要在博客里贴一些Lua代码，但是所使用的SyntaxHighlighter插件默认不支持Lua语言，所以去研究了一下如何为SyntaxHighlighter添加并激活一个新的语言，这里将过程和有同样需求的童鞋分享
2013-10-10
关于jsp版ueditor1.2.5的部分问题解决(上传图片失败)
这篇文章主要介绍大家在使用jsp版ueditor1.2.5的碰到的一些问题解决方法，需要的朋友可以参考下
2013-06-06
常用的HTML富文本编译器UEditor、CKEditor、TinyMCE、HTMLArea、eWebEditor、Ki
这篇文章主要介绍了常用的HTML富文本编译器UEditor、CKEditor、TinyMCE、HTMLArea、eWebEditor、KindEditor简介,需要的朋友可以参考下
2017-03-03
kindSoft在线网页编辑器简单的配置参数介绍
对于网页编辑器对做项目的时候是非常的又用的一个编辑器，大大的减轻了开发人员的负担，感觉KindSoft是一个不错的选择，因此也在不断的使用接下来介绍参数配置，需要的朋友可以了解下
2013-01-01
autogrow 让FCKeditor高度随内容增加的插件
让FCKeditor高度随内容增加的插件,这个插件在默认情况下可能运行不正常，必须做一点修改才可以。
2011-02-02
FCK编辑器（FCKEditor）添加新按钮和功能的修改方法
最近项目需要对已有的FCKeditor添加新的功能，以前的做法只是在外壳处再次封装，这次无法满足需求只能进行内部修改了。
2010-11-11
让IE8和IE9支持eWebEditor在线编辑器的方法
这篇文章主要介绍了让IE8和IE9支持eWebEditor在线编辑器的方法,eWebEditor常用在ASP制作的网站后台中,是比较古老的一款在线编辑器了,需要让IE8和IE9支持的朋友可以参考下
2014-06-06
彻底解决ewebeditor网站后台不能上传图片的方法
随着windows操作系统和IE浏览器版本的不断推出，很多客户都渐渐放弃了IE6，IE7，使用上了IE8浏览器，但是突然发现自己网站后台里面的eWebEditor文本编辑器的插入图片等等按钮失效了，鼠标点击后什么反应都没有，IE浏览器左下角显示一个黄色的感叹号提示错误，就以为是网站空间、服务器中毒了呢，一时间纷纷都来找我们询问
2012-03-03
FCKeditor编辑器添加图片上传功能及图片路径问题解决方法
现在很多CMS系统因为安全原因会把后台编辑器里的上传功能给去除，但这样一来对实际使用过程造成了很多麻烦，今天我们以ASPCMS系统的FCKeditor编辑器为例，说明一下如何增加图片上传功能
2014-04-04
最新版CKEditor的配置方法及插件(Plugin)编写示例
本文记录配置CKEditor过程，并以文章分页插件为例，简要CKEditor Plugin编写过程。从官网http://ckeditor.com/download下载最新版CKEditor，解压
2017-03-03