更新 pure-highlightjs 插件,实现显示代码行号、鼠标悬浮行和被标记行高亮

博客一直用的是 Pure-Highlightjs 插件来实现代码的高亮,就是因为它可以在编辑器中可视化地插入代码,不用手动添加标签,特别方便。但是呢,不能显示行号。为了能够实现显示行号,对着 JS 熬了一天一夜总算是弄出一个比较满意的成果算是吐血之作吧 :(喷)

这个脚本有一个 Bug ,会导致“//” 注释下面的代码高亮消失,改为“/* */” 注释没问题。如果介意这个 Bug的,不要用下面的脚本来实现显示行号。博主已经改为 Prism 来实现代码高亮和显示行号,并且再次修改了插件代码,以实现适配 Prism。目前修改后的插件正在测试中,测试完毕我会更新这篇文章和 GitHub 上的插件。敬请期待!

2018-7-8 更新:v3 Prism 版已经测试完毕(使用 Prism 实现代码高亮和行号显示),该版本修复了 v2 highlightjs 版的两个 Bug。GitHub 地址:https://github.com/sunriseydy/Pure-Highlightjs/tree/Prism

v3 Prism 版下载地址:https://github.com/sunriseydy/Pure-Highlightjs/raw/Prism/Pure-Highlightjs-3.0.1.zip


插件更新项目地址:https://github.com/sunriseydy/Pure-Highlightjs

插件更新下载地址(v2 Pure-Highlightjs 版):https://github.com/sunriseydy/Pure-Highlightjs/releases

想看更多?点我点我 “更新 pure-highlightjs 插件,实现显示代码行号、鼠标悬浮行和被标记行高亮”

WordPress 首页显示文章摘要或者内容以及个性化设置”阅读更多”

WordPress 首页和归档页面显示文章的方式有两种:内容模式(the_content)和摘要模式(the_excerpt)

内容模式:如果文章设置的有“阅读更多”的标签,即“<!--more-->”,就会显示全部的文章内容,如果有“阅读更多”的标签,则只会显示“阅读标签”前的内容,并在后面添加一个“阅读更多”的链接指向文章剩下的内容。因此,如果文章内容较多的话一定要设置“阅读更多”的标签,否则加载首页的时候会耗费更多的服务器资源(亲测 :(笑尿) )。

摘要模式:只显示文章的摘要,后面跟一个“更多”标签。如果作者没有在编写某篇文章时编辑文章摘要,那么默认截取文章的的前55个字作为摘要显示出来,并添加一个“more”标签(不是“read more”,即“阅读更多”),默认显示为“[…]”。如果作者在编辑文章时编写了文章摘要,那么在首页就只会显示作者编写的摘要,默认不添加“more”标签。因此建议在编写文章的时候顺便编写文章摘要。

我个人认为,内容模式比较适合我,因为可以自定义显示的内容和长度。

下面我来说说如何设置这两种模式以及两种模式的个性化。

想看更多?点我点我 “WordPress 首页显示文章摘要或者内容以及个性化设置”阅读更多””

利用七牛云存储和 Verycloud CDN实现博客静态资源加速(HTTPS 访问)

做网站的都知道网站的一些静态资源是最影响网站的访问速度的,优化的方法一种是伪静态和缓存,一种是CDN。

关于伪静态和缓存,Wordpress 有一个很厉害的插件:“WP Super Cache”,它可以自动的帮你把动态的页面缓存为静态的 Html 。

CDN 的优化方法也有一个很出名的插件:“七牛云存储”。它利用了七牛云的对象存储和CDN加速功能,自动地将网站内的静态文件:图片,JS,CSS,视频等同步到绑定的七牛云存储上去,并把地址改为CDN加速过的地址,这样就可以利用CDN来优化博客的访问速度了。它的 HTTP 流量和云存储空间都是免费的,然而, HTTPS 流量不是免费的。这对于全站开启 HTTPS 的站点来说简直就是无法接受。

想看更多?点我点我 “利用七牛云存储和 Verycloud CDN实现博客静态资源加速(HTTPS 访问)”

给WordPress加上贴吧表情

自从看到饭大佬给博客加上了贴吧的表情后就也想弄一个,毕竟 :(滑稽) 这个表情太火了,而我之前弄的QQ表情里没有这些表情。现在终于有时间来给博客添加贴吧的表情了 :(滑稽)  :(滑稽)  :(滑稽)

饭大佬用的是 Typecho ,有一个插件可以用,而 WordPress 呢,我看了一下很多表情插件都是 N 年前更新的,都不知道适不适配最新的 4.9 版本。之前我用的是免插件修改函数的方法实现表情的,现在还用的是这种方法。方法如下(以下代码部分来自互联网,具体出处见文末) 想看更多?点我点我 “给WordPress加上贴吧表情”

冬天到了,给博客换上雪装

:(滑稽)

看到一个大佬@饭饭给他的博客加上了下雪动画,觉得挺好看的,尝试着给我的博客也加一个,方法如下:

//在网页加载 jQuery 之后添加以下代码到网页的head 标签内
<script src="https://cdn.sunriseydy.top/wp-content/uploads/2017/12/snow.js"></script>
<div class="Snow" style="position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100001;"></div>

可以将上面代码中的 “https://cdn.sunriseydy.top/wp-content/uploads/2017/12/snow.js” 和 js 文件中最后部分的 “https://cdn.sunriseydy.top/wp-content/uploads/2017/12/snow.png” 改为自己网站的链接。

用饭大佬的 js 文件在 Wordpress 上面加载 JS 时遇到了点问题:“TypeError: $ is not a function when calling jQuery function”。谷歌了一下发现这是 WordPress 加载 jQuery 的问题,需要将原来的 js 第二行中的代码修改为

 jQuery(document).ready(function($){
//原来第二行的代码
}); 

我给出的方法是已经改过的,在 Wordpress 上可以直接用。

原文链接:https://ffis.me/Diary/snow.html

自定义wordpress页脚信息(site-info),显示备案号、版权、首页等信息

一个网站备案后工信部都会让你把备案号标注到网站首页的底部,很多新手不知道咋弄,博主我最近重新修理了博客的主题,就讲一下我是如何标注备案号和其他信息的。先来一张修改后的效果图:

我设置的是显示备案号并链接至“http://www.miitbeian.gov.cn/”、链接至博客首页的博客名和一个版权说明(这个是我看很多站点都有一个这样的标识,我也就加了一个)。下面就讲一下如何修改 想看更多?点我点我 “自定义wordpress页脚信息(site-info),显示备案号、版权、首页等信息”

万网虚拟主机搭建wordpress,打开网页出现InternalServerError(500错误)终极解决办法

刚开始建博客的时候,第一次嘛,出现了一些错误,其中一个就是这个InternalServerError 500错误,就是在填写完数据库信息的下一步,打开任何网页都是这个错误,如图:

500错误

想看更多?点我点我 “万网虚拟主机搭建wordpress,打开网页出现InternalServerError(500错误)终极解决办法”