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

免插件实现wordpress 代码高亮显示 并添加文本编辑器按钮-99资源网
免插件实现wordpress 代码高亮显示 并添加文本编辑器按钮
此内容为付费资源,请付费后查看
3
您当前未登录!建议登陆后购买,可保存购买订单
付费资源
已售 32

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

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

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

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

我们来看方法:

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] );
    }
© 版权声明
THE END
喜欢就支持一下吧
点赞0
分享
评论 抢沙发

请登录后发表评论