【Win10】Hexo 搭建个人主页 (十一)添加网易云音乐

前言

本篇博文是关于添加网易云音乐。


如果对于搭建等其它方面有需要了解的,读者可以阅读前几篇比较优质的文章:

推荐阅读:【Win10】搭建个人博客 Hexo框架 (自制)

推荐阅读:【Win10】搭建个人博客 Hexo框架(部署到 github 上并 导入美化样式 )

推荐阅读:【Win10】Hexo 搭建个人主页 (一)解决所有文章,缺失模块问题

推荐阅读:【Win10】Hexo 搭建个人主页 (二)配置图片资源

推荐阅读:【Win10】Hexo 搭建个人主页 (三)文章显示摘要

推荐阅读:【Win10】Hexo 搭建个人主页 (四)文章显示目录

推荐阅读:【Win10】Hexo 搭建个人主页 (五)增加归档菜单

推荐阅读:【Win10】Hexo 搭建个人主页 (六)修改代码块样式

推荐阅读:【Win10】Hexo 搭建个人主页 (七)增加不蒜子统计

推荐阅读:【Win10】Hexo 搭建个人主页 (八)添加Gitment评论系统

推荐阅读:【Win10】Hexo 搭建个人主页 (九)添加字数统计和阅读时长功能

推荐阅读:【Win10】Hexo 搭建个人主页 (十)添加版权说明(更新配置版)

准备工作

1、打开网易云音乐首页,复制选择的背景音乐分享外链

点击进入网易云音乐

不过有点尴尬的是,大部分音乐是有版权的,我们只能拿到没设置版权的那种,但总比没有的好咯

2、引入播放器代码

themes/yilia/layout/_partial/left-col.ejs文件nav标签中添加如下代码

注:放在<nav></nav>之内(我这里设置了默认不自动播放,因为在手机端不太友好…)

<!-- 网易云音乐插件 -->
<% if (theme.music && theme.music.enable){ %>
	<div style="position:absolute; bottom:120px left:auto; width:85%">
		<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=240 height=52 src="//music.163.com/outchain/player?type=2&id=445124012&auto=0&height=32"></iframe>
	</div>
<% } %>

在这里插入图片描述

3、在yilia主题配置文件中添加属性

# 网易云音乐插件
music:
  enable: true
  #id: 1332647902  # 网易云分享的ID
  autoplay: true  # 是否开启自动播放

效果

在这里插入图片描述

学如逆水行舟,不进则退
  • 4
    点赞
  • 2
    评论
  • 3
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

打赏
文章很值,打赏犒劳作者一下
相关推荐
©️2020 CSDN 皮肤主题: 成长之路 设计师:Amelia_0503 返回首页

打赏

一百个Chocolate

千万不要打赏,千万不要,就白嫖

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付 9.90元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值