Windows Live Writer介绍及相关问题解决

Posted 2020-06-13

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Windows Live Writer介绍及相关问题解决相关的知识，希望对你有一定的参考价值。

今天本来想说更新一篇我的文章，更新的过程中添加了很多的内容，里面的图片太多了，导致我浏览器占用的内存不断增大，浏览器变得很卡，最后过了好久我终于更新完文章打算保存的时候居然卡住，然后所有我更新的文字和图片都丢失了，文章变得和更新钱一样，我很不爽，之前从来没有遇见这种情况，可能也就是因为写文章的时候添加的文字和图片太多了，于是我就想说能不能不用浏览器编辑博客文章，而换用一个软件来操作，这样就不会那么卡顿，很快我发现了博客园推荐使用的Windows Live Writer工具，这个工具其实我之前也见过，不过之前不知道是干嘛用的，之前的windows系统好像有的是默认自带了这个工具的。

这个工具在网路上有两个版本，一个是在线安装的版本，这个版本我安装的时候会出错，安装不了，还有一个是离线安装包，可以正常安装，这个离线安装包里面包含了很多的工具，自定义安装只安装Windows Live Writer就好了。安装的过程我就不说了。

在线安装包下载地址：http://www.microsoft.com/en-us/download/details.aspx?id=8621

离线安装包下载地址：http://g.live.com/1rewlive5-all/zh-cn/wlsetup-all.exe

Windows Live Writer配置步骤:

原文：http://group.cnblogs.com/topic/8550.html

1、在菜单中选择“工具”》“帐户”，出现下面的画面：

技术分享

2、点击“添加按钮”，在出现的窗口中选择“其他日志服务”，如下图：

技术分享

3、点击“下一步”，出现添加日志帐户的窗口，填入相应的内容，日志网址为您的博客主页地址，用户名填写您的登录用户名（不是Blog名，也不是显示名称）和密码，如下图：

技术分享

4、点击“下一步”，出现配置检测窗口

技术分享

注：如果自动配置没有成功，需要手动配置：

a) 在“Type of weblog that you are using”中选择“Custom(Metaweblog API)”。
b) “Remote posting URL for your weblog”中输入“http://www.cnblogs.com/Blog名/services/metaweblog.aspx”。

5、检测过程中会出现“是否要发布临时日志”窗口（如下图），一般选择“No”。

技术分享

6、检测完毕之后，会出现下面的窗口，点击“完成”就配置成功了。

技术分享

【超详细教程】使用Windows Live Writer 2012和Office Word 2013 发布文章到博客园全面总结

原文：http://www.cnblogs.com/liuxianan/archive/2013/04/13/3018732.html

去年就知道有这个功能，不过没去深究总结过，最近有写网络博客的欲望了，于是又重新拾起这玩意儿。

具体到底是用Windows Live Writer 2012还是用Word 2013，个人觉得看个人，因为这2个软件各有优点，各有缺点。

1、首先用LiveWriter发博客显然更专业，发布后的效果也与本地最接近，但是在编辑功能上肯定大不如Word，另外一个最大缺点是它本地保存的格式不是doc。

2、而Word的优点不言而喻，我们天天用Word，用Word就能发博客这简直就是一个天大的好消息，但用Word发布的博客发布后的效果与本地相差有时候还是挺大的。

总结：个人觉得，如果你对样式不是特别纠结，能够容仍发布后的效果与你想象的效果差一点点，那就毫不犹豫的选择Word吧！

下面首先讲用Windows Live Writer 2012发博客：

一、软件准备：

最新版的是Windows Live Writer 2012，但是不提供单独的安装包，它是和微软其它软件一起的（包括MSN、Window Move Maker等），软件大小为131M，官方下载地址：http://g.live.com/1rewlive5-all/zh-cn/wlsetup-all.exe

或者自己百度“Windows Essentials 2012 简体中文离线”。

二、安装：

安装很简单，如果你不想安装MSN等其它内置软件，请选择自定义安装，注意不能选择安装路径，这一点挺蛋疼的，默认装在C盘。

三、使用：

打开Windows Live Writer，第一次使用一般会让你设置博客地址以及帐号和密码，设置如下：

选择其它服务：

设置博客地址及其它信息：

然后会验证：

技术分享

然后会提示发布临时日志来下载主题，发布后会立即删除，所以一般选“是”：

然后就基本OK了。

四、代码高亮插件：

博客园官方给出了2个，一个一个介绍。

1、WindowsLiveWriter.CNBlogs.CodeHighlighter.rar

这个插件生成的高亮代码与网页上的一模一样，插入后即可立即显示效果，不过貌似它必须联网才能实时显示效果，因为博客园官方说这是基于“云处理”的。安装方法很简单，将上面的压缩包解压然后复制里面的文件到：

C:\\Program Files (x86)\\Windows Live\\Writer\\Plugins，然后重启Writer即可看到：

插入界面比较简单：

及时效果如下：

/**
     * 从一段文本中检索出唯一的结果
     * @param regx 正则表达式语句
     * @param text 要检索的文本
     * @return
     */
    public String regx(String regx,String text)
    {
        Matcher matcher=Pattern.compile(regx).matcher(text);
        if(matcher.find())
            return matcher.group();
        else
            return null;
    }

2、另外一个插件叫：Windows Live Writer Source Code plugin for SyntaxHighlighter，文件名叫SourceCodePlugin_version_1.1.zip，貌似博客园官方推荐这个插件，不过个人不太喜欢，最主要是不能及时显示效果。（虽然有网友研究出了本地预览效果的方法，但个人不太喜欢，想看的戳这里：http://www.cnblogs.com/huxi/archive/2009/12/13/1623190.html）

安装方法同上面一样，也是复制一个dll文件到插件目录，博客园官方教程：

http://www.cnblogs.com/cmt/archive/2009/11/27/1611900.html

界面如下：

及时效果如下（为了显示效果，此为编辑器的截图，可以发现不能及时高亮显示）：

发表后如下：

/**
 * 从一段文本中检索出唯一的结果
 * @param regx 正则表达式语句
 * @param text 要检索的文本
 * @return
 */
public String regx(String regx,String text)
{
    Matcher matcher=Pattern.compile(regx).matcher(text);
    if(matcher.find())
        return matcher.group();
    else
        return null;
}

可以发现，前者代码风格与网页版的第一个“插入代码”按钮相同：

而后面一个插件则与第二个类似：

个人觉得在代码插入方面博客园没有CSDN做的好，虽然网页版插入代码后有一个复制的按钮：

但是点击后还要我们手动按一下CTRL+C才能复制，且复制后一直是文本框的状态，不能还原成高亮代码样式了，表示这么多人用博客园，怎么就没有人反馈这一意见呢？？？技术分享

五、图片上传注意事项：

默认上传如果图片太大的话会压缩，且全部默认加上影音效果，改进方法如下：

随便插入一张图片，然后：

六、设置分类、标签、摘要、EntryName：

下面的数据域就是EntryName（即随笔或文章地址别名）。

七、排版技巧

参见这位网页写的文章：

CnBlogs博文排版技巧

接下来再讲讲Word2013发布博客到博客园的详细方法。

一、软件准备。

Word谁都有，所以软件准备这一步几乎可省略。具体哪一个版本开始有博客发布的功能我不知道，反正我用的是Word 2013。

二、第一次使用必须的配置：

打开一篇Word文档，然后点击左上角的“文件”，依次选择“共享”-->“发布至博客”：

一般会默认让你新建一个博客账户：

博客文章地址为：http://www.cnblogs.com/你的博客名称/services/metablogapi.aspx

图片选项一般选择“我的博客提供商”：

然后Word会新开一个窗口，要发布博客必须设置一个博客标题：

可以插入类别：

点击“发布按钮”，在文档的最上面会提示发布是否成功的信息，如下：

三、代码高亮显示：

一般你直接Eclipse或VS复制代码到Word默认就会保持高亮显示，我一般喜欢把代码插入到一个一行一列的表格中，如下：

但是发布后代码行间距变宽了，郁闷！

另外，Eclipse代码直接复制粘贴到Windows Live Writer是不会保持高亮显示的，所以这一点还是Word比较好。

如果想代码发布后样式更好看一点，推荐用一个Word的代码高亮显示插件，是一个国人写的，功能可能还有些欠缺，最主要的问题就是样式冲突，虽然可以通过设置“CSS定制风格”来解决，但是一旦你更换了博客的皮肤，这个代码显示就有可能不正常了。

具体使用方法参考原作者博客：

Word中使用代码高亮插件

比如我用的是coffee的主题，按照这个作者给出的设置，博客发布后成了这个样子：

正常的应该是这样的：

另外建议开启交替行变色功能，好看一点：

插入时的样式：

插入到Word后的样式：

发布后的样式上面已经给出了。

好了，很简单的东西竟然洋洋洒洒写了这么久，唉，我这人就是有这样一个坏毛病：就是什么东西一旦要做了就一定要做的最好！好了，吃饭去了，饿死了！

希望能对没用过的人有一些帮助！

Live Writer 使用小贴示：发博客时始终使用图片原始尺寸

原文：http://www.cnblogs.com/cmt/archive/2011/09/26/live_writer_insert_image.html

使用 Live Writer 发布博客，在插入图片时，Live Writer 默认会使用缩略图，并且将图片加上阴影效果。缩略图会让图片显示不清楚，阴影效果则是多此一举（而且效果通常不好）。

当博文中有很多图片时，用 Live Writer 发博就是一种痛苦，一种折磨 —— 要一张张修改图片属性（你被折磨过吗？），而 Live Writer 2011 终于提供了解药。

先在 Live Writer 中插入一张图片，然后设置为原始尺寸，并去掉阴影效果，如下图：

技术分享

然后点击“Set to default”，从此就远离在 Live Writer 中设置图片的痛苦。下图就是见证：

技术分享

Windows Live Writer 下载地址：http://explore.live.com/windows-live-writer

Windows Live Writer 配置帮助：http://home.cnblogs.com/group/topic/8550.html

[功能改进]Live Writer发博支持“建分类、加标签、写摘要”

原文：http://www.cnblogs.com/cmt/archive/2012/06/25/2560793.html

以前您在园子里用Windows Live Wirter发布博文是不是有以下三个不爽：

不爽1：如果想在发布随笔时新建分类并将随笔添加至该分类，需要先在博客后台添加分类，然后在Live Writer中刷新分类列表，并选择这个分类。

不爽2：如果想给随笔添加标签，需要在随笔发布后，进入博客后台进行标签的添加。

不爽3：如果想给发布随笔编写摘要，需要在随笔发布后，进入博客后台进行摘要的编写。

这次功能改进就是为大家消除这三个不爽。

如果你已经配置过Live Wirter，需要更新一下配置。点击下图中的"Update account information”按钮进行更新。

如果您是首次使用Live Writer，可以参考这篇帮助文档进行配置。

如何使用这些功能呢？下面分别为您介绍。

一、建分类

1. 点开Live Writer选择分类的下拉框。

2. 在下拉框底部Add Category的地方输入分类名称并点击Add按钮即可。

示例操作图片：

二、加标签

点击上图（“建分类”的截图）中的"View all"，打开如下图的窗口，在Keywords中输入逗号分隔的标签即可。

三、写摘要

还是点击"View all"，打开与“加标签”同样的窗口，在Excerpt中输入摘要内容即可。

预告：接下来，我们将会为大家消除第四个不爽 —— 代码着色，会通过Live Writer插件的形式实现，让代码着色所见即所得（WYSIWYG）。（该功能已实现）

提示：如果您使用Live Writer添加图片，一定要留意这个小技巧 —— Live Writer 使用小贴示：发博客时始终使用图片原始尺寸

对Live Writer支持的继续改进：设置随笔地址别名(EntryName)

原文：http://www.cnblogs.com/cmt/archive/2012/06/26/live_writer_cnblogs_entryname.html

在我们发布[功能改进]Live Writer发博支持“建分类、加标签、写摘要”之后，Artech提了一个很好的建议：希望在Live Writer发布随笔时可以设置EntryName。

现在，我们实现了这个功能，操作方法如下：

1. 如果之前配置过Live Writer，需要更新一下帐户配置。如下图：

2. 在Live Writer发布随笔窗口中，在选择分类的右侧，点击"View All"，出现如下的窗口：

2. 在"Slug"中输入相应的EntryName即可。

Windows Live Writer推荐SyntaxHighlighter代码着色插件

原文：http://www.cnblogs.com/cmt/archive/2009/11/27/1611900.html

博客园内置支持SyntaxHighlighter代码着色，代码着色语法：<pre class=‘brush:编程语言‘>代码</pre>。

需要注意的是：如何你使用SyntaxHighlighter代码着色，需要将默认编辑器改为TinyMCE。如果使用CuteEditor，CuteEditor会自动去除代码中的空格，造成代码格式破坏。

如果您使用Windows Live Writer写博客(配置步骤)，通过Windows Live Writer代码着色插件，可以方便进行SyntaxHighlighter代码着色。

我们推荐的代码着色插件是：Windows Live Writer Source Code plugin for SyntaxHighlighter

官方网址：http://sourcecodeplugin.codeplex.com/

本地下载：SourceCodePlugin_version_1.1.zip

安装方法：

将WindowsLiveWriter.SourceCode.dll复制到Windows Live Writer plugin文件夹:
* 32-bit systems: C:\\Program Files\\Windows Live\\Writer\\Plugins
* 64-bit systems: C:\\Program Files (x86)\\Windows Live\\Writer\\Plugins

使用方法：

安装成功之后，在Live Writer会出现“Source Code”插件，如下图：

点击该插件，粘贴需要着色的代码并选择相应的编程语言即可。

不过这个工具安装好后打开会出现一个错误，

解决办法就是

发布Live Writer代码着色插件CNBlogs.CodeHighlighter

原文：http://www.cnblogs.com/cmt/archive/2012/06/26/live_writer_cnblogs_code_highlight.html

在解决了使用Windows Live Writer发博所遇到的“建分类、加标签、写摘要”与“设置EntryName”的四个问题之后，我们趁热打铁，解决了第五个问题 —— 代码着色的问题。

代码着色以Live Writer插件的方式实现，采用了“云中着色”技术（呵呵，跟随当前云计算的潮流。实际只是将代码提交至服务器端处理）。

该代码着色的特点是所见即所得，着色效果与博客后台编辑器中的一样。

插件安装方法

1. 下载插件

下载地址：http://files.cnblogs.com/files/cmt/WindowsLiveWriter.CNBlogs.CodeHighlighter.zip

2. 安装插件

将WindowsLiveWriter.CNBlogs.CodeHighlighter.rar解压，将解压出来的文件复制到下面的位置：

* 32-bit Windows: "C:\\Program Files\\Windows Live\\Writer\\Plugins"
* 64-bit Windows: "C:\\Program Files (x86)\\Windows Live\\Writer\\Plugins"

复制后运行Live Writer，打开Insert菜单，就会看到这个插件，按钮名称为“插入代码”。见下图：

技术分享

插件使用方法

1. 点击“插入代码”按钮，出现如下的窗口：

技术分享

2. 选择对应的编程语言，并将代码复制/粘贴至该窗口，然后点击“确定”，就完成代码着色。效果见下图：

技术分享

搞定！

注：该插件基于Windows Live Writer Source Code plugin for SyntaxHighlighter（http://sourcecodeplugin.codeplex.com/）的代码修改而成。

为WLW开发Latex公式插件

原文：http://www.cnblogs.com/houkai/p/3398789.html

WLW是写博客的利器，支持离线、格式排版等，而且拥有众多的插件。博客园推荐了代码插入插件，但是没有提供WLW的公式编译插件。目前我的一般做法是：先在Word下使用MathType编辑好公式，然后将公式复制到WLW的本文中，总感觉有点麻烦。

简单学习了WLW插件的开发，决定自己开发一个WLW代码插入插件。比较简单，按照以下步骤，大家可以开发属于自己的公式插入插件。

首先，开发公式插入插件涉及两方面内容。一方面是公式的编辑，一般采用Latex数学排版，为了解析LaTex函数，我们需要Latex解析链接库，而Google Chart API提供了Latex的在线接口如下：http://chart.apis.google.com/chart?cht=tx&chl={latex}，其中{latex}就是要生成的代码，这里使用Google API（这样开发的插件使用中就需要联网了）。另一方面是WLW中插件的开发，介绍如下：

目前为止，Windows Live Writer的扩展功能还不是很强，它提供给我们如下两个方面对其扩展的可能：

a.应用程序级别的API：这部分API让我们能够在外部程序中启动并调用到Windows Live Writer的功能，以COM组件的形式提供。如果你要编写一个Firefox工具条上的小按钮，例如 “Blog It!” 之类，那么显然应该使用这类API。
b.文章内容插件：这部分API允许开发者对正在书写的文章内容进行修饰，实现与Windows Live Writer中自带的“Insert Link...”、“Insert Picture...”等类似的功能。若要编写文章内容插件，则需要从ContentSource或SmartContentSource两个基类中选择其一并继承自它。这两个基类提供了编写文章内容插件所需要的基础设施。ContentSource和SmartContentSource的区别如下：

ContentSource：如果你需要编写的插件将要在内容中插入一段简单的，插入之后不再修改（所谓“单向插入”）的内容片断，例如一个超链接，或是自定义的一段版权信息等，那么应该选择该类型的基类。Windows Live Writer中自带的“Insert Link...”就属于这类插件。
SmartContentSource：如果你需要编写的插件将在内容中插入一段较为复杂的，插入之后还可能要修改（所谓“双向交互”）的内容片杜阿，例如一张图片、一幅地图等，那么则应该选择这个类型的基类。Windows Live Writer中自带的“Insert Picture...”就属于这类插件。

可见，开发公式插件时选择ContentSource就可以了。

然后，编程实现插件的基本功能。

1.使用Visual Studio 2010新建C# Windows窗体应用程序。

2.设计插件的界面，界面如下：

技术分享

3.实现各按键的功能，包括粘贴、预览、插入、取消，如下：

public partial class MainForm : Form
{
    private static readonly string PicUrlPattern = @"http://chart.apis.google.com/chart?cht=tx&chl={0}";
    private static readonly string ImgTag = "<img src=\\"{0}\\" alt=\\"{1}\\" />";
    public MainForm()
    {
        InitializeComponent();
    }

    private void 粘贴_Click(object sender, EventArgs e)
    {
        string content = Clipboard.GetText();
        textBox_tex.Text = content;
    }

    private void 预览_Click(object sender, EventArgs e)
    {
        if (check())
        {
            pictureBox_Preview.ImageLocation = ImgUrl;
        }
    }

    private void 插入_Click(object sender, EventArgs e)
    {
        this.DialogResult = DialogResult.OK;
    }

    private void 取消_Click(object sender, EventArgs e)
    {
        this.DialogResult = DialogResult.Cancel;
    }

    public string ImgUrl
    {
        get { return String.Format(PicUrlPattern, HttpUtility.UrlEncode(textBox_tex.Text)); }
    }

    public string ImgInTag
    {
        get { return String.Format(ImgTag, ImgUrl, textBox_tex.Text); }
    }

    private bool check()
    {
        if (textBox_tex.Text.Trim() == "")
        {
            MessageBox.Show(this, "请填写latex");
            return false;
        }
        return true;
    }
}

注意：HttpUtility在System.Web库中，需要添加引用System.Web.dll，并在文件头部添加using System.Web。如果没有找到System.Web.dll，把项目属性中的目标框架修改为.NET Framework 2.0即可，推荐使用2.0，发现.net 4.0开发的插件和我的WLW版本不兼容技术分享。

调试程序，直至窗口可以正常运行。

创建接口类，将上述窗口转化为WLW插件。

a.添加对WindowsLive.Writer.Api的引用（WLW的安装目录下WindowsLive.Writer.Api.dll），并添加using WindowsLive.Writer.Api;。

b.将项目属性中输出类型修改为类库，删除Program.cs文件。

c.新建一个类，继承自ContentSource，并覆盖相应方法。

[WriterPlugin("adf1e416-b2e9-44e1-8612-c405bbcf1359",
    "插入Latex",
    PublisherUrl = "http://www.cnblogs.com/houkai/",
    ImagePath = "tex.png",
    Description = "插入公式")
]
[InsertableContentSource("插入公式")]
public class LiveWriterLatexPlugin : ContentSource
{
    public override DialogResult CreateContent(IWin32Window dialogOwner, ref string content)
    {
        using (MainForm form = new MainForm())
        {
            DialogResult result = form.ShowDialog();
            content = form.ImgInTag;
            return result;
        }
    }
}

注意我们为该类添加了WriterPlugin属性：

第一个参数为一个Guid，可以通过Guid生成器得到即可，如http://www.guidgenerator.com/online-guid-generator.aspx，起标识的作用。

第二个参数为该插件的名称，将在Windows Live Writer的插件管理器中看到。技术分享

第三个参数PublisherUrl为发布者的网站地址。

第四个参数ImagePath为插件的图标文件路径，下载或自己制作一个好看的png图片（png格式透明，比较好看），添加到项目中，修改图片的”生成操作”为“嵌入的资源”即可。

技术分享

第五个参数Description为插件的一小段描述介绍，表示插入选项中该插件的详细信息。

该类还应用了InsertableContentSource属性，此属性本用于定义插件在WLW的“Insert”菜单和“Insert”快捷面板的名称，但新版的WLW已经去除了插入菜单与侧边栏，因此应用此属性只是为了保持向前兼容。

注意CreateContent()方法的第二个参数为ref string newContent，这个ref string就表示由该插件生成的html代码。

最后编译Release生成DLL文件，将DLL文件放到WLW安装目录的Plugins下，重启WLW即可。

我的Latex公式插件可下载。有很多博客中介绍了WLW插件的开发，大家有兴趣可以学习插件开发的详细内容。剩下的内容就是Latex下如何进行数学公式的编辑了，下节再介绍吧。

维护版本（由于google chart api地址修改，原插件已失效）

最新的Latex插件可以下载

实例：

CnBlogs博文排版技巧

原文：http://www.cnblogs.com/lyj/archive/2008/11/30/1344463.html

最近很多博友问，你的文章如何排版的？你的代码怎么这么漂亮？你的图片怎么有阴影效果？为了满足大家需要，我特地总结一下博文排版技巧~~希望你读完这篇文章后有个全新的体验和轻松的心情写博文了~~

在博客园博文五要素：标题、段落、代码、图片、版权。

我的原则是HTML最简、文章最美观、内容最清晰！本篇文章适用Windows Live Writer。

一、写作方式选择

在线Web编辑器：博客园提供了三种在线编辑器，我想这个是给博文内容写的少的用户提哦方便的，各有优点。推荐使用TinyMCE。

Windows Live Writer：配置好设置，详情请看这里。就可以离线专心写文章啦。推荐使用Windows Live Writer离线写博文，不会因为网络问题引起数据丢失，预览也比较方便。

Microsoft Office Word：另一种离线方式，配置好设置也可以写文章，但是不推荐，因为存在转换HTML过程，这转换的HTML简直多的吓死人，对搜索不利，文章排版不容易控制。

二、排版样式

标题样式

标题分为：标题1、标题2……使用<h1>、<h2>……表示，写作时，添加适当的标题，你的博文内容会清晰了很多哦。

有不少博友标题使用“<p><strong>标题</strong></p>”表示，这是不好的，还是建议使用<h1>、<h2>……表示。

当然由于旧的博皮问题，建议大家还是使用Custom之后的博皮或者是2008年的博皮比较标准，博皮列表在这里。不过有的<h1>、<h2>的CSS样式被重写了，我们需要重新定义，在博客后台(选项---Configure---通过CSS定制页面下面的文本框)定义：

这里我给出的的样式：

.postBody h1
{
    margin: 15px 0;
    padding: 0;
    font-size: 135%;
}
.postBody h2
{
    margin: 15px 0;
    padding: 0;
    font-size: 125%;
}
.postBody h3
{
    margin: 15px 0;
    padding: 0;
    font-size: 110%;
}

段落样式

段落，我们平常写的一段一段的文字就是段落了，用“<p>段落</p>”表示，段落在不同的博皮下面有的会自动首行缩进，有的没有，不过我不推荐使用“ (空格)”来代替首行缩进。没有缩进功能也是一样美观的，相反使用“ (空格)”HTML就变乱了很多。

例如我这篇介绍，只用了<h2>、<h3>表示标题和<p>表示段落还有<pre>用于代码。

其它样式

我还定义了<img>和<strong>样式了。

具体自定义样式请点击：http://www.cnblogs.com/lyj/customcss.aspx下载CSS。

三、代码样式

我们想要的代码样式，就是提供一个区域块，显示自己需要展示的代码片段，一些关键字能够高亮显示就行了。看看我所找到的代码样式，分享一下；

博友A型：可能没有弄清怎么写博客或者不想排版博文，直接就是正文一样的代码。

博友B型：受到博客园的熏陶，使用博客园“插入代码”功能，好好的代码弄成了啥样，高亮显示不健全还弄个灰色div包裹着，还显示了行号太不雅了。

丁学型：Web精简专家，尽量做到HTML代码的精简(这样对搜索有利，很容易搜索到)，所以他连代码都是以节约著称。

阿一型：哎~这么浪费，好好的代码非要在线运行起来，所以弄上大大的文本框很按钮，整个页面代码都在那个文本框中。谁让阿一是负责Web前端的呢？

老赵型：老将亲自动手，原来的代码就是手动自定义的，哪个关键字需要高亮显示，就手动定义，实在麻烦啊~~现在使用插件替换了过去的劳动力了。

插件型：使用了Windows Live Writer的各种各样代码插件，例如：Syntax Highlighter、Syntax Highlighter for Windows Live Writer，这些插件效果很不好，生成HTML吓人了，有的还有JS代码，主要原因是没有比较这些插件~~

受害型：所有代码没有缩进，整在一排输出了，这不是他的错，他是受害者，是CuteEditor编辑器的BUG错。CuteEditor的一个BUG会过滤掉每行前面的空白，这样导致代码没有缩进，整在一排输出了，哎~换成“纯文本框”就可以了，这一点颗粒宁博爱体会最深了~~

老李型：这是我看好的最精简、好看的代码了，打上100分。下面重点介绍

小李型：我的，很早时候参照老李的~~

上面生成代码的HTML大多数都是使用<div>作为外层，用 充当空格，使用<br>来换行(照理说应该是<br/>)，高亮显示方式各异，完全违背了Web标准。W3C无法通过~~

最佳方案：

强烈大家使用Windows Live Writer的Paste from Visual Studio插件，从这里下载，如需高亮显示代码，只要从Visual Studio或者SQL Server中复制一下，然后点击“插入from Visual Studio...”。其HTML代码就自动生成了~，唯一的缺点就是每次会在结尾加一个空链接，可能来注明版权吧。

该插件代码使用<pre>标签，没有空格、换行HTML标签(节省一些HTML代码)，提供class="code"自定义<pre>标签样式。有自动缩进功能。代码原样输出，需要高亮的关键字使用<span style="color:颜色">关键字 </span>定义了样式。是我看过定义代码样式HTML代码最少的一个插件。其它插件生成HTML代码居多，对搜索不利。

看看Paste from Visual Studio生成的代码，点击放大：

我们使用Windows Live Writer写博文，建议把博客园编辑器设置为“纯文本框”(后台选项---Preferences---默认编辑器或者后台左边操作快捷通道)，千万不要使用CuteEditor，这个编辑器存在一些BUG，由于这个插件不是使用“ ”来缩进的，直接是空白用于缩进，编辑器存在BUG会过滤掉每行前面的空白，这样导致你的代码没有缩进，整在一排输出了，就如上面的受害型，当然还有其它BUG~~

我们可以在博客后台(选项---Configure---通过CSS定制页面下面的文本框)定义code的CSS样式让包裹代码的边框更有风格~~提供我的样式：

.code
{
    background: #fbedbb;
    border: #c0c0c0 1px solid;
    padding: 5px;
    margin: 0 40px 0 20px;
    font-family: Verdana,Helvetica, "微软雅黑" , Arial, "宋体" , sans-serif;
}

大家可以随意修改背景颜色啊，边框样式啊，达到自己的风格。

四、图片处理

一篇文章图文并茂才好看，推荐我使用的一款截图小工具685KB：SPX Instant Screen Capture (截图工具) 绿色版 v6.0，可以添加注释和边框效果。我们不要定义HTML，直接在图片上加上阴影效果。

管理图片

我觉得CuteEditor编辑器的管理图片功能比较强大，可以自由管理、上传自己的图片（这就要不时的切换编辑器了），推荐大家使用CuteEditor来上传图片，然后在Windows Live Writer中插入图片是来引用地址，不建议使用Windows Live Writer自动提交上传图片功能，这样图片地址、图片名称不容易控制，另外它还自动生成一个图片缩略图即一张图片在服务器上生成两张，这无疑浪费了博客园空间资源。

管理图片功能(点击放大)

我相信以后博客园会专门开发个图片管理功能的。

插入图片

我们插入图片，根据博皮选择，博客园博皮分两种，一种是自适应宽度的，例如InsideDotNet博皮，根据你的浏览器分辨率而自动适应。这种的好处是：可以自适应宽度，什么分辨率都可以填满。但是，不同分辨率下浏览器效果会有变化，特别是文章排版也会发生变化。还有一种是固定宽度的，例如ChinaHeart博皮，整体宽度一般是950px（1024×768分辨率下也能取得较好的显示效果），一般正文显示区域660px宽度，所以图片最好宽度小于550px，以便取得较好的显示效果。固定宽度的优点是：宽度固定，什么分辨率下的显示效果都一样。从而保证你的排版能被忠实的反映出来。缺点是：太宽的分辨率下，两边会比较空，对于分辨率比较大的用户而言有点浪费。

我们插入图片时推荐使用alt标签定义说明，这样对搜索有利。按照博皮选择，插入适当大小的图片，如果对于图片过大可以使用height、width强制定义图片大小，然后对图片加上超链接，像这样：

<p><a href="http://images.cnblogs.com/cnblogs_com/lyj/NHibernate/6-2.jpg"
      target="_blank">
     <img alt="成功提交代码覆盖率分析结果" height="295" width="460" 
     src="http://images.cnblogs.com/cnblogs_com/lyj/NHibernate/6-2.jpg"/></a></p>

如果你想显示图片速度快点，可以减少图片大小，利用Windows自带的画图工具无损压缩一下：只要使用画图工具打开图片，另存为就可以了，其它什么也不做，这样一个500KB可以减小到100KB的大小，这样显示速度也快点，也减少了空间，一举两得。