WordPress 4.5.2 安全更新

早上醒来,收到邮件博客已被自动更新至 WordPress 4.5.2,一个安全更新。

有些时候写博文会引用很多外部链接,如果这些外部链接全部放在文中感觉有些不妥,至少在美观度上就有些偏离大众审美,特别是对于一些很长又不规律的链接。而统一放到文末,可能读者一时半会看不出哪里引用了。

于是按照 Fooleap's Blog 的 JavaScript 实现参考资料功能 教程依葫芦画瓢添加了一个小功能 —— 根据文章内容在文末特定位置自动生成参考资料内容,并可相互跳转、高亮。(已去除该功能-2016.7.18

下面来个 GIF 先感受一下这个功能:

详细教程请看原文,我稍稍修改了一下,原代码只对站外链接做处理,因为我想站内标注也用此方法,所以加了个对 href = ## 的指定链接也作同样的处理,下面直接上代码。

js 代码

//自动参考资料 start
var autorefa = /^参考资料/;
var autorefb = /^标注/;
$('.single-content h3').last().each(function() { // 选取文章最后一个 h3,.single-content h3 根据主题实际修改
if ($(this).text().match(autorefa) || $(this).text().match(autorefb)) {
$(this).after('<ol id="refs"></ol>')
}
});

// 选择非本站链接 与 href="##" 的链接
$('a[href*="##"],[href*="http:"]:not([href*="' + location.hostname + '"]), [href*="https:"]:not([href*="' + location.hostname + '"])').each(function(){
// 去掉所选链接文本的最前、最后字符
var num = $(this).text().substring(1, $(this).text().length-1);
// 判断是否为数字
if(!isNaN(num) && num){
var note = 'note-' + num;
var ref = 'ref-' + num;
var noteTitle = $(this).attr('title');
var noteHref = $(this).attr('href');
$(this).attr({href: '#' + note, id: ref, 'class': 'ref anchor-fix'}).wrap('<sup>');
$('#refs').append('<li class="note"><a class="anchor-fix" href="#'+ ref + '">&and;</a> <a href="'+ noteHref + '" title="' + noteTitle + '" id="' + note +'" class="exf-text" target="_blank">' + noteTitle + '</a></li>')
}
})

var noteLinks = $('a[href^="#note"], a[href^="#ref"]');
noteLinks.click(function(){
// 清除背景颜色
noteLinks.parent().css('background-color', '');
// 高亮目标背景
var href = $(this).attr('href');
$(href).parent().css('background-color', 'rgb(235, 235, 235)');
})
//自动参考资料 end

html 代码示例

外站链接参考资料:Fooleap's Blog <a href="http://blog.fooleap.org/reference.html" title="JavaScript 实现参考资料功能 | Fooleap's Blog">[1]</a>

<h3>参考资料</h3>

-------------------- 分隔线 --------------------

标注/注释:Fooleap's Blog <a href="##" title="JavaScript 实现参考资料功能 | Fooleap's Blog">[2]</a>

<h3>标注</h3>

除非注明,垃圾站文章均为网络收集,本文地址 https://cyhour.com/379/AMP 加速版本」,转载请以链接形式注明出处。
声明:我们不销售主机,任何VPS主机均有跑路风险且需定期备份,防止数据丢失。信息以实际为准,评测仅供参考不代表权威!
🍄:Netflix 奈飞 YouTube 合租

Gravatar 头像被墙及解决方案 Gravatar 头像国内镜像地址大全

Gravatar 头像真是一言难尽,时而正常时而抽风时而无法访问……就一个 Gravatar 头像,这有啥好强(现代通假字)的呢?(据说是被其它服务连累?) 解决办法 - 调用 ssl/cn 头像链接 历史解决办法:调用 ssl 头像链接——https还是没被墙的,而且速度还不错,直接调用这个最简单了。主题 functi…
浏览: 102

Redmi Note 9 4G 刷机欧洲EU版净化去广告

虽然口水苹果十三香,但是眼下囊中确实只有红米……到手不用 1000 大洋,试试也无妨,实在不行再找银行/东哥要十三香。 入手 Redmi Note 9 4G 缘由:领导的微信机 iPhone SE 一代确实很老了(再过两个月就开始第六个年头了),没有换过电池,进过水修过一次,现在经常尿崩突然就关机了得插上…

使用 GoAccess 分析 Nginx 日志

最近发现博客加载图片大多时候都是龟速,想过换服务器,换回主机(比如传说中的外贸主机 SiteGround),图片上 CDN……想了一圈,最终什么都没动,一是穷二是懒三是图片多茄大的水文并不多,先这样吧,实在不行再折腾。倒是忍不住折腾了一下 GoAccess 分析 Nginx 日志,分析了一圈,没什么用。 记录…
浏览: 49 标签:  ,  ,  , 

WordPress 纯代码实现彩色标签云及简单优化配置

WordPress 自带标签云小工具,侧栏直接添加即可,就是默认样式有点平淡,可以加点代码实现彩色标签云及简单优化一下。 WordPress 纯代码实现彩色标签云 代码丢到 WordPress 主题 functions.php 文件即可: //彩色标签云 tag cloudfunction theme_color_cloud_hook($text) { $text = preg_rep…
浏览: 128 标签:  ,  ,  ,  , 
浏览: 149

Comments:30

  1. 讲真,整个版面越来越繁复了

    2016.05.07 21:17 # 回复
    1楼
  2. 学术性的网站更适合的感觉。

    2016.05.07 22:54 # 回复
    2楼
  3. 有阅读论文参考文献的感觉。

    2016.05.08 16:06 # 回复
    3楼
  4. 垃圾站-yyyyyyyhb
    yyyyyyyhb

    感觉注释这么玩对于个人博客来说没有必要啊,装逼倒是挺好用
    4.5.2与其说是安全更新还不如说是4.5.1的紧急挽救吧,4.5.1坑死了
    话说我早就想说了,LOGO和锐壳亚马逊广告的字体能换成雅黑吗( ▼-▼ )

    2016.05.09 00:44 # 回复
    4楼
    • @yyyyyyyhb 嗯,其实就是用来装的……
      雅黑好看?

      2016.05.09 23:16 # 回复
      • yyyyyyyhb

        @老杨 额不是雅黑好看是违和感强烈,如果你想把界面统一成别的我也不反对,因为框架的繁杂和风格的不统一我真的有一种看拼图的感觉==

        2016.05.14 00:40 # 回复
  5. 或许是你文章页面内容比较丰富,看起来感觉显乱。

    2016.05.09 13:26 # 回复
    5楼
  6. 垃圾站-CK
    CK

    收好了,有機會把此功能實現。

    2016.05.10 11:08 # 回复
    6楼
  7. 哈哈,最近都是自动更新,我也是了,这能说明对方已经能保证更新不出错的技术了,哈哈。赞一个!

    2016.05.11 00:10 # 回复
    7楼
  8. 垃圾站-夏天烤洋芋
    夏天烤洋芋

    太复杂了。就不好看了。

    2016.05.17 16:23 # 回复
    8楼
  9. 我比较反感js特效一大堆的网站

    2016.05.18 09:10 # 回复
    9楼
  10. 很久不更新了

    2016.05.18 17:46 # 回复
    10楼
  11. 我也更新了

    2016.05.21 20:55 # 回复
    11楼
  12. 越来越麻烦了

    2016.05.29 11:04 # 回复
    12楼

发表留言

Vultr 送$100,搬瓦工年付最低$49,优惠码 BWH3HYATVBJW,更多推荐VPS信息