当前位置: 首页 > 设计 > 正文
avatar

PJBlog自带的代码显示相对比较的简单,一直比较喜欢syntaxhighlighter的显示效果,这次威言威语就教你如何在PJBlog上使用syntaxhighlighter。

Syntaxhighlighter的这种代码的效果看起来还是很不错的。

代码显示更加的清晰美观。

这种效果是在Google上看见的,觉得很不错,于是就有了把她弄到PJBlog上的想法。经过一些简单的修改,也实现了这样一个效果。

下面就来介绍一下是怎么实现这一效果的!我是在PJBlog3 v2.8.5.157 的基础上修改的,建议修改前请备份!

第一步:下载文件:Syntaxhighlighter,解压。将解压下来的 veisin 文件夹上传到 common 文件夹下面。

第二步:打开 common 文件夹中的 ubbcode.asp,找到

'-----------List标签----------------

大概位于290行。在

‘———–List标签—————-

的前面有一个

End If

End If

的前面加上下面的代码

因为代码转置问题,无法正常写在文章中,请大家点击这个txt,然后复制其中的代码:http://www.weisay.com/blog/weiimg/article/Syntaxhighlighter.txt

第三步:打开根目录下的 header.asp 文件,找到

<link rel="stylesheet" rev="stylesheet" href="FCKeditor/editor/css/Dphighlighter.css" type="text/css" media="all" /><!--FCK块引用&代码样式-->

在后面加入下面这段代码

<link rel="stylesheet" rev="stylesheet" href="common/veisin/veisin.css" type="text/css" />

第四步:打开根目录的 footer.asp 文件,找到

<script type="text/javascript">initAccessKey()  //转换AccessKey For IE</script>

在后面加上下面的代码

<script language="javascript" src="common/veisin/shCore.js"></script>
<script type="text/javascript" src="common/veisin/shBrushJScript.js"></script>
<script type="text/javascript" src="common/veisin/shBrushVb.js"></script>
<script type="text/javascript" src="common/veisin/shBrushCss.js"></script>
<script type="text/javascript" src="common/veisin/shBrushCSharp.js"></script>
<script type="text/javascript" src="common/veisin/shBrushCpp.js"></script>
<script type="text/javascript" src="common/veisin/shBrushDelphi.js"></script>
<script type="text/javascript" src="common/veisin/shBrushJava.js"></script>
<script type="text/javascript" src="common/veisin/shBrushPhp.js"></script>
<script type="text/javascript" src="common/veisin/shBrushPython.js"></script>
<script type="text/javascript" src="common/veisin/shBrushRuby.js"></script>
<script type="text/javascript" src="common/veisin/shBrushSql.js"></script>
<script type="text/javascript" src="common/veisin/shBrushXml.js"></script>
<script type="text/javascript">
dp.SyntaxHighlighter.ClipboardSwf = 'common/veisin/clipboard.swf';
dp.SyntaxHighlighter.HighlightAll('code');
</script>

当然了这上面并不是所有的我们都用的到,所以我们可以有选择的添加。

第五步:找到 FCKeditor 文件夹,打开FCKeditor/editor/css/Dphighlighter.css,删除下面的代码。

 .Content-body li {
 list-style:disc
 }

第五步是为了解决数字的显示问题,如果不去掉的话,那么代码前面的数字将不会显示,而是显示一个小圆点。

第六步:效果显示。

下面就是怎么用这个效果了。

在UBB下发表文章,代码我们原来是用【code】【/code】 ( 将【】换成[] )

现在我们发布代码的时候用【code=**】【/code】 ( 将【】换成[] )

此时**代表Vb,JScript,Css,CSharp,Cpp,Delphi,Java,Php,Python,Ruby,Sql,Xml

终于全部写完了,累死了……

PS:忘了说了,你发布的代码是什么类型的,就用什么类型的标签。这样不容易出错。换句话说,比如你写的是CSS代码,而你用的JScript来发布,有可能会显示错误的。所以呢,此适用于那些懂点代码的朋友!

本文固定链接: http://www.weisay.com/blog/syntaxhighlighter-for-pjblog.html | 威言威语

[代码高亮]syntaxhighlighter For PJBlog:目前有13 条评论

  1. avatar
    5楼
    david Internet Explorer Windows

    如果出现横向滚动条后,鼠标主在view plain时,下面会不停的出现灰色表格,请威哥指点。
    我的网站:http://www.oracle321.com/article.asp?id=44

    2012-09-08 16:08 [回复]
    • avatar
      William 猎豹浏览器 Windows

      没有发现,你用的是什么浏览器看到那个情况的?

      2012-09-08 23:12 [回复]
      • avatar
        david Internet Explorer Windows

        在ie9、360浏览器里发现这个问题,用遨游测试正常,有点怪。

        2012-09-08 23:28 [回复]
        • avatar
          William Internet Explorer Windows

          应该是代码过长导致的,你优化下代码书写吧

          2012-09-09 01:53 [回复]
  2. avatar
    4楼
    蜗牛 Google Chrome Windows

    报错了。或出现:Microsoft VBScript runtime ���� ‘800a1399’
    Syntax error in regular expression
    /common/ubbcode.asp���� 280,什么问题?

    2012-01-07 02:35 [回复]
    • avatar
      William Google Chrome Windows

      这个是在PJBlog3 v2.8.5.157 修改的,不知道你的版本是不是这个

      2012-01-08 20:27 [回复]
    • avatar
      William Google Chrome Windows

      确实有问题,我刚刚试了下,发现发布的代码被转置了,我刚刚更新过文章了,最新版的PJblog V3.2.9.518也是支持的。

      2012-01-09 00:26 [回复]
      • avatar
        蜗牛 Google Chrome Windows

        谢谢,现在首页显示没问题,但是打开到内容页,只显示textarea, 我的博客地址 http://www.woaicss.com/ 首页从上数 第三篇文章,我改了 static.htm 文件不起作用。不懂asp,希望能帮解答,谢谢!

        2012-01-09 22:56 [回复]
        • avatar
          William Google Chrome Windows

          刚刚看了下,貌似正常的啊 :?:

          2012-01-09 23:22 [回复]
          • avatar
            蜗牛 Google Chrome Windows

            恩,修改好了,非常感谢

            2012-01-10 14:28 [回复]
  3. avatar
    地板
    左岸岛 Unknow Browser Unknow Os

      哇~~相当不错的东西~~
    顺便请教下,评论框下面的“点击显示验证码”怎么实现呢?
    而且有一个严重的问题,当我把用户登陆表单弄到侧边栏显示以后,登陆框上的验证码与留言本验证码、评论框验证码发生冲突,如何解决呢?

    William 于 2009-10-09 08:28 PM 回复
    是不是你修改了验证码这一块啦,戒聊的v300是将光标移到输入验证码框里的时候才出现验证码呢~

    2009-10-09 17:45 [回复]
  4. avatar
    板凳
    pter Unknow Browser Unknow Os

    文件无法下载

    William 于 2009-05-24 01:47 AM 回复
    现在可以下载了!

    2009-05-23 16:09 [回复]
  5. avatar
    沙发
    阿布 Unknow Browser Unknow Os

    谢谢博主,我已经修改成功了!

    2008-09-19 16:43 [回复]

发表评论

question razz sad smile redface biggrin surprised eek confused cool lol mad rolleyes wink neutral cry

快捷键:Ctrl+Enter