免插件实现wordpress 代码高亮显示 并添加文本编辑器按钮

最近在更新ripro主题美化教程,经常会用到代码高亮,但是 WordPress 本身代码高亮功用并友好。

今天蓝米兔就给大家分享一个免插件完成代码高亮显现的办法。

简介:
Prismjs 就能够让我们的 wordpress 不用装插件就完成代码高亮的功用,Prismjs 是一个特地做代码高亮的开源项目,他的代码特性是精约、轻盈、快捷、高效、快速,而且支持 127 种程序言语的代码高亮。

最主要的是 Prismjs 只需一个 JS 文件和一个 CSS 文件。运用 Prismjs 来完成代码高亮的时分,只需下载该文件放到网站,然后将这两个文件引进到页面上就能够了。

下面介绍 WordPress 实现代码高亮的办法:

  1. 首先下载 prism 压缩包上传至主题根目录(本文底部有下载);
  2. 在主题 function.php 文件最后面添加以下代码即可。

    //Wordpress免插件实现代码高亮
    //Prism.js开始
     function add_prism() {
            wp_register_style(
                'prismCSS',
                get_stylesheet_directory_uri() . '/prism/prism.css' //自定义路径
             );
              wp_register_script(
                'prismJS',
                get_stylesheet_directory_uri() . '/prism/prism.js' //自定义路径
             );
            wp_enqueue_style('prismCSS');
            wp_enqueue_script('prismJS');
        }
    add_action('wp_enqueue_scripts', 'add_prism');
    //Prism.js结束
    //编辑器添加快捷键
    function appthemes_add_quicktags() {
    ?>
    
    
    function convert_pre_entities( $matches ) {
        return str_replace( $matches[1], htmlentities( $matches[1] ), $matches[0] );
    }

[dl href=’https://www.lanzoux.com/i8yfxfa
‘]prism 压缩包[/dl]

© 版权声明
THE END
喜欢就支持一下吧
点赞0赞赏
分享
评论 抢沙发

请登录后发表评论