最近又开始想起了写博客，用来记录一下自己所学到的知识和总结近期的学习经验。在博客园发表了一篇博客后，发现博客园的代码块真是难以入目，就决定去美化一下。
准备工作
既然要美化代码显示，当然要选择一个代码高亮的js插件，这里我选择的是SyntaxHighlighter插件。
其次要在博客园申请使用js代码的权限，只有申请了js权限，才可以在页面添加自己的js代码。
开始美化
1、在博客园的管理>设置>页脚Html代码框中添加
/**
* SyntaxHighlighter
*/
function foo()
{
if (counter <= 10)
return;
// it works!
}
]]>
其中shCore.js与shCore.css是必须的，而'shBrushJScript.js'与shBrushCss.js则是代表了JavaScript和Css的代码高亮规则，可根据自己的常用语言自行添加。做完这些美化也就基本完成了。
2、可是当我们用Markdown发表一篇博客后却发现，代码块的样式并没有改变。解决的方法就是在写Markdown时将
这样SyntaxHighlighter就可以成功渲染代码块了。
注意： Markdown中的代码块应当与文本空一行，不然渲染后代码的第一行会出现br标签！
扫描二维码关注公众号，回复：
6269180 查看本文章
SyntaxHighlighter的基本配置
在pre标签的class中我们还可以对代码块进行简单的设置
需要什么只需在class中添加即可。
至此，代码块的美化工作就已经全部完成了，不出问题大家应该已经看到了效果。其实SyntaxHighlighter还提供了一些主题供人选择，只需将相应的theme.css引入到script中即可，也是十分简单，这里就不在赘述了。