WordPress免插件实现代码高亮显示

tengxunyun cera

WordPress技术博客经常会分享一些代码,但是WordPress自身代码高亮功能并不好。前面里维斯社分享了2019年10个最新的WordPress代码高亮插件,今天就分享一个免插件实现代码高亮显示的方法。

 

Prismjs就可以让我们的wordpress不用装插件就完成代码高亮的功能,Prismjs是一个专门做代码高亮的开源项目,他的代码特点是精约、轻盈、快捷、高效、快速,而且支持127种程序语言的代码高亮。最主要的是Prismjs只需一个JS文件和一个CSS文件。使用Prismjs来完成代码高亮的时分,只需下载该文件放到网站,然后将这两个文件引进到页面上就可以了。

 

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

1、首先下载prism压缩包上传至主题根目录(底部下载);

2、然后复制以下代码添加到主题function.php文件下方即可。

  1. //Wordpress免插件实现代码高亮
  2. //Prism.js开始
  3.  function add_prism() {
  4.         wp_register_style(
  5.             ‘prismCSS’,
  6.             get_stylesheet_directory_uri() . ‘/prism/prism.css’ //自定义路径
  7.          );
  8.           wp_register_script(
  9.             ‘prismJS’,
  10.             get_stylesheet_directory_uri() . ‘/prism/prism.js’ //自定义路径
  11.          );
  12.         wp_enqueue_style(‘prismCSS’);
  13.         wp_enqueue_script(‘prismJS’);
  14.     }
  15. add_action(‘wp_enqueue_scripts’, ‘add_prism’);
  16. //Prism.js结束
  17. //编辑器添加快捷键
  18. function appthemes_add_quicktags() {
  19. ?>
  20. <script type=“text/javascript”>
  21. QTags.addButton( ‘codeHighlight’, ‘代码高亮’, ‘\n【pre class=“line-numbers”】【code class=“language-markup”】\n HTML代码\n【/code】【/pre】\n’ );
  22. QTags.addButton( ‘php’, ‘php’, ‘\n【pre class=“line-numbers”】【code class=“language-php”】\n PHP代码\n【/code】【/pre】\n’ );
  23. QTags.addButton( ‘python’, ‘Python’, ‘\n【pre class=“line-numbers”】【code class=“language-python”】\n Python代码\n【/code】【/pre】\n’ );//修改此段【】为<>
  24. </script>
  25. <?php
  26. }
  27. add_action(‘admin_print_footer_scripts’, ‘appthemes_add_quicktags’ );
  28. //添加快捷键结束
  29. //Pre标签内的HTML不转义
  30. add_filter( ‘the_content’, ‘pre_content_filter’, 0 );
  31. function pre_content_filter( $content ) {
  32.     return preg_replace_callback( ‘|【pre.*】【code.*】(.*)【/code】【/pre】|isU’ , ‘convert_pre_entities’, $content );
  33. }//修改此段【】为<>
  34. function convert_pre_entities( $matches ) {
  35.     return str_replace$matches[1], htmlentities( $matches[1] ), $matches[0] );
  36. }

 

下载地址:https://pan.baidu.com/s/1jaUsAdm3RCBqYIl4cf93ZQ 提取码: izjr

cera aliyun tengxunyun cloudiplc

相关推荐

WordPress仪表盘调用站外文章列表实现代码

很久以前一位站长问我,水煮鱼的插件开启后在仪表盘首页加载了一个他网站最新文章列表,这个功能怎么实现的呢?这个功能不太重要,并且很简单,所有我就没有及时回答他,今天有点空闲时间,将这些日子累积下来的问题给一一答复。WordPress仪表盘要显示站外信息肯定是要使用接口或者直接读网络文件的,所以在一定程度上会拖慢后台响应速度,不建议使用这东西。另外,即使你添加了一个面板显示信息,在后台顶部显示选项中仍然可以关闭。好了,下面一起来看看WordPress仪表盘调用站外文章列表实现代码方法。 WordPress仪表盘调用站外文章列表实现代码 要在WordPress运行中插入我们自己的逻辑,必不可少的需要使用到钩子,将我们的自定义逻辑挂载起来。我们需要用到的是wp_dashboard_setup这个钩子,官方对它的描述是,用于添加或者删除WordPress仪表板的相关选项。当然仅仅有这个钩子还不行,我们需要添加小工具到仪表盘,所以还需要借助wp_add_dashboard_widget()这个函数。 实现代码如下,将下面代码加入到主题的functions.php中后,打开后台仪表盘页面即可查看效果。 function dmd_add_dashboard_widgets() { wp_add_dashboard_widget(‘custom_help_widget’, ‘代码狗最新文章’, ‘custom_dashboard_dmd’); } add_action(‘wp_dashboard_setup’, ‘dmd_add_dashboard_widgets’ ); //面板内容 function custom_dashboard_dmd() { $feed = fetch_feed( ‘https://www.daimadog.com/feed’ ); if ( ! is_wp_error( $feed ) ){ echo ‘<ul>’; foreach ($feed->get_items(0,10) as $item){ echo ‘<li><a href=”<‘.$item->get_permalink().'”>’.$item->get_title().'</a></li>’; } echo ‘</ul>’; }else{ echo ‘wp_error’; } } 上面先是使用wp_dashboard_setup这个钩子挂载dmd_add_dashboard_widgets函数,用来添加小工具。在其中又使用了wp_add_dashboard_widget函数添加了一个名叫custom_dashboard_dmd的回调函数,用来处理小工具中显示的内容。在这个回调函数中,使用feed相关函数fetch_feed获取到对应站点的feed信息,然后遍历输出列表。 实现起来很简单,但是不建议使用,没乱用,除非是那种忠实粉丝,反正我是没见到过。

WordPress根据用户权限不同隐藏内容实现代码

很多个人站长建站后不知道怎么赢利,这里推荐几种简单的,挂广告、卖资源、内容付费。挂广告就不说了,卖资源也简单,内容付费就更简单了。对于WordPress来说,简单一个短代码即可完成内容付费。关于WordPress短代码前面也已经介绍过了,根据用户权限不同隐藏内容这个功能在本站也已经有所应用,具体实现看下面方法。 WordPress根据用户权限不同隐藏内容实现代码 核心代码: add_shortcode( ‘vip_only’, ‘users_read_shortcode’ );//注册短代码 function users_read_shortcode( $atts, $content = null ) { if ( is_user_logged_in() && !empty( $content ) && current_user_can( ‘read’ ) ) { return $content; } if ( !is_user_logged_in()){ return ‘未登录输出’; } if ( is_user_logged_in() && !current_user_can( ‘read’ )){ return ‘登陆但没有阅读权限输出’; } } 核心代码就这么点儿,把上面的代码复制放在你的主题functions.php文件中,在WordPress后台编辑文章,通过[vip_only]短代码来使用它,例如: [vip_only] 这里是文章中需要隐藏的内容 [/vip_only] 短代码的功能是,在加载文章前,发现短代码,就执行对应的回调方法,最后再输出。上面的代码中,我们还使用了用户权限的判断函数current_user_can,该函数可以读取当前用户是否拥有某项权利。关于用户权限,在前面的文章中已经介绍过了,不清楚就再看看。WordPress移除用户角色添加新角色并赋予角色能力/权限 注意:WordPress的用户角色都具有read读权限,我这里是新建的用户角色!大家可以根据自己的业务逻辑不同,自行决定是使用WordPress的用户角色与权限还是自定义。

Yoast SEO|WordPress SEO|优化插件推荐|帮助网站|进行SEO优化

如果你建站使用的是 #WordPress#,比如老唐就是用的 WordPress 建站,并且想要对网站进行#SEO# 优化,那么可以使用一些 WordPress SEO 优化插件。目前老唐也尝试过一些 WordPress SEO 插件,感觉比较好的还是 Yoast SEO 这个插件。设置起来比较方便,而且选项也比较多,但是如果不会设置的话默认设置也已经足够使用,所以推荐我们新手刚接触 SEO 的时候使用。 下载后在后台上传安装,或者直接在后台搜索安装也可以。 Yoast SEO 插件简单设置 其实基本上没有改什么设置,基本都用的#默认#设置。 不过有些设置可以看一下确认一下,比如搜索外观里,标题是否需要强制重写,我们可以重写为自己想要的网站标题,后期更换#主题#也不会影响。 此外,我们主要可能会修改的是搜索外观中的 SEO title 和 Meta description,包括每个文章页和每个独立页面的,一般来说默认也可以,我们有需求可以根据自己的需求进行修改。 如果有需要,我们也可以付费升级高级版,但是一般来说免费版够用了。  

大前端wordpress主题618限时6.8折促销|其中xiu主题218元|热门的dux主题544元

大前端wordpress主题提供还是有多年时间了,同时也是维护时间较长的主题商家,比如14年发布的XIU主题现在还在维护、更新之中,而更早之前的热门wordpress主机D8也是维护之中,只是维护的频率不如DUX等更加热门的主题。在2020年618来临之际,大前端推送了最新的旗下wordpress主题限时6.8折,优惠之后DUX主题544元,XIU主题218元,D8主题168元,TOB主机266元等,相对于平时来说还是比较不错的,有打算需求的用户可以关注一下。 大前端主题不限制域名个人,只要是同一注册信息下的域名均可以使用,可以满足科技博客、个人站、各类图片、摄影展示站、企业站、淘宝客和各种展示站点!目前小七博客使用的就是XIU主题,也是使用期限最长久的一款主题,期间更换几次,最终还是使用这一款,便宜、实惠,可以满足自己的个人需求。 活动地址:大前端官网 活动时间:2020年6月11日-2020年6月18日; 活动内容: 旗下公开发行的wordpress主题6.8折折扣!

微信扫一扫,分享到朋友圈

WordPress免插件实现代码高亮显示