- 本代码支持任何typecho,支持展示
专辑图、专辑、歌手、lrc歌词滚动
。 - 食用方式:代码前后加
!!!
即可。 - 为什么要搞出这个代码呢?不是有很多音乐插件吗?
最近发现typecho里能用的音乐插件越来越少,大多数的插件都是年久失修。同时也看着群友们在音乐分享的时候,一个简简单单的播放器,还有些歌词直接粘贴在文章里,感觉整体上不是这么好看。
后面呢,突然想到了一个点子,typecho支持嵌入HTML标签,那我直接在编辑器里写好了,也不用找插件麻烦,也省去程序升级后插件不能使用的尴尬,最主要的是修改方便!
- 有能力的小伙伴们可以做成插件

歌名:Good Time
专辑:Good Time 歌手:Beyond
加载中……
- 以下代码

<!-- 歌名和歌手 -->
<div style="margin-bottom: 15px;">
<h2 id="song-title" style="margin: 0; font-size: 20px; font-weight: bold; color: #333;">歌名:Good Time</h2>
<p id="artist-name" style="margin: 5px 0 0; font-size: 16px; color: #555;">专辑:Good Time    歌手:Beyond</p>
</div>
<!-- 音乐播放器 -->
<audio id="audio" controls style="width: 100%; margin-bottom: 15px;">
<source src="https://music.htaoo.com/Good%20Time-Beyond.mp3" type="audio/mp3">// 替换为实际的歌曲路径
您的浏览器不支持音频播放,请升级到支持 HTML5 的浏览器。
</audio>
<!-- 歌词区域 -->
<div id="lyrics" style="max-height: 300px; overflow-y: auto; font-size: 14px; line-height: 1.6; color: #333; background-color: #fff; padding: 10px; border: 1px solid #ddd; border-radius: 4px;">
加载中……
</div>