hexo博客主题next美化增加简易音乐播放器和看板娘

已于 2023-09-19 23:17:35 修改
阅读量527 收藏
点赞数
分类专栏： 杂项 文章标签： html html5 javascript hexo
于 2021-09-07 14:17:52 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/kaihang_cai/article/details/120155908
版权
本文介绍了如何通过简单几步操作，为Hexo博客Next主题添加简易音乐播放器，并解决HTTPS环境下播放器加载问题。同时，还指导了如何在博客中集成Live2D看板娘，提升博客趣味性。
摘要由CSDN通过智能技术生成

hexo博客主题next美化快速增加音乐播放器

方法

只要几行代码即可
在你想要的地方，如 themes/next/layout/_macro/sidebar.swig 加入以下代码：

<div>
	<iframe id="myframe" frameborder="no" border="0" marginwidth="0" marginheight="0" width
最低0.47元/天 解锁文章
kaihang_cai
关注
专栏目录
Hexo个人博客主题和看板娘
子豪的博客
06-24 982
Hexo的主题和看板娘配置
hexo博客中添加音乐播放器
买烤麸烤饼儿的博客
02-18 1988
1. 简介 本篇文章是介绍基于网易云iframe插件在hexo博客中加装音乐播放器的方法，无需安装任何额外插件。 2.安装步骤 在网易云音乐中打开你想要插入的音乐页面，点击 生成外联播放器。 在网页中调整好播放器插件后，复制下方的HTML代码。 如： <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/play
Hexo-Butterfly音乐播放器的添加
啦啦啦啦啦
05-12 6374
说明：该配置基于Butterfly主题版本为 4.2.0，基本参考官方教程，不修改pug文件，主题已经集成了相关的设置，该博文对其部分内容进行补充。参考链接在文章末尾给出。 我的个人博客主页：Github Gitee CSDN在渲染可能与个人博客渲染不同。博客会在两个平台同步更新。欢迎点击我的主页。 文章目录插件的安装与配置普通界面播放器全局吸底Aplayer模式演示1，普通列表模式2，单曲播放3，迷你模式附录参考链接Aplayer完整配置可选参数表 插件的安装与配置 安装 hexo-tag-apl.
hexo 配置音乐播放器
Anubis
10-26 612
要支持音乐播放，在主题的 _config.yml 配置文件中激活 music 配置即可：# 是否在首页显示音乐 music: enable: true title: # 非吸底模式有效 enable: true show: 听听音乐 server: netease # require music platform: netease, tencent...
hexo博客插入音乐播放器
soul7y的博客
04-26 1961
搭建好自己的博客之后，想要在博客中添加音乐播放器。需要hexo-tag-aplayer插件。 使用Git Bash进入本地hexo的文件夹。输入以下命令（异常或网络太慢可以考虑将npm换成cnpm） npm install --save hexo-tag-aplayer 然后在 Hexo 配置文件 _config.yml 中添加设置： 然后输入hexo new page playlist创建一...
Hexo+Butterfly主题博客添加音乐播放器的简单版教程
weixin_63549044的博客
03-04 2752
教你如何快速添加并使用博客音乐播放器
基于Next5主题美化的一款hexo博客主题
08-08
【描述】：“基于Next5主题美化的一款hexo博客主题”是指使用Hexo框架中的Next5主题进行了一系列的定制和优化，旨在提供更美观、更具个性化的博客展示效果。Hexo是一款快速、简洁且高效的静态博客生成器，它允许用户...
Hexo博客优化之Next主题美化
热门推荐
huangpiao
01-26 5万+
前言 有了前面几篇博客的介绍，我们就可以很容易的搭建并编辑我们的博客了，不过既然是属于自己的博客网站，自然也就想让其更加美观，更有意思，所以呢我下面介绍一下Hexo博客的主题美化操作。 1. Next主题 Hexo博客支持很多主题风格，其中Next主题是Github上Star最多的主题，其一直在更新维护，支持非常多的外部插件和功能选项。我目前使用的是Next6.0版本，下面我会介绍基于Ne...
Hexo博客搭建文件（next主题）
12-07
Next主题以其优雅的设计和丰富的功能，成为Hexo用户中的热门选择。下面将详细介绍Hexo博客搭建以及Next主题的配置。 首先，你需要确保你的计算机上已经安装了Git和Node.js。Git是分布式版本控制系统，对于管理代码...
【自搭博客系统篇四】：给博客添加音乐功能 hexo-tag-aplayer
ygxyvip的博客
02-27 1550
该操作针对hexo butterfly主题，其他主题可能有所不同至此，添加播放器成功，尽情享受吧。
使用插件aplayer和MeingJS在hexo文章内添加音乐
个人博客地址为https://elikgrade.gitee.io/
07-01 942
title: “在Hexo博客中使用APlayer和Meting音乐播放器”
Hexo博客Next主题魔改教程系列-音乐播放器
aqwca的博客
06-11 471
之前写过给博客添加音乐播放器,主要使用的是Hexo-tag-aplayer同时使用Meting-js。同时在meting-js里增加判断,如果报错就显示这个iframe元素,所以就不使用cdn引入了.这样在fetch之后报错的话就增加iframe元素,就正常显示一个播放器了.所以为了网站正常显示播放器,同时也为了操作方便,我这里又使用了firame。但最近发现貌似Meting-js出现了一些问题,主要是访问跨域的问题.下载meting-js文件并引入.
工具使用--第3节 HEXO美化之添加虾米音乐播放器
qq_25549309的博客
11-08 822
先看看效果图： 1. 获取播放器链接我用浏览器打开虾米播播网址： [http://www.xiami.com/widget?widget_from=42036317] 这里可以制作三款应用，分别是歌曲播放器列表，唱片墙，歌曲播放器（单曲）；这些都可以，这里只介绍第一种歌曲播放器列表。 点击下方的立即制作，进入制作页面： 自行添加音乐，然后下面就会出现播放器的代码： 我们复制中
hexo-tag-aplayer 教程与指南
最新发布
gitblog_00142的博客
08-12 478
hexo-tag-aplayer 教程与指南 项目地址:https://gitcode.com/gh_mirrors/he/hexo-tag-aplayer 1. 项目介绍 hexo-tag-aplayer 是一个基于APlayer的Hexo标签插件，用于在Hexo搭建的博客中方便地插入音乐播放器。该插件支持MetinJS，可自定义多种样式，并且提供了丰富的配置项，使音乐体验更加个性化。 2. 项...
简易音乐播放器
biscuitte的个人博客
05-08 497
系列文章目录 提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加 例如：第一章 Python 机器学习入门之pandas的使用 提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录系列文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结 前言 提示：这里可以添加本文要记录的大概内容： 例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。 提示：以下是本篇文章正文内容，下面案例
给自己的博客园添加网抑云音乐播放器
fantasyfzg的博客
11-08 773
给自己的博客园添加网抑云音乐播放器
Hexo Volantis主题音乐播放器Aplayer适应暗黑模式并能跟随变化
y223421的博客
07-17 290
昨晚被自己网站的 aplayer 闪瞎了眼一气之下整出了这个。
Hexo博客-butterfly主题添加音乐播放器以及更改播放器主题
Anychew的博客
03-14 2205
安装相关插件 npm install aplayer npm install --save hexo-tag-aplayer 添加相关代码 打开 themes\Butterfly\layout\includes\head.pug,在结尾加一句include ./third-party/aplayer.pug,如下： include ./head/config_site.pug include ./head/noscript.pug include ./third-party/aplay
轻松打造hexo-butterfly主题的看板娘教程
在Hexo的butterfly主题中加入看板娘，可以提升博客的趣味性和个性化程度，使得网页不仅具有专业性，同时也具备一定的娱乐性。 本次教程将围绕如何在Hexo的butterfly主题中添加看板娘进行详细说明。教程将涵盖以下...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值