zblog代码高亮增加支持代码一键复制功能的插件Jz52_code

zblog插件 1707

zblog ueditor编辑器前端代码高亮显示效果比较简单,常见的代码高亮窗口的代码一键复制按钮也没有,这会使访客复制长代码的时候不太方便,虽然影响不大,但是添加代码一键复制按钮也许可以提高网站的用户体验,毕竟用户体验也是SEO的一部分。

对于普通zblog用户来说,自己给代码高亮增加一键复制功能可能会比较复杂,所以使用插件会是个快捷通道。应用中心ID为“Jz52_code”的这款【代码高亮美化+代码一键复制】插件就可以实现代码一键复制功能。

这是一个小插件,支持UE编辑器和NE编辑器。主要功能是修改了ueditor编辑器默认的代码高亮显示样式,以及在右上角插入了一个复制功能的图标按钮,复制功能借助的是clipboard.min.js插件。

插件使用方法

后台应用中心搜索“Jz52_code”,然后安装应用即可,效果如下:

zblog增加代码高亮支持代码一键复制的插件Jz52_code

如果还是喜欢默认的代码高亮样式,或者想自己修改代码高亮的样式,可以修改样式文件 zb_users/plugin/Jz52_code/Jz52_code.css,效果如下:

zblog增加代码高亮支持代码一键复制的插件Jz52_code

PS:如果单纯地想要个代码一键复制功能,可以在当前使用主题中引用clipboard.min.js文件,然后参考这个插件的js代码在代码高亮的HTML节点内插件一键复制按钮,这样就可以免安装插件了。

精品推荐: