ajax不变音乐,WordPress Hermit音乐播放器插件支持Ajax防刷新不中断

Hermit音乐播放器插件支持网易云音乐,虾米音乐和本地音乐。之前有给大家推荐了WordPress插入音乐播放器(插件和非插件两种方法)一文给出了在WordPress中加入音乐播放器的方法,还有WordPress史上最简单的Ajax方法。今天介绍的是升级版的Hermit音乐播放器。(插件官网)

Hermit播放器插件

一般我是不会推荐插件的,因为插件基本都是可以用代码来代替的,但是这款插件建议喜欢音乐的朋友还是安装一下啦!

这款更新不仅样式上变得美观了不少,而且功能上也加了Ajax防刷新。这个是之前很多网友所需要的,大气有逼格。

之前虽然有给大家介绍过这款非常优秀的插件,但是这款升级版的HERMIT音乐播放器插件非常值得我再来安利给大家一次牧风大大的这款Hermit播放器插件。先来看看Hermit音乐播放器插件的效果吧!

cover@3x.png

00:00/00:00

整站Ajax的播放设置

可以在javascript中设置音乐是否打断播放,当然ajax效果是不打断播放的1。

简单的使用介绍

在撰写文章的时候,就可以点击添加音乐的按钮来输入音乐地址。输入好了,点击插入音乐即可自动完成操作,发布文章的时候也就有了音乐。

添加多个音乐,则回车空行如下图,以网易云音乐为例子:

164b9f41349c193b31f6b8b696e6b656.png

以上,喜欢音乐分享的朋友可以去试试啦!

远方的海版优化样式

如果你也想和我一样,给封面图片加上唱片旋转效果,可以参考本站的css代码:

@-webkit-keyframes rotate{

from{-webkit-transform:rotate(0deg)}

to{-webkit-transform:rotate(360deg)}

}

@-moz-keyframes rotate{

from{-moz-transform:rotate(0deg)}

to{-moz-transform:rotate(360deg)}

}

@-ms-keyframes rotate{

from{-ms-transform:rotate(0deg)}

to{-ms-transform:rotate(360deg)}

}

@-o-keyframes rotate{

from{-o-transform:rotate(0deg)}

to{-o-transform:rotate(360deg)}

}

.hermit-cover-image{

border-radius:99%;

animation: 9.8s linear 0s normal none infinite rotate;

-webkit-animation:9.8s linear 0s normal none infinite rotate;

}

把以下代码放在主题的style.css中即可,这样Hermit插件即使更新了样式也会保存下来。

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
到别人的博客中装有MP3播放器,是否感到很酷,把自己喜欢的歌曲都加入到在MP3播放器中,与访客分享,你是否有这样的想法呢?呵呵,如果你有这个想法的话,那么,就来看看今天介绍的WordPress插件吧。不得不佩服WordPress插件功能,只要能想到的功能,就会有WordPress爱好者去开发这些插件,flash-mp3-player插件也是如此,一个简单而实用MP3播放插件,不需要太多的操作。 Flash-Mp3-Player插件安装: 1.下载flash-mp3-player插件,然后上传插件到/wp-content/plugins/下的文件夹。 2.到wp管理后台插件页面,激活插件,激活插件后,在"Appearance"--->"Widgets",把“MP3 Player ”添加到侧栏中。 3.点击“Settings”---->“MP3 Player”进入页面设置相关内容,具体见下图: 在上图中,点击Add New添加新的歌曲,title输入标题,URL中输入地址,这里建议在WordPress根目录中建一个audio的目录,把你希望播放的歌曲放在里面,然后,在URL地址中输入这些歌曲的URL地址(这些歌曲用英文来命名,笔者测试时,MP3中文名格式不能播放),当然,你也可以到网上找到这些歌曲的URL地址,如果网络加载慢的话,会影响歌曲的播放速度,效果不是很好。 既然可以添加,当然也可删除了,选中不需要的歌曲,然后点击“Delete All Checked”,进行删除,添加或删除歌曲后,点击“Save Changes”保存设置。
喜欢音乐的朋友们,一定非常期望有一款专属于自己博客的“个性音乐播放器”吧…… 最近为wordpress音乐插件 Flash Media player 设计了一款黑白主题皮肤,如下图 效果预览 / 下载地址 Flash Media player是一款专门用于Wordpress、bo-blog等主流博客平台的集成flash+xml+js技术的在线音乐播放器插件。 其功能强大且方便: 1、可播放Mp3和Flv文件; 2、可实时显示播放进度和下载进度; 3、可调节音量; 4、可设置“单曲循环”和“所有循环”播放模式; 5、可选择播放列表; 6、用XML文件配置播放文件列表; 安装方法: 1.将下载的压缩包解压缩。 2.用“记事本”编辑播放器首页:Index.html。找到<h1></h1>标签,将里面的大标题和链接都替换掉。 3.编辑曲目表:playlist.xml。格式如下: <track> <title>音乐名</title> <location>音乐的http地址(注意:音乐质量最好控制在3M以内,1是能保证访客的下载速度,2是节约你的空间和流量。如果你直接到“百度”里“扒”MP3地址,另当别论。)</location> </track> 想再添加一首新歌,只需要循环复制以上内容即可。 4.编辑完曲目表,将整个文件夹上传至网站根目录。 5.直接修改你的wordpress模板,在导航条里加入新链接后,上传即可, (例如:起名叫“音乐”,链接地址为:http://www.ueui.com.cn/mp3) 由于考虑到用户体验,我建议将Flash Media player新开一个页面(_blank)。这样做有这么个好处: 不会因为博客中的日志链接频繁跳转,而导致音乐常常被中断播放。(记得我常常浏览某人的blog,其每篇日志的侧边栏都导入同一个音乐插件。结果是,当我每次新开一篇文章时,就会重新听一遍他博客上第一首歌的前奏……当我看完他的所有日志后,甚至连第一首歌后半段是什么都不知道,可这首歌的前奏背的已经滚瓜烂熟……囧rz。据我所知,按这种方式使用音乐插件的人还不在少数,汗!)

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值