IT博客汇
  • 首页
  • 精华
  • 技术
  • 设计
  • 资讯
  • 扯淡
  • 权利声明
  • 登录 注册

    butterfly主题实现随机访问友链,不依靠任何插件,一个函数解决

    JayHrn发表于 2023-12-19 09:35:28
    love 0

    已经好久没有更新文章了,鸽了这么久,打算写一篇关于主题的文章吧。正如大家看到,我的页脚是可以实现随机访问一个友链的,其实实现这个功能挺简单的,主要就是读取友链yml文件,将其放入map中,然后每次随机取一个出来就可以了。虽然听起来很简单,但是毕竟好多人不太了解Hexo中自带的函数,所以在实现的时候还是比较困难的,当然这个也不是我自己写的,文章最后会说到。

    接下来让我们看下实现思路。

    添加函数

    在主题下helpers中新建random.js文件,也就是themes/butterfly/scripts/helpers中新建random.js文件

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    /**
    * 随机友链
    */
    hexo.extend.filter.register('after_render:html', function (data) {
    const flinks = []
    // 获取所有友链链接
    hexo.locals.get('data').link.map(function (list) {
    list.link_list.map(function (flink) {
    flinks.push(flink.link)
    })
    })
    // 随机获取一个友链
    data += `<script>var flinks=${JSON.stringify(flinks)};function toRandomFlink(){window.open(flinks[Math.floor(Math.random()*flinks.length)]);};</script>`
    return data
    })

    使用

    使用这种东西就看自己了,只要在你想要实现友链跳转的地方添加onclick="toRandomFlink()"即可。

    这种实现方法不需要依靠任何插件以及网络获取,使用起来十分的方便,当然如果你还想实现随机访问一个什么东西,你也可以参照这种写法来实现。

    最后十分感谢Eurkon,这种写法是在他开源的博客源码上看到的,如果大家喜欢他的主题,可以给个star。如下是他的GitHub博客源码仓库。

    引用站外地址
    hexo-theme-butterfly-eurkon
    Eurkon


沪ICP备19023445号-2号
友情链接