YoduBGM一款typecho背景音乐插件

YoduBGM 1.6.0

是一款简洁(简陋)风格的背景音乐播放器,需要主题支持pjax技术,否则页面切换歌曲会断掉。

背景音乐播放器那么多了为什么还要开发呢?而且还这么丑?
答:其他的背景音乐播放器只能支持常规的pjax模板,而Yodu模板使用的instantclick技术并没有得到支持,所以为了自己的模板能有个背景音乐播放器,我就自己弄了个。看这插件的名字就知道这个是专门为Yodu模板准备的,当然其他模板也是可以用的。

插件特色
1,这是一款简洁BGM播放器,需要您的主题支持pjax或者instantclick才能保证页面切换依旧播放
2,支持多首歌曲,且默认随机播放
3,可设置是否自动播放(部分手机浏览器不支持)
4,支持网易云音乐调用(不保证api永远有效)
5,当你按照格式只填写一首歌曲时,插件会默认隐藏掉切歌按钮,只保留播放按钮,使其更加简洁
6,插件使用了原生js,所以无需加载jq等js框架
7,整个插件所需要加载的文件不到5kb,可谓是非常小巧了

下载地址:
https://github.com/jrotty/YoduBGM

更新历史

2018年06月29日发布1.6.0版

音乐格式填写方式简化

2018年06月16日发布1.5.0版

1,字体图标文件全部写入了css里,解决特殊情况下的字体跨域问题
2,复活网易云调用功能
3,加了了歌曲数量判断,大于一首歌曲时,切歌按钮才会出来,使其更加简洁人性化
4,js梳理优化,缩减代码,解决部分bug

2018年x月x日发布x版

删除网易云音乐api功能,失效了

2017年07月10日发布0.7.0版

修正网易云音乐api获取歌单失效问题

2017年01月16日发布0.6.0版

与文章内音乐播放器兼容,当文章内有音乐播放器播放时,会自动暂停背景音乐播放器,当切换到没有音乐播放器播放的页面时背景音乐再次继续播放。【仅限使用Audio标签的播放器】

2016年12月25日发布0.5.0版

网易云解析地址全面支持https,优化了javascript代码优化完反而有毛病已改回。

2016年12月11日发布0.4.0版

博主简单学习了下javascript,去除了对jQuery的依赖。

2016年11月30日发布0.3.0版

后台加入移动端显示与否,消除插件可能存在的隐患

2016年11月14日发布0.2.0版

修复0.1.5版instantclick模式下,页面切换歌曲顺序播放变为乱序播放的问题。

2016年11月12日发布0.1.5版

加入播放按钮的交互效果

2016年11月3日首次发布0.1.2版

一款支持同时支持pjax和instantclick技术的背景音乐播放器。

插件预览:

YoduBGM背景音乐播放器插件

Comments (82)

    Generic placeholder image
    老陈 回复

    你好博主,请问这插件可不可以切换页面的时候播放不受影响?就是说从首页点文章的时候歌还是继续播放的,而不是重头再来

      Generic placeholder image
      Jrotty 回复

      需要你的模板主持pjax技术才行

    Generic placeholder image
    相随 回复

    希望下次更新能设置播放器的位置,比如:左上 右上 左下 右下 4个选项。 @(太开心)

      Generic placeholder image
      Jrotty 回复

      这个插件已经不准备弄下去了,你可以自行修改css文件,来达到想要的效果

        Generic placeholder image
        相随 回复

        好吧。那我自己随便改了。可惜不维护。
        不然我可以一直做伸手党。
        慢慢改吧,没有一次又一次的轮子哪有送代出来的好产品。 @(乖)

          Generic placeholder image
          Jrotty 回复

          yodupalyer就是在这个基础上迭代出来的 @(酷) ,就是我站现在用的

    Generic placeholder image
    embryo 回复

    我在某主题使用这个插件发现,自动播放的话点进去又开一首歌,也就是同时两首一起放。还有就是换歌的话又是两首一起放。。。
    主题是https://weic.me/themes-note/ 这个

    Generic placeholder image
    Mr.童 回复

    设置了自动播放,电脑可以,手机就是不行。。。。@(酸爽)

      Generic placeholder image
      Jrotty 回复

      手机端分浏览器,有些浏览器不允许自动播放的,有些浏览器看你是不是用wifi如果是才会自动播放

    Generic placeholder image
    Sakura 回复

    Chromium似乎并不会出声。。。?

      Generic placeholder image
      Jrotty 回复

      Chromium没试过,欧朋浏览器放不出来倒是真的

    Generic placeholder image
    易水寒 回复

    博主你的打赏是插件还是什么 @(乖) 还有你的表情怎么弄的 @(太开心)

      Generic placeholder image
      Jrotty 回复

      这些都是纯模板里写的,不是插件

    Generic placeholder image
    后宫学长 回复

    QPlayer播放器给你重写了吧? @(滑稽)
    简约的要命了,最少应该留个专辑图在那转的...
    歌单解析的那个程序要是能写入保存为js文件,前端页面引用js文件,这样看起来好看点。 @(阴险)
    我还是喜欢格式化后的代码。 @(吐舌)

      Generic placeholder image
      Jrotty 回复

      就网易歌曲解析那个直接用的qplayer里的(其实他也是用的别人的),其他的就是自己的写的哈,没考虑那么多,主要是让我的这个模板有个能支持的背景音乐插件

    Generic placeholder image
    落叶大大 回复

    网易云音乐竟然支持https了#[得瑟]

      Generic placeholder image
      Jrotty 回复

      苹果和谷歌不说2017年对http进行风险提示吗,强制https的味道

    Generic placeholder image
    奥斯特 回复

    你好我发现用你的插件后网站底部一个图标字体不显示了,停用就能显示,我想存在什么冲突,底部显示图标的页面代码是:class="icon-next-heart fa fa-heart",应该怎么怎么弄才不冲突,主题用的FontAwesome

      Generic placeholder image
      Jrotty 回复

      理论上不应该冲突吧,因为同样是引用fontawesome图标的博客的人用我的插件却没有问题啊

    Generic placeholder image
    奥斯特 回复

    为什么有的能放不出来,有的不能,我看解析的MP3后缀名又长有短,与这个有关还是其他的一些原因

      Generic placeholder image
      Jrotty 回复

      音乐外链速度不稳定吧,如果你放了多首歌曲,可能是某一首歌曲链接有问题,因为插件第一首歌曲是随机播放的