syntaxhighlighter 是一个高亮代码的好工具,我没有使用 wordpress 中的插件,而是自己去集成了它,不过每次都加载,是很慢的,于是就希望其能动态加载,官方在3.0版本里提供了动态加载的方法(autoloader 方法),不过也是在预先加载两个核心 JS 的情况下才能实现的,这样的减肥方法不太吸引人,于是在网上寻找方法,看到下面文章:在WordPress指定页面加载指定JavaScript或CSS代码 文章中提到使用自定义字段的方法来动态加载 css 或者 js,这就是一个可以利用的地方,打造开始: 首先,在主题的 function.php 下添加如下函数,函数的作用是根据传递的参数来加载不同文件。其中的 $type 参数,可以是自己需要的字段,比如”cpp",“php"等,我仅仅需要以下的几个,如果您想添加更多,仿照即可, shCore_all.css 是合并了 shCore.css 和 shThemeDefault.css 后的文件,您可以选择不合并,那么就需要加载两个 css 文件。 function loadCodeHighter($type) { $current_path = get_option(‘siteurl’) .’/wp-content/themes/nopride/syntaxhighlighter/’; ?> <link type="text/css" rel="stylesheet" href="<?php echo $current_path; ?>styles/shCore_all.css" /> <script type="text/javascript" src="<?php echo $current_path; ?>scripts/shCore.js"></script> <?php if ($type == "cpp") {?> <script type="text/javascript" src="<?php
more…
代码的高亮一直来都是个问题,很多东西只能凑和着来,就像本文要说的 syntaxhighter 一样,解析真的好慢呀,不过高亮效果却是不错的。 在ckeditor for wordpress 的基础上添加 syntaxhighter 按钮支持,以方便添加代码,这个可不能少。修改步骤如下: SyntaxHighlighter Plugin 插件,此 ckeditor 插件是由 Lajox 写的,项目地址:http://code.google.com/p/lajox/,下载 SyntaxHighlighter Plugin 即可,之后解压至 ckeditor for wordpress 插件目录下的 plugins 目录。 修改 ckeditor for wordpress 插件目录下 ckeditor.config.js 文件,首先在 config.toolbar_WordpressFull 字段下添加 syntaxhighlight 按钮,然后在下面调用插件,完整的 ckeditor.config.js 是类似于下面片断的: 在 wordpress 后台的 ckeditor for wordpress 插件选项中,修改 Basic settings 下 Editor toolbar 为wordpress full,之后就可以在编辑的时候使用 wordpress full 工具栏了,而我们的syntaxhighlight便是在这个工具栏里面放着。至此,就完成了,粘贴代码来回切换源代码和可视窗口之间已经不会出现转义混乱的情况了,当然,有了 ckeditor 和这个按钮,应该不需要经常切换了吧。 CKEDITOR.editorConfig =
more…