搞掉你的代码高亮插件

黑乎乎的代码贴到文章里面,既不美观,看起来也不方便,所以平地一声雷,代码高亮插件就来了,而且是各种各样的代码高亮插件,中国的,外国的。

技术宅以及程序猿估计是最需要代码高亮插件的人群,他们会在文章里经常调教代码;不过,我这个伪技术男,由于经常折腾wordpress源码,搞一搞主题神马的,也给自己安装了个代码高亮插件,但后来不知道为什么,插件的核心css文件竟然被禁用了,高亮效果也就失去了。借着这次网站瘦身的东风,狠了狠心,你丫都不起作用了,我还留你干嘛?直接拖出来干掉!!

插件是干掉了,但代码高亮的功能还是需要,百度了一阵子,找到了无插件实现代码高亮的方法,使用在线代码编辑器,将需要高亮的代码贴进去,选择代码语言种类,自动生成高亮效果,然后将相应的代码在html模式下,贴到文章里面就ok了。

对了,我使用的在线代码高亮来自于大前端的前段工具箱,感兴趣的可以试试;还有一个代码发芽网也可以实现类似的功能。下面贴一段css代码高亮效果,给大家瞧瞧吧。

<header id="header">
<hgroup>
<h1><a href="<?php bloginfo('url'); ?>" title="<?php bloginfo('name'); ?>">
<?php bloginfo('name'); ?></a></h1>
<h2><?php bloginfo('description'); ?></h2>
</hgroup>
<!--上面两行,分别设置了网站的大标题以及网站的描述-->
<nav id="mainmenu">
<?php wp_nav_menu(); ?>
</nav>
<!--上面这句代码是设置导航菜单的-->
</header>

高亮效果还是很不错的吧?我现在已经把以前所有文章中的代码都用前段工具箱改写过了,如果有显示不正确的,欢迎给我提出来。

回复

  1. 分文网 的头像

    我还用的插件 要改起来 太麻烦了啊

    1. 啄木游弋 的头像
      啄木游弋

      @分文网: 哦,我主要是文章里涉及的代码不多,一个小时就让我全都改过来了。

  2. 豆腐面 的头像

    这样很棒啊,虽然没有行标,但是毕竟咱又不搞大段的长篇的代码,再说这样复制起来也很方便。
    以前貌似也搞过,也是不起作用,后来干脆自己加颜色,反正区分开了就成。

    1. 啄木游弋 的头像
      啄木游弋

      @豆腐面: 恩,我就是这样考虑的,咱毕竟不是专业技术博客,虽然有代码,但也是一小部分而已。但完全不加颜色,又对不起观众。

  3. 阿越 的头像

    非插件好,插件多了臃肿

    1. 啄木游弋 的头像
      啄木游弋

      @阿越: 恩,观点和我完全一致,哈哈

  4. Kayo 的头像

    嘻嘻,之前我就一直用豆芽网的代码高亮功能,真的挺不错,只是直接插入一大段的html到文章中去感觉有点乱,后来就换成插件了!

    1. 啄木游弋 的头像
      啄木游弋

      @Kayo: 恩,在后台看着乱,不过前台看着还是挺不错的哟。插件那玩意,搞掉一个是一个。

  5. Uncle.E 的头像

    我和一楼同感…从来用不到写··代码…

  6. 睡着的水 的头像

    哈哈,生活博客没有代码控啊

    1. 啄木游弋 的头像
      啄木游弋

      @睡着的水: 是的,但就怕遇到我这种伪技术宅,不懂装懂的瞎折腾,所以代码高亮还是有必要的。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

You may also enjoy…