syntaxhighlighter 动态加载

Published 八月 9th, 2010 in PHP, 原创 by 勿慢牛 2

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 echo $current_path; ?>scripts/shBrushCpp.js"></script>
<?php
    } elseif ($type == "bash") { ?>
      <script type="text/javascript" src="<?php echo $current_path; ?>scripts/shBrushBash.js"></script>
<?php
    } elseif ($type == "css") { ?>
      <script type="text/javascript" src="<?php echo $current_path; ?>scripts/shBrushCss.js"></script>
<?php
    } elseif ($type == "php") { ?>
      <script type="text/javascript" src="<?php echo $current_path; ?>scripts/shBrushPhp.js"></script>
<?php
    } else { ?>
      <script type="text/javascript" src="<?php echo $current_path; ?>scripts/shBrushPlain.js"></script>
<?php }?>
    <script type="text/javascript">
    SyntaxHighlighter.all()
    </script>
	<?php
}

第二步，即是在主题的header.php文件内添加判断代码，如果当前页面是单个日志或者页面，go on，获得日志的关于"code"的自定义字段的值。如果不为空就传递给上述我们所定义的函数，函数根据字段来判断输出哪个高亮文件。这段代码可以添加在 <?php wp_header() ?> 之后，也可以在<?php wp_footer() ?> 之前，自己决定吧。

<?php if (is_single() || is_page()) {
  $code = get_post_meta($post->ID, 'code', true);
  if (!empty($code)) {
    loadCodeHighter($code);
  }
} ?>

第三步就是在撰写日志时在下面的自定域内添加名称为"code"的自定义域，值为函数内的字段，比如c++为cpp，php为php，您可以根据自己的函数定义来填写。之后我们就实现了在不同页面加载不同的高亮文件了，当然，没有自定义域”code"的文章是不加载的，因此也提高了速度。

About the Author

在讀研究生，化學/化工專業，主要關注學佛、計算化學、C++、Python、計算機、古文化、哲學、思維方向，渴求與有共同興趣的朋友交流，詳情請查看“關于”頁面。

syntaxhighlighter 动态加载

取消回复

Google广告

分类

存檔

订阅

近期评论

Klniu