WordPress很多站长博客都是技术性的,这也代表了大家都会分享一些代码教程,如果你也是技术性的WordPress站点那么拥有WordPress代码高亮是必须的了,而今天呢咱们要说的就是WordPress代码高亮集成问题,为什么说集成WordPress代码高亮?因为众多小伙伴都采用插件,我们瑞课呢一直不推荐大量使用插件,所以今天的WordPress教程也是代码版的代码高亮。
Prism.js这个轻量级的JavaScript代码高亮很好耍!Prism.JS也大部分流行的编程语言,并且支持多种主题样式,只需要引用CSS文件和JS文件即可完成。

WordPress代码高亮

1、首先前往prismjs.com去下载js并一并下载你想要的样式css文件,复制到你的主题下面的css和js目录下面。
2、在你主题目录下找到functions.php文件。在文件的恰当位置(一般是末尾)加入一下代码


function add_prism() {
//To register the prism.css
wp_register_style( 
'prismCSS', //Handle name to register and enqueue prism.css
get_stylesheet_directory_uri() . '/css/prism.css' // location of the prism.css file
);
// Register prism.js file
wp_register_script( 
  'prismJS', //Handle name to register and enqueue prism.js
get_stylesheet_directory_uri() . '/js/prism.js' // location of the prism.js file
);
// Enqueue the registered style and script files
wp_enqueue_style('prismCSS');
wp_enqueue_script('prismJS');
}
add_action('wp_enqueue_scripts', 'add_prism');

这样就集成了WordPress代码高亮显示功能,当然了瑞课并没有做代码高亮功能,只是为了减少不比的JS等等,如果您喜欢我们这样的WordPress代码高亮方式,也可以模仿我们哟。

瑞课支付