最新消息:欢迎加入小松的QQ群一起讨论一起学习,服务器快到期了,新买了台服务器,最近要做服务器迁移

基于Google Code Prettify wordpress插件WP-code-button

wordpress 1386浏览 0评论

做自己写了一个代码插件WP-code-button,一个基于 Google Code Prettify 实现的WordPress代码高亮插件,后台带代码插入功能,无须设置安装就可以使用

Google Code Prettify 是居于jquery的代码高亮插件,所以你的博客必须安装加载jquery,插件中不包含jquery

主要是之前一直用Google Code Prettify来实现代码高亮,但是有问题就是wordpress默认tinymce编辑器后台代码插入的时候会把代码的缩减都去除,如果代码有多行那样看起来就不是很直观,现在开发WP-code-button wordpress插件来解决这个问题

目前版本0.1 官方插件下载
或者在wordpress 后台插件处搜索“WP-code-button”

github链接: https://github.com/QiuCarson/wp-code-button

更新日志

V 0.4
添加代码换行样式,如果没有jquery就添加jqeruy

V 0.3

1、修改样式

V 0.2

1、修改js底部加载
V 0.1

1、解决基于 Google Code Prettify 实现的WordPress代码高亮插件,后台带代码插入功能

①后台

插件安装好之后后台wordpress默认tinymce编辑器会出现代码插入按钮

tinymce编辑器代码插入按钮

单击之后弹出WP-code-button代码插入界面

WP-code-button代码插入界面

②前台

代码高亮插件WP-code-button前天样式

插件中Google Code Prettify的css插入到wp_head里,js插入到wp_footer,以我的小松博客为例,代码截图如下

WP-code-button css前台代码插入 WP-code-button js前台代码插入

QQ交流群:136351212

如无特别说明,本站文章皆为原创,若要转载,务必请注明以下原文信息:
转载保留版权:小松博客» 基于Google Code Prettify wordpress插件WP-code-button
本文链接地址:https://www.phpsong.com/1645.html

发表我的评论
取消评论
表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
木有头像就木有JJ!点这里按步骤申请Gravatar头像吧!

网友最新评论 (4)

加载中,请稍候...
  1. 这个看起来很棒,只是之前用别的插件插入的代码咋整
    小左1年前 (2015-12-17)回复
    • 只要是pre标签就行
      小松1年前 (2015-12-17)回复
  2. 这个很不错! 我拿走了!
    灰常记忆1年前 (2016-02-29)回复
  3. 我之前也开发过类似的,不过是那种更简单的,只在文本里面的
    云落1年前 (2016-03-10)回复