如何不需要使用插件就可以实现WordPress代码高亮功能

很多WordPress站长都需要。在博客搭建的过程中,经常需要对代码进行备份,并且有用的代码还要收藏。

这个时候就十分需要代码高亮,能够让我们贴出的代码美观易于阅读。

实现WordPress代码高亮的方法有很多,插件比较麻烦,代码高亮的插件,要不很简单,要不就是看着非常强大但是复杂设置,或者需要注入很多代码。比较麻烦。

但是再强大无非也就是代码高亮而已,遇见那些不经常贴代码的博主来说,那什么样的办法能够既方便又小巧还利于用户体验呢?

可以通过非插件WordPress代码高亮的实现,代码集成。

CodeRender

通过这个小工具让主题加载一段css后,通过CodeRender生成出来的代码,贴进WordPress博客后就能够立马显示出美观的样子出来,例如:

如何不需要使用插件就可以实现WordPress代码高亮功能1技术教程主机格调

目前CodeRender输出的样式类有很多,我们就拿最原始的css给大家,具体css的美化,大家可以自行修改。下载地址在文末。

下载文件后,解压得到highlightx.css文件,将其文件放到WordPress主题的根目录下,然后进行其css文件的调用;

打开WordPress主题文件夹下的header.php文件夹,在</head>前面加入

<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/highlight.css" />

保存即可。

也可将highlightx.css文件里的所有内容复制粘贴到你们WordPress主题的style.css文件的最下面。

设置完成后,后台就支持CodeRender输出内容的样式显示了。

下面提供个工具页面,能够直接输出代码。

http://www.2zzt.com/gl/

通过这个工具,即可直接将代码转换为div的内容

如何不需要使用插件就可以实现WordPress代码高亮功能3技术教程主机格调

将我们的代码复制进【输入源代码】后,选择代码的语言,这里支持的语言有:java/xml/sql/jscript/css/cpp/c#/python/vb/perl/php/ruby/delphi

然后点击转换,得出的html代码即为我们要复制贴进wordpress文章编辑里的,当然复制的时候,wordpress使用文本模式。

到这里本教程应该全部结束了。

但是还有个致命的问题发生,就是我们放进去的代码会被Wordpress自动把半角符号替换为全角,这样带来的问题就是,别人复制你的代码后,无法正常使用。这个时候需要

找到functions.php,打开后在最下面贴上

//禁止代码标点转换
remove_filter('the_content', 'wptexturize');
【声明1】:如本站转载别的站的文章,我个人没有添加来源,您可以发电邮:admin#zhuji.gd 提醒我,我会尽快添加文章来源。 【声明2】:本博客不参与任何交易及中介服务,只记录 VPS 测评和优惠,内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客,即表示您已经知晓并接受了此声明通告。
(0)
上一篇 29/03/2019 15:02
下一篇 30/03/2019 13:12

相关推荐

  • 通过给WordPress文章添加3篇假的页码导航实现相关文章

    网站跳出率(Bounce Rate)指某个时间段内,只浏览了一页即离开网站的访问次数占总访问次数的比例。跳出率是评价一个网站性能的重要指标,跳出率高,说明网站用户体验做得不好,用户进去就跳出去了,反之如果跳出率较低,说明网站用户体验做得不错,用户能够找到自己需要的内容。简单来说,跳出率越低的网站,SEO 效果越好。 这篇文章的这个小功能将会非常有效地降低网站的跳出率。虽然说在文章底部加一个假的页码导航有误导用户...

    14/05/2019
    390
  • tmhhost 开学季促销 日本软银线路、洛杉矶三网cn2 gia 线路、韩国cn2 线路 季付 大流量 SSD KVM

    TMHhost 近期推出了针对学生用户的开学季促销活动,按季度付款,非常实惠。这次促销活动涉及的 VPS 套餐主要是日本软银线路、美国洛杉矶安畅机房的三网CN2 GIA线路、韩国CN2线路。所有VPS均为 KVM 架构,SSD 硬盘。 开学季促销活动机型,数量有限。需要购买请先注册账号,特价活动不允许退款。 开学季促销套餐 日本软银 KVM VPS特征:KVM,SSD,三网软银线路,200M带宽,测试IP:45.135.51.1 韩国CN2 KVM VPS特征:上行带宽3M~7...

    技术教程 03/09/2020
    370
  • WordPress插件:有字库插件美化文章标题和内容

    在运营博客的过程中,对网页进行优化设计是一项非常重要的工作。 好的页面优化设计,降低网页设计和维护的难度,同时提升效率。 Web Font 的服务在国外已经比较普及, 著名的有Google Fonts、Typekit等网站。目前国内在中文Web Font,这方面的服务还不是很完善,提供这项服务的凤毛麟角。 有字库在这方面走在了国内Web Font 的前列。针对WordPress平台搭建的网站,有字库开发专门的接口。 用户只需要通过WordPress后台安装有字...

    27/03/2019
    480
  • WordPress博客的百度快照怎么快速更新?

    我们的WordPress博客在大改版后,需要主动给搜索引擎提交,告诉它“我改版了,快来重新收录”。 对于不懂更新和删除百度快照人可能还有很多,今天给大家分享一下百度快照怎么快速删除? 一、什么是百度快照? 每个被收录的网页,在百度上都存有一个纯文本的备份,这个就被成为“百度快照”。 简单的说就是搜索引擎在收录网页的时候对每个网页都进行了备份存在自己的服务器上,所以百度快照的备份内容会和页面当前内容有出入。 互联网...

    25/03/2019
    690
  • 向日葵远程控制软件绿色版SunloginClient 9.8.3下载,免登录无广告

    向日葵远程控制软件现在很多上班族都在用,向日葵是一种可以用来远程控制电脑手机的远程控制软件。我记得之前官方有一个10周年版本 SunloginClient 9.8.3,绿色无广告,官方直出,不过现在已经下架,手里正好有一个安装包,分享一下。这个版本体积小,免登陆,、无广告,官方原版,可以完整版安装使用,也可以绿色版直接使用。 远程传送文件,被控端安装为向日葵完整版,主控端就可以通过拖放文件发送了。 向日葵 SunloginClien...

    04/08/2023
    3930
  • 使用 HE Tun­nel Bro­ker 的 IPv6 隧道免费给 IPv4 VPS添加公网 IPv6 地址

    有些 VPS 商家没有提供  IPv6 地址,如果有访问 IPv6  的需求,可以使用 HE(Hurricane Electric)的 Tun­nel Bro­ker  IPv6 隧道免费给 IPv4 VPS 主机添加一个公网 IPv6 地址。 创建 Tunnel Broker IPv6 隧道 注册 Tunnel Broker 账号 点击左侧的 Create Regular Tunnel (创建常规隧道) 输入 VPS 的公网 IP 地址 根据 VPS 的位置选择一个节点 点击Create Tunnel(创建隧道) Tunnel Details 页面,Client IPv6 Address就是是申请...

    技术教程 03/08/2021
    7.9K0
  • Uptime Robot 源码搭建 VPS 和网站在线监控工具,宕机推送短信/邮件。

    Uptime Robot 是国外知名的服务器及网站应用服务器在线率监控工具,支持监控 HTTPs 、Ping 、端口、关键词以及查看监控 服务器/网站 的正常运行时间、停机时间和响应时间。Uptime Robot 每 5 分钟检查一次,最大可以监控50个服务器和网站应用,并且在服务器及网站宕机的时候,支持短信,邮件, Twitter , Telegram等通知方式。  Uptime Robot 官网 Uptime Robot 官网  Uptime Robot 安装教程 1、Uptime Robot 选择 Free Plan ...

    16/04/2022
    2.5K0
  • WordPress代码实现自动为文章中的图片添加alt、title属性

    很多WordPress站长都不知道图片的alt、title属性对网站搜索引擎的SEO优化有非常大的作用。所以很多童鞋的文章都没设置这两个属性, 当知道会影响WordPress网站的SEO时,这个时候发现写的文章太多,只能一篇一篇的进行修改。 那么有没有什么简单易行的方法能够快速的添加为文章图片添加alt、title属性。 其实这个问题的解决办法非常简单,可以利用WordPress钩子,当WordPress在加载文章内容时,使用正则替换掉。 [ad] 可以使用Wo...

    技术教程 05/04/2019
    10.7K0
  • WordPress插件:Add-Document-Pages为你的网站增加一个文档页面

    请注意,这是一个WordPress插件,而不是WordPress主题哦! 这个WordPress插件的作用就是为你的网站增加一个文档页面,这个页面可以用来做什么?适用于创建个文档页面,产品使用说明等等... 之所以做成插件而不是WordPress主题,是因为很多人并不需要因为一个文档页面而专门搭建一个网站,插件的形式就很方便了,不管你使用什么主题,启用这个插件后都可以创建一个文档页面,互不影响。 这个插件如何使用? 上传并启用插件,然后...

    05/03/2019
    11.5K0
  • 个人博客平台选择 Typecho 还是 WordPress ?

    建站选择合适的博客程序非常重要,涉及到网站定位、发展规划、内容建设、盈利等。现在可以网站程序之间转出转入网站内容很方便,网上教程非常多,但是无论如何转换,都会有兼容性问题;如果数据庞大,那就工作量非常非常大。 为了数据安全和 SEO 效果,在网站上线前,选择好博客程序绝对是最稳妥的方案。 Typecho 和 WordPress 没有好坏之说,其稳定性、安全性都是没有问题。但是如果网站数据量非常大,超过10万级别,Typecho ...

    技术教程 03/03/2019
    650
返回顶部