• 欢迎访问乐趣公园网站,WordPress信息,WordPress教程,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站,欢迎加入乐趣公园 QQ群
  • Git主题现已支持PHP7版本,速度应该会提高不少,不过云落的网站本来就很快了,所以感觉不是太明显
  • 最新版Git主题已支持说说碎语功能,可像添加文章一样直接添加说说,新建说说页面即可,最后重新保存固定连接,演示地址
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏乐趣公园吧
  • 云落的淘宝店铺已经开张了哦,传送门:https://kimipet.taobao.com

WordPress代码高亮插件:WP Code Highlight

WordPress 云落 4年前 (2014-08-22) 1518次浏览 已收录 9个评论
文章目录[隐藏]

现在一个博客每个漂亮的代码高亮插件简直不好意思见人哈

Wordpress 代码高亮插件:WP Code Highlight

前言

昨天之前用的代码高亮插件出了问题,布吉岛为啥,好吧,我承认之前的插件有点复杂了,昨晚找个简单的用用,然后就发现了这个:wp code highlight,很简单嘛,用于 wordpress 的代码高亮。

使用方法

使用方法傻瓜化,只要使用 wordpress 自带的

HTML
<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
 </head>
 <body>
  
 </body>
</html>

CSS

/*隐藏下拉箭头并在鼠标移动到上方显示*/
toolbarbutton:not([class*="tabs-alltabs-button"]) dropmarker {display: none !important;}
toolbarbutton:not([type="menu"]):hover dropmarker {display: -moz-box !important;}
toolbarbutton[type="menu"]:not([class*="bookmark-item"]) image {margin: 0px !important;}
.lzl_edui_dialog_container{left: 20px;}

javascript

// ==UserScript==
// @name        Mouseover Popup Image Viewer
// @namespace   http://w9p.co/userscripts/
// @description Shows larger version of thumbnails. Also supports HTML5 video.
// @version     2014.8.6
// @author      kuehlschrank
// @homepage    http://w9p.co/userscripts/mpiv/
// @icon        https://s3.amazonaws.com/uso_ss/icon/109262/large.png
// @include     http*
// @grant       GM_getValue
// @grant       GM_setValue
// @grant       GM_xmlhttpRequest
// @grant       GM_openInTab
// @grant       GM_registerMenuCommand
// @grant       GM_setClipboard
// ==/UserScript==

'use strict';

var d = document, wn = window, _ = {}, cfg = loadCfg(), imgtab = d.images.length == 1 && d.images[0].parentNode == d.body, enabled = cfg.imgtab || !imgtab, hosts;

function loadCfg() {
	return fixCfg(GM_getValue('cfg'), true);
}

自定义

Wordpress 代码高亮插件:WP Code Highlightwp code highlight 支持主题自定义,有 5 种主题,其实就是亮色和暗色而已,插件按钮和行号支持。Wordpress 代码高亮插件:WP Code Highlight

Wordpress 代码高亮插件:WP Code Highlight

Wordpress 代码高亮插件:WP Code Highlight

Wordpress 代码高亮插件:WP Code Highlight
我个人觉得吧,还是默认的亮色主题不错

相关链接

直接在后台搜索wp-code-highlight安装即可
下载地址:


乐趣公园 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:WordPress 代码高亮插件:WP Code Highlight
喜欢 (3)
云落
关于作者:
无折腾,不生活,我是一个WordPress菜鸟,一个玩淘宝的卖家,欢迎你认识我,我是云落!
发表我的评论
取消评论
表情 加粗 删除线 居中 斜体 签到

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

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(9)个小伙伴在吐槽
  1. 博主您好,用了这个代码插件却发现在文章中插入的代码中的<将自动变成<, :cry: :cry:
    小飞2014-11-26 12:15 回复 Windows 8.1 | Maxthon 浏览器4.4.1.5000
    • 云落
      嗯,原因你已经知道了吧
      云落2014-11-26 19:32 回复 Android 4.4.4 | WordPress客户端 android
  2. 不能换行是硬伤,不知道markdown写的html代码能换行不?
    FF观光团团员2014-09-01 10:42 回复 未知操作系统 | 未知浏览器
    • 云落
      这个插件吗?因为是追求简单采用这个的,如果想用强大的,Crayon Syntax Highlighter这个很强大,如果不想用插件的话,prismjs也很好,MD我不怎么用,换行不是
      这个吗?
      无法诉说的吟荡2014-09-01 11:57 回复 未知操作系统 | 未知浏览器