热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

html5显示多个cue,WordPress添加超酷html5音乐播放器Cue

文件引用、加载下载之后解压可得cue-html5musicplayer文件夹,打开它你会看到functions.cue.php和cue文件夹两个个东东。1、将func

文件引用、加载

下载之后解压可得cue-html5musicplayer文件夹,

打开它 你会看到functions.cue.php 和 cue文件夹 两个个东东。

1、将functions.cue.php里面的代码复制到你主题的functions.php里面,或者在functions.php中使用include ("functions.cue.php");引用;

2、将cue文件夹复制到主题根目录下

添加歌曲

完成以上1、2步就算成功99%了。剩下的就是新建专辑-添加歌曲链接和名称

a45010f69f5995390abefe24d3f7cae4.png

最后一步,在WP后台-外观-小工具上可以看到Playlist小工具,将Playlist添加到你的侧栏,填写标题和选择专辑-保存。如此一来,播放器就会在网站显示了,见下图。

1168ae052932dfa8fc92d5d16758f0ed.png

当然,若你不想放在小工具,可以使用 来进行任意位置的调用,其中$id表示专辑id。

为什么播放器不显示或无效?

按上面的步骤添加之后如果网站没有显示播放器可能有以下几种原因:

1、你的主题没有加载jquery库,考虑到99%的主题都会加载jquery库,所以我就把插件中的相关代码精简掉了。如果没有加载jquery库 请自行添加。

2、添加小工具时没有选择音乐专辑。新建专辑之后在侧栏小工具添加时不要忘了选择刚才你新建的专辑名称-然后保存,否则播放器也会不显示。

3、网站加载慢。由于该播放器的js被强制放在了footer.php最后加载,所以如果前面你的网站没有加载完毕(比如;gravatar头像没有加载出来)那么就会影响播放器的加载。

4、在Chromium浏览器(非Chrome)、Mxnitro等类似内核的浏览器下只显示灰色一块无法使用时,请把mediaelement-and-player.min.js单独拿出来在cue.min.js前加载。使用 wp_enqueue_script( 'media', '/wp-includes/js/mediaelement/mediaelement-and-player.min.js' , array(), '', true); 来实现,因为上面的文件js把两者合并在了一起,如果你不介意可以不理会。



推荐阅读
  • QuestionThereareatotalofncoursesyouhavetotake,labeledfrom0ton-1.Somecoursesmayhaveprerequi ... [详细]
  • PHP图片截取方法及应用实例
    本文介绍了使用PHP动态切割JPEG图片的方法,并提供了应用实例,包括截取视频图、提取文章内容中的图片地址、裁切图片等问题。详细介绍了相关的PHP函数和参数的使用,以及图片切割的具体步骤。同时,还提供了一些注意事项和优化建议。通过本文的学习,读者可以掌握PHP图片截取的技巧,实现自己的需求。 ... [详细]
  • Voicewo在线语音识别转换jQuery插件的特点和示例
    本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件,该插件具有快速、架构、风格、扩展和兼容等特点,适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]
  • 本文介绍了lua语言中闭包的特性及其在模式匹配、日期处理、编译和模块化等方面的应用。lua中的闭包是严格遵循词法定界的第一类值,函数可以作为变量自由传递,也可以作为参数传递给其他函数。这些特性使得lua语言具有极大的灵活性,为程序开发带来了便利。 ... [详细]
  • 基于layUI的图片上传前预览功能的2种实现方式
    本文介绍了基于layUI的图片上传前预览功能的两种实现方式:一种是使用blob+FileReader,另一种是使用layUI自带的参数。通过选择文件后点击文件名,在页面中间弹窗内预览图片。其中,layUI自带的参数实现了图片预览功能。该功能依赖于layUI的上传模块,并使用了blob和FileReader来读取本地文件并获取图像的base64编码。点击文件名时会执行See()函数。摘要长度为169字。 ... [详细]
  • 本文分享了一个关于在C#中使用异步代码的问题,作者在控制台中运行时代码正常工作,但在Windows窗体中却无法正常工作。作者尝试搜索局域网上的主机,但在窗体中计数器没有减少。文章提供了相关的代码和解决思路。 ... [详细]
  • 目录实现效果:实现环境实现方法一:基本思路主要代码JavaScript代码总结方法二主要代码总结方法三基本思路主要代码JavaScriptHTML总结实 ... [详细]
  • 如何使用Java获取服务器硬件信息和磁盘负载率
    本文介绍了使用Java编程语言获取服务器硬件信息和磁盘负载率的方法。首先在远程服务器上搭建一个支持服务端语言的HTTP服务,并获取服务器的磁盘信息,并将结果输出。然后在本地使用JS编写一个AJAX脚本,远程请求服务端的程序,得到结果并展示给用户。其中还介绍了如何提取硬盘序列号的方法。 ... [详细]
  • Mac OS 升级到11.2.2 Eclipse打不开了,报错Failed to create the Java Virtual Machine
    本文介绍了在Mac OS升级到11.2.2版本后,使用Eclipse打开时出现报错Failed to create the Java Virtual Machine的问题,并提供了解决方法。 ... [详细]
  • 本文详细介绍了Linux中进程控制块PCBtask_struct结构体的结构和作用,包括进程状态、进程号、待处理信号、进程地址空间、调度标志、锁深度、基本时间片、调度策略以及内存管理信息等方面的内容。阅读本文可以更加深入地了解Linux进程管理的原理和机制。 ... [详细]
  • Html5-Canvas实现简易的抽奖转盘效果
    本文介绍了如何使用Html5和Canvas标签来实现简易的抽奖转盘效果,同时使用了jQueryRotate.js旋转插件。文章中给出了主要的html和css代码,并展示了实现的基本效果。 ... [详细]
  • 本文讨论了微软的STL容器类是否线程安全。根据MSDN的回答,STL容器类包括vector、deque、list、queue、stack、priority_queue、valarray、map、hash_map、multimap、hash_multimap、set、hash_set、multiset、hash_multiset、basic_string和bitset。对于单个对象来说,多个线程同时读取是安全的。但如果一个线程正在写入一个对象,那么所有的读写操作都需要进行同步。 ... [详细]
  • 本文介绍了SPOJ2829题目的解法及优化方法。题目要求找出满足一定条件的数列,并对结果取模。文章详细解释了解题思路和算法实现,并提出了使用FMT优化的方法。最后,对于第三个限制条件,作者给出了处理方法。文章最后给出了代码实现。 ... [详细]
  • 本文介绍了Redis的基础数据结构string的应用场景,并以面试的形式进行问答讲解,帮助读者更好地理解和应用Redis。同时,描述了一位面试者的心理状态和面试官的行为。 ... [详细]
  • rabbitmq杂谈
    rabbitmq中的consumerTag和deliveryTag分别是干啥的,有什么用?同一个会话,consumerTag是固定的可以做此会话的名字,deliveryTag每次接 ... [详细]
author-avatar
nw3344_575
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有