随着自己在重新整理自己博客的探索中越来越深入,各种有趣的小功能越来越让我感到有趣,所以我整理了一下在文章中插入视频音乐的方法
安装插件
安装hexo-tag-aplayer和hexo-tag-dplayer插件
进入站点文件夹根目录,之后安装插件
cd blog
npm install hexo-tag-aplayer --save
npm install hexo-tag-dplayer --save
Hexo音乐插件详细信息:hexo-tag-aplayer中文文档
真.源码:APlayer
Hexo视频插件纤细信息:hexo-tag-dplayer文档
在文章中的用法:
当开启
Hexo 的 文章资源文件夹 功能时,可以将图片、音乐文件、歌词文件放入与文章对应的资源文件夹中,然后直接引用:
{% aplayer "Caffeine" "Jeff Williams" "caffeine.mp3" "picture.jpg" "lrc:caffeine.txt" %}
示例:
单独歌曲
插入文章代码:
{% aplayer "See You Again" "Wiz Khalifa" "http://olfa3o6q1.bkt.clouddn.com/See%20You%20Again.mp3" "lrc:http://olfa3o6q1.bkt.clouddn.com/See%20You%20Again.lrc" %}
效果:
速度与激情-see you again
演唱:Wiz Khalifa;Charlie Puth
歌词by:漫天飞羽
It's been a long day without you my friend
And I'll tell you all about it when I see you again
We've come a long way from where we began
Oh I'll tell you all about it when I see you again
When I see you again
Damn who knew all the planes we flew
Good things we've been through
That I'll be standing right here
Talking to you about another path
I know we loved to hit the road and laugh
But something told me that it wouldn't last
Had to switch up look at things
different see the bigger picture
Those were the days hard work forever pays
Now I see you in a better place (Now I see you in a better place)
ah~
How could we not talk about family
when family's all that we got?
Everything I went through
you were standing there by my side
And now you gonna be with me for the last ride
It's been a long day without you my friend
And I'll tell you all about it when I see you again
We've come a long way from where we began
Oh I'll tell you all about it when I see you again
When I see you again
First you both go out your way
And the vibe is feeling strong and what's
Small turn to a friendship a friendship
Turn into a bond and that bond will never
Be broke and the love will never get lost (Be broke and the love will never get lost)
And when brotherhood come first then the line
Will never be crossed established it on our own
When that line had to be drawn and that line is what
We reach so remember me when I'm gone
How could we not talk about family
when family's all that we got?
Everything I went through you
were standing there by my side
And now you gonna be with me for the last ride
Let the light guide your way hold every memory
As you go and every road you
take will always lead you home
Hoo~
It's been a long day without you my friend
And I'll tell you all about it when I see you again
We've come a long way from where we began
Oh I'll tell you all about it when I see you again
When I see you again
Again
When I see you again see you again
When I see you again
- 00:00 / 00:00歌单
插入文章代码:
{% aplayerlist %}
{
"narrow": false, // (可选)播放器袖珍风格
"autoplay": true, // (可选) 自动播放,移动端浏览器暂时不支持此功能
"mode": "random", // (可选)曲目循环类型,有 'random'(随机播放), 'single' (单曲播放), 'circulation' (循环播放), 'order' (列表播放), 默认:'circulation'
"showlrc": 3, // (可选)歌词显示配置项,可选项有:1,2,3
"mutex": true, // (可选)该选项开启时,如果同页面有其他 aplayer 播放,该播放器会暂停
"theme": "#e6d0b2", // (可选)播放器风格色彩设置,默认:#b7daff
"preload": "metadata", // (可选)音乐文件预载入模式,可选项: 'none' 'metadata' 'auto', 默认: 'auto'
"listmaxheight": "513px", // (可选) 该播放列表的最大长度
"music": [
{
"title": "CoCo",
"author": "Jeff Williams",
"url": "caffeine.mp3",
"pic": "caffeine.jpeg",
"lrc": "caffeine.txt"
},
{
"title": "アイロニ",
"author": "鹿乃",
"url": "irony.mp3",
"pic": "irony.jpg"
}
]
}
{% endaplayerlist %}
效果:
Not available
- 00:00 / 00:00- 1 歌曲名
- 2 歌曲名
音乐的外链本来想用网易云的外链,结果发现自己喜欢的歌都因为版权无法使用外链,所以我决定使用七牛云储存音乐以及歌词
视频
插入文章代码:
{% dplayer "url=http://olfa3o6q1.bkt.clouddn.com/%5B4K-60FPS%5D%20Avengers%20-%20Infinity%20War%20%7C%20Official%20Trailer%20%7C%202018.mp4" "api=https://api.prprpr.me/dplayer/" "id=" "loop=false" %}
效果: