记录一些常用的函数和瞎折腾的过程……

使用highlight给代码高亮

提醒:本文最后更新于 2371 天前,文中所描述的信息可能已发生改变,请谨慎使用。

代码高亮的方式很多,上次我们介绍了如何使用prism来进行高亮,这次再介绍一个代码高亮的方式,使用highlight进行代码高亮。当然了,首先你得去highlight官方网站去下载相应在js和css。

1、引用js和css:

<link rel="stylesheet" href="/path/to/styles/default.css">
<script src="/path/to/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

2、调用方式:

<pre>
  <code class="php">
    function test(){
      //code is here
    }
  </code>
</pre>

使用wordpress的话,可以添加按钮:

// 添加代码高亮按钮
function appthemes_add_quicktags(){
  if (wp_script_is('quicktags')){
 ?>
  <script>
    var aLanguage = ['html', 'css', 'javascript', 'php', 'json', 'sql', 'vim', 'nginx','shell'];
    for( var i = 0, length = aLanguage.length; i < length; i++ ) {
      QTags.addButton(aLanguage[i], aLanguage[i], '\n<pre><code class="' + aLanguage[i] + '">\n', '\n</code></pre>\n');
    }
  </script>
<?php
  }
}
add_action('admin_print_footer_scripts', 'appthemes_add_quicktags');