您现在的位置是:首页 > 教程 > WordPress教程WordPress教程
WordPress免插件实现代码高亮的方法
毅冯2023-07-22 23:16:58WordPress教程已有人查阅
导读Prismjs允许我们的wordpress在没有插件的情况下完成代码突出显示。 Prismjs是一个致力于代码突出显示的开源项目。
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() {
?>
<script type="text/javascript">
QTags.addButton( 'codeHighlight', '代码高亮', 'n【pre class="line-numbers"】【code class="language-markup"】n HTML代码n【/code】【/pre】n' );
QTags.addButton( 'php', 'php', 'n【pre class="line-numbers"】【code class="language-php"】n PHP代码n【/code】【/pre】n' );
QTags.addButton( 'python', 'Python', 'n【pre class="line-numbers"】【code class="language-python"】n Python代码n【/code】【/pre】n' );//修改此段【】为<>
</script>
<?php
}
add_action('admin_print_footer_scripts', 'appthemes_add_quicktags' );
//添加快捷键结束
//Pre标签内的HTML不转义
add_filter( 'the_content', 'pre_content_filter', 0 );
function pre_content_filter( $content ) {
return preg_replace_callback( '|【pre.*】【code.*】(.*)【/code】【/pre】|isU' , 'convert_pre_entities', $content );
}//修改此段【】为<>
function convert_pre_entities( $matches ) {
return str_replace( $matches[1], htmlentities( $matches[1] ), $matches[0] );
}
本文标签:
很赞哦! ()
相关文章
随机图文
Wordpress商城插件都有哪些,Wordpress商城插件介绍
如果你想运营一个电子商务的网站,但是你又不知道如何下手,如果你使用的网站程序是wordpress,那你就不用担心了,因为有很多的插件可以帮助你解决问题。WordPress文章怎么防右键复制代码
通过下面的JS代码,可以有效地防止别人直接复制拷贝你的文章,用frame标签引用你的文章时,会自动跳转到文章正常链接,同时禁止右键菜单。nginx中怎么优化wordpress
Nginx下WordPress运行缓慢的解决方法:wordpress运行缓慢优化的方法1. 减少插件的使用这是首要的一点。大部分人往往都没足够的代码知识,更不可能做到每个插件的代码化,故大部分wordpress后台怎么登录,wordpress后台登录方法
wordpress如何登录后台?wordpress登录后台的方法:1 进入后台管理前,您所需要的是先已经安装好了wordpress,一般安装wordpress的时候
留言与评论 (共有 条评论) |