Markdown使用技巧之插入音频


测试用,可以随便听听。


        

Geam Start!


简单说明


看了很多的关于插入音频的文章,发现一个最难的问题就是如何获得音频文件的地址,当然,有服务器的大佬就不说了,可以直接把音频放到自己的服务器上来获得音频链接,不过这还是挺麻烦的。
无意中看到了一篇关于next主题插入音频的博客,发现了一个我感觉很简单的方法。我也把这位大佬的博客链接分享给各位。想了解更多的可以点击README 查看。我就介绍一个简单可行的插入音频文件的方法。


开始使用


可以在文章开头添加,或者去修改主题:

1
2
3
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/meting@1.1.0/dist/Meting.min.js"></script>

在文章中插入以下代码:

1
<div class="aplayer" data-id="3099548864" data-server="netease" data-type="playlist" data-mode="random" data-autoplay="true"></div>

结果就是这样:


主要参数
data-id 歌曲/专辑/歌单的ID
data-server netease(网易云音乐)tencent(QQ音乐) xiami(虾米) kugou(酷狗)
data-type song (单曲) album (专辑) playlist (歌单) search (搜索)
data-mode random (随机) single (单曲) circulation (列表循环) order (列表)
data-autoplay false(手动播放)/true(自动播放)

关于data-autoplay这个参数,我在使用的时候有一些问题,就是在将值设为true之后,还是有的时候不能自动播放。不过这并不影响使用。


获取data-id的值


下面就来说一下如何获得data-id的值。


以网易云为例。首先进入网易云官网,如果是想插入自己的歌单,就登录自己的账号。
audio_skill1


然后搜索自己想要添加的音乐。
audio_skill2


点击要添加的音乐或歌单,就能看到需要的ID了。
audio_skill3


audio_skill4


Game Clearance!!!

请给我充电吧!
-------------    本文结束  感谢您的阅读    -------------
0%