对我们个人站长而言,我们可能会在自己的网站上记录一些代码,虽然Wordpress有插入代码的功能,但是其页面美观上有点不太敢恭维,而且还没有行号。其实实现代码高亮的Woedpress插件有很多也有很多用纯代码方法实现的,秋水也为代码高亮上寻觅了很久。
最后秋水在众多插件以及代码方法上选择了这款代码高亮插件——Pure Highlightjs,这款插件已经在Wordpress平台上无法下载了,这里可以通过第三方下载。本次分享的是经过第三方二次美化过得(原创作者已经四年没更新了),秋水只留了一个主题,其他主题全删掉了,也修改了一些CSS样式。
插件使用
关于插件的安装秋水就在这里不阐述了,因为只剩了一个主题样式,所以设置里面也不需要做什么设置。
1、对于经典编辑器,启用插件后你会在编辑器工具栏发现一个<>的图标,点击插入代码即可。
2、对于区块编辑器,你可以格式里面选择插入一个经典区块,而在编辑器工具栏上上也有<>图标,点击插入代码即可。
显示效果:
//隐藏内容登陆可见
function hide_check_shortcode($atts, $content = null)
{
if (is_user_logged_in() && !is_null($content) && !is_feed()) {
return '<div class="hide-t"><i class="fa fa-spinner" aria-hidden="true"></i>隐藏的内容</i> </div> <div class="secret-password">' . do_shortcode($content) . '</div>';
}
return '
<div style="text-align:center;border:1px dashed #FF9A9A;padding:8px;margin:10px auto;color:#FF6666;">
本文隐藏内容
<a href="https://lmqyu.cn/login">登陆</a> 后才可以浏览
</div>';
}
add_shortcode('hide', 'hide_check_shortcode');