东流西上
故在柳溪,水东有柳

Dux5.2主题给wordpress编辑器添加自动代码高亮功能 代码版 非插件 (移植begin代码高亮)

阿里云主机

功能特点

以前,在后台编辑文章并插入代码时,首先打开代码高亮显示页面,然后将代码复制到输入源代码文本框中,然后在转换设置中选择要转换的代码语言,单击转换,最后 复制和转换。 HTML代码返回到后台编辑器,切换到文本模式,并粘贴代码。 整个过程仍然很麻烦,因为有时一篇文章会被删除,会有更多的代码片段被插入,因此来回切换,复制和粘贴也更耗时。

现在,自动代码突出显示功能可以通过单击编辑器中的代码突出代码高亮图标,然后将需要高亮的代码粘贴到文本框中,最后单击确定按钮来节省大量时间。

功能概述:方便,高效,自动,美观

简介

由于dux主题自带的代码高亮不自动换行,使用起来没begin的舒爽。所以我果断移植了下!

修改方法

  • 删除自带代码高亮js。位置:主题-js-libs文件夹 ,删除”prettyprint.js”。
  • 将\js\main.js 和 \css\main.css 中关于 prettyprint 的相关内容注释掉或删除。
  • 将 js\loader.js 中 注释掉prettyprint内容或删除。

善用Ctrl+F 关键词 “prettyprint”

  • 下载代码高亮文件包,code.zip,上传至主题目录,并解压。

链接:https://pan.baidu.com/s/1hlxN-RS4Ws08qV32Sm2cIg

提取码:p3js

 

  • 在主题js中新建一个 prettify.js 。

将以下内容复制粘贴进去 或 下载 直接丢到js文件夹中

链接:https://pan.baidu.com/s/1elB7oFTHl0-gPfe33e1ADw

提取码:w0bp

  • 在主题css中新建一个 prettify.css 。将以下内容复制粘贴进去 或 下载 直接丢到css文件夹中

链接:https://pan.baidu.com/s/1OMzQvL4-A1Y1hBHVZ7LphQ

提取码:44al

  • 最后在dux主题functions-theme.php文件中添加以下代码(其他主题在functions.php中加)
// 添加代码高亮require get_template_directory() . '/code/code-button.php';

好了,打开后台强制刷新下缓存,看有没有成功吧!!!

 

如果在网站最上面出现  Warning: Use of undefined constant version – assumed ‘version’ (this will throw an Error in a future version of PHP) in wordpress\wp-content\themes\dux\code\code-button.php on line 34 和33 的代码,问了初缘大佬,这个是PHP版本不同函数用法不同造成的,到dux\code\code-button.php 修改一下,(第34和33行)将 version 改成 ‘version’

转至 https://cvps.top/9140.html

赞(0) 打赏
转载请注明出处:水东柳博客 » Dux5.2主题给wordpress编辑器添加自动代码高亮功能 代码版 非插件 (移植begin代码高亮)
分享到: 更多 (0)

评论 抢沙发

7 + 6 =
  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏