Wordpress 代码高亮显示插件 Enlighter的使用

最新推荐文章于 2024-05-29 10:18:16 发布
最新推荐文章于 2024-05-29 10:18:16 发布
阅读量2.4k 收藏
点赞数
分类专栏： Wordpress 文章标签： Enlighter 代码 高亮显示 Wordpress 插件
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/leon_zeng0/article/details/105903129
版权
在WordPress中，为了提升代码展示的可读性和美观性，可以使用Enlighter插件。本文介绍了如何在WordPress后台安装和配置Enlighter，以及在默认编辑器和Elementor中使用它的步骤。在默认编辑器中，通过插入Sourcecode并选择语言即可高亮代码，但在Elementor中使用Enlighter可能导致代码显示为一行，解决方案尚未找到。
摘要由CSDN通过智能技术生成

不管是普通的Wordpress用户还是专业的开发者，许多人都喜欢将自己的用过代码记录在博客中，但是众所周知WordPress自身的代码功能非常简陋的，甚至没有高亮效果，难以阅读，如果你想要展示漂亮的代码效果，必须安装一款合适的代码高亮插件。

这个代码高亮插件的名字是enlighter， 网站是：https://enlighterjs.org/

先看效果如下：

安装

在wordpress 的面板里，插件(Plugins)->新增(Add New)，然后在搜索里输入enlighter 

选择安装(Install Now)并激活(Active)。 

设置

安装完后，就可以在wordpress的仪表盘左边栏看到enlighter了，你可以设置一下。

测试使用

下面我们就来添加这个插件看看，我在本机安装了Astra 主题，和Elementor插件，但我可能不熟悉Elementor，在elementor编辑里总是弄不好。

后来我在Wordpress 的

最低0.47元/天 解锁文章
leon_zeng0
关注
专栏目录
WordPress代码高亮插件CodeColorer正确使用方法
梁大叔的博客
10-25 3089
最近准备做一个建站技术交流站，说到技术，当然不能只靠说的，还得贴代码才能使人立马明白不是？至少复制粘贴就能用那当然是最好的了。也并不是代码贴出来就有人用，至少要保证美观度，格式什么的都要弄好，不然就像是一个text文件，格式一团乱，谁知道你的对不对？ 为了找一个高亮插件还真是花了不少时间，有人说找起来很容易啊？百度搜一下一大把，当然，我承认是这样，但是搜出来的东西要能用才好吧，不能用的或者是不满...
WordPress代码高亮插件CodeColorer汉化升级版
05-11
写在前面 用WordPress以来，本站一直是用CodeColorer来实现代码高亮，但原版的汉化不够完全，且与不少主题都冲突，因此本人将原版修改过后使用，并加入了可视化代码插入功能，之前也想发布出来，但因为懒，一直推迟到现在，既然大家希望我提供下载，因此我把它打包出来提供给大家。 CodeColorer CodeColorer是一款基于GeSHi库的WordPress代码语法高亮插件。功能简单，使用方便，是一款比较轻量的插件。CodeColorer支持[cc lang="lang"]code[/cc]和code两种语法。 属性说明 属性列表如下,括号内是参数类型.string是字符串；integer是整数；boolean是布尔型(开关)，可接受“true” “false”, “on” “off”, 整数 1 or 0. lang (string) – 代码使用的语言。 tab_size (integer) – 用以替换制表符的空格数，可在设置界面更改。 line_numbers (boolean) – 是否显示行号，可在设置界面更改。 first_line (integer) – 指定代码块第一行的行号 highlight (string) – 用于指定整行高亮的代码行行数，参数是用半角逗号分隔的数字串(如 1,5,8,9)。 no_links (boolean) – 当值为false时，关键字将会添加一个到官方文档的链接，可在设置界面更改。 lines (integer) –指定代码块显示的行数，当值设置为-1时，不出现纵向滚动条，可在设置界面更改。 width (integer or string) – 代码块宽度，可在设置界面更改。 height (integer or string) – 代码块高度，当这个高度可显示的行数比lines指定的值大才会生效，可在设置界面更改。 rss_width (integer or string) – 代码块在RSS输出时的宽度，可在设置界面更改。 theme (string) – 代码块颜色风格 (default, blackboard, dawn, mac-classic, twitlight, vibrant)，可在设置界面更改。 inline (boolean) – 内嵌模式开关，用于将一行代码插入到文本中。 strict (boolean) – 严格模式的开关。 nowrap (boolean) – 当值指定为false时，过长的行将会被自动换行，以避免出现横向滚动条。 noborder (boolean) – 是否显示边框的开关。 no_cc (boolean) – 当值为true时，code标签将会被解析，但代码块不会有格式。 class (string) – 添加一个新的CSS。 escaped (string) – 当值为false，代码块里的html转义字符不会被转义，如<不会转义为<，默认为false。 What's New? 添加可视化代码插入按钮并汉化界面； 可视化代码插入界面添加Java，CSS两种语言； 兼容官方主题及各种自定义主题； 修复不自动换行时行号显示不正确的问题； 优化高亮代码显示方式，放弃Table布局，改用Div+CSS，兼容多种浏览器乃至IE6； 添加代码工具栏，实现一键复制等功能，同样兼容多种浏览器。 等待你们去发现…… 我的博客： http://lanfei.sinaapp.com/ http://blog.csdn.net/CooLanfei 欢迎访问交流。
WordPress自动代码高亮
超超不会飞
10-20 1154
WordPress 自带的代码块是没有代码高亮的，我们可以通过安装插件，设置代码高亮。 因为都是使用 Markdown 写博客，再用 MWeb 发布到博客上，Enlighter 这种需要依赖谷腾堡编辑器插入额外模块的插件，就不太适合我了，虽然这个插件很强大，有兴趣的朋友可以尝试下。 我只能选择自动美化谷腾堡代码块的插件，我找到了 Code Prettify 这个简单的插件，直接安装，不...
插件显示缩进_代码高亮插件Enlighter跟首行缩进代码的冲突
weixin_39958112的博客
01-15 347
这两天把在后台安装了代码高亮的插件——Enlighter，本来是想用代码来实现的，但又懒了点，还是直接采用插件操作吧。毕竟WordPress上插件还是非常成熟的操作了，不用再一个个自己研究那么辛苦。但是启用之后，却发现有些时候OK，有些时候却出现异常，并没有自动高亮代码，初步检查后，发现原来跟前两天加上去的首行缩进2字符代码有所冲突。问题找到后，也针对性做了解决，也简单记录下，方便以后学习。Enl...
enlighter汉化中文版
02-23
enlighter汉化中文版，Enlighter，全名是Enlighter - Customizable Syntax Highlighter。支持各种自定义和各种脚本的专属添加形式，而且也有代码行数和自定义CSS样式，总之功能很强大。
EnlighterJS:用纯JavaScript编写的开源语法荧光笔
05-02
| | | 启蒙者JS3 EnlighterJS，使用纯JavaScript编写的开源语法荧光笔 使用它就像在网站上添加单个脚本和样式，选择要突出显示的元素一样简单，其余的工作由EnlighterJS负责。 有关的 的官方EnlighterJS插件| 的EnlighterJS-TinyMCE视觉编辑器的官方EnlighterJS插件| 资料库 EnlighterJS for Gutenberg Editor -WordPress Gutenberg Editor的官方EnlighterJS插件| 资料库 特征 主要特征 专为在所有现代浏览器（而非服务器端）上使用而设计 封装的独立库-零依赖（没有MooTools，没有jQuery！） 支持40种语言/格式 12个高质量主题 内联语法突出显示 在选项卡窗格中显示多个代码块的代码组 指出特殊的代码行 超小尺寸： 45KB JS （所有语
强推WordPress里的一款代码高亮插件——EnlighterJS
weixin_30600197的博客
07-24 666
之前下了网上很红的Crayon Syntax Highlighter，结果按照它教程，愣是连它的开启标志<>都没找到 然后又下了fv code highlighter，这个是在首尾添加代码来完成高亮的，一开始还行，后来就出现了一些乱码 最后就是下了这一款——EnlighterJS，安装好就在详情页有一个视频教程 第一，它有在WP5.2的文本编辑器出现，点击加号就有一个明显的E...
WordPress高亮代码插件enlighter自定义CSS
运维密码
08-18 513
Enlighter，全名是Enlighter – Customizable Syntax Highlighter。支持各种自定义和各种脚本的专属添加形式，而且也有代码行数和自定义CSS样式，总之功能很强大。最新版4.3.1效果如图。 插件适配CSS 在wordpress主题自定义选项中，找到插入CSS代码的地方，把如下代码放入即可。 .enlighter::-webkit-s...
让代码更清晰：如何为WordPress文章添加CodeColorer代码高亮功能
winkexin的博客
07-19 567
一直想找一款能在 WordPress 中实现代码高亮的插件，在昨天经过测试，发现 CodeColorer 可以满足我的日常需要。CodeColorer 是一个开源免费的 WordPress 代码高亮插件，它允许您将代码段插入到具有良好语法高亮显示的帖子中。CodeColorer 基于 GeSHi 库的插件，支持大多数语言。
wordpress代码高亮插件
05-06
wordpress代码高亮插件 将下面这段代码放在Header中，自动为pre添加prettyprint linenums属性。 <!--代码高亮显示自动为pre添加属性--> <script type="text/javascript"> jQuery(document).ready(function () { jQuery("pre").addClass("prettyprint linenums"); prettyPrint(); }); </script>
WordPress代码高亮插件CodeColorer修改版
01-12
WordPress代码高亮插件CodeColorer修改版。虽然我很愿意把它介绍给大家，但是这款插件好久没有升级了，已经不兼容WordPress 3.3之后的版本了。这里我就直接放出我修改后的版本吧，喜欢的就下载使用吧。
WordPress代码高亮插件(CrayonSyntaxHighlighter)v2.7.2
07-30
crayon-syntax-highlighter 是一个 WordPress 代码...Crayon Syntax Highlighter这个功能全面、使用方便的代码高亮显示插件， 不仅能帮你高亮显示php, java, asp, python等各种代码， 而且在wordpress文件编辑器里直
WordPress代码高亮插件(Crayon Syntax Highlighter) v1.1.rar
07-10
Crayon Syntax Highlighter这个功能全面、使用方便的代码高亮显示插件， 不仅能帮你高亮显示php, java, asp, python等各种代码， 而且在wordpress文件编辑器里直接就有一个按钮可以很方便的帮助你插入代码。
EasyCode插件使用详解
热门推荐
哈
04-09 5万+
简介 EasyCode是idea的一个插件，可以采用图形化的方式对数据的表生成entity,controller,service,dao,mapper……无 需任何编码，简单而强大。 Intellij安装EasyCode插件： 首先点击 File->Settings->Plugins，然后搜索 EasyCode，点击安装： 采用EasyCode生成代码时，最好配合Lombok插件一起...
无冲突的为您的WP网站引入代码高亮-多风格、多功能、多语言支持
weixin_49615086的博客
06-25 402
大部分技术型博客都有使用代码高亮，以便于访客能过更好的看清所写的代码，但往往很多时候，所使用的代码高亮插件总是与主题、插件冲突，本站之前也使用过代码高亮插件，发现其在前端的编辑器上不兼容，会报错。因此，寻觅之下，发现了prism.js这个代码高亮的实现方法。 本期将在WordPress实现该操作，需要实现的功能为：在需要代码高亮的时候，它亮，不需要的时候不加载。 /prism.js本身支持多平台，并不局限与WordPress，理论上...
【WP|5】WordPress 插件开发详解
最新发布
颜淡慕潇
05-29 1万+
插件通常需要在 WordPress 管理后台添加自定义菜单。20'Submenu',在插件中创建自定义数据库表，用于存储插件特定的数据。以下示例展示了如何在插件激活时创建数据库表。;通过本文的详细讲解，你已经了解了从基础到高级的 WordPress 插件开发技巧。掌握这些技能，可以让你开发出功能强大、性能优越且安全性高的插件，为你的 WordPress 网站增色不少。希望这篇文章能为你的插件开发之路提供帮助和启发。
12款最佳的 WordPress 语法高亮插件推荐
weixin_34409741的博客
04-11 338
　　语法高亮工具增强了代码的可读性，美化了代码，让程序员更容易维护。语法高亮提供各种方式由以提高可读性和文本语境，尤其是对于其中可以结束跨越多个页面的代码，以及让开发者自己的程序中查找错误。在这篇文章中，我们选择了12款最佳的 WordPress 语法高亮插件分享给大家，这将有助于你管理，美化和突出你的代码。 您可能感兴趣的相关文章 10大流行的 Metro UI 风格 Bootstr...
WordPress CoolCode插件：代码高亮与下载
"本文主要介绍了WordPress插件CoolCode的使用方法和特点，它是一个基于Chroder.com的WordPress Code Highlight插件改进而来的代码高亮显示工具。" **WordPress插件CoolCode概述** CoolCode是一款专为WordPress博客...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值