功能介绍
- 一言API服务
- 实时时间
- 昼夜切换
- 音乐播放支持在线解析歌单(基于meting //支持多节点API)
项目信息
保姆级使用教程
SEO网站标题与logo更换
在index.html中找到以下代码,在第7-10行
<title>Acornia的主页</title>
<meta name="description" content="Acornia的个人引导页面,您可以从这里访问到我的所有公开服务">
<meta name="keywords" content="Acornia,个人主页,程序员,个人引导页">
<link rel="icon" type="image/ico" href="assets/images/favicon.ico">
修改配置
<title>网页标题</title>
<meta name="description" content="网站描述">
<meta name="keywords" content="网站搜索标签"> //用英文逗号隔开
<link rel="icon" type="image/ico" href="logo"> //链接或路径
效果图
头像/名称更换
在index.html中找到以下代码,替换其中的文本或图片链接即可,在28-35行
<div class="avatar-container">
<img class="profile-photo" src="assets/images/avatar.jpg" alt="头像">
</div>
<h1 class="profile-name">Acornia</h1>
<p class="profile-title" id="hitokoto"></p>
<p class="profile-bio" id="from"></p>
修改配置
<img class="profile-photo" src="图像地址" alt="图像描述"> //src= 图像链接或链接 alt= 图像的描述
<h1 class="profile-name">名称</h1>
<p class="profile-title" id="hitokoto"></p> //id="hitokoto"为一言获取
<p class="profile-bio" id="from"></p> //id="from" 为该一言的来源
其中的
id="hitokoto"
和 id="from"
删除后看可换为自己的简介或格言效果图
音乐播放器API设置
在index.html中找到以下代码,在17-20行替换即可
const METING_APIS = [
'/meting/',
'https://ioioi.lol/meting/'
];
该配置可无需修改
- 默认使用即可已内置api如不想使用内置的也可以使用第三方
- 支持多个api节点添加只需要使用”加链接即可一行一个
- 注意是英文的,如果是添加在最后面检查一下前面,最后面的不需要添加如果是添加前面则需要英文逗号
音乐播放器歌单设置
在index.html中找到以下代码,在24-33行替换即可
const PLATFORM_CONFIG = {
netease: {
name: '网易云音乐',
defaultPlaylist: '13230215625'
},
tencent: {
name: 'QQ音乐',
defaultPlaylist: '8982152830'
}
};
修改配置
name: '网易云音乐', //音乐平台
defaultPlaylist: '13230215625' //该平台的歌单id
name: 'QQ音乐', //音乐平台
defaultPlaylist: '8982152830' //该平台的歌单id
只修改defaultPlaylist:中的数字即可列如:
defaultPlaylist: '13230215625'
修改为defaultPlaylist: '1234567890'
在修改前请注意歌单平台歌单获取
网易云为例
- 在浏览器中搜索网易云音乐点击进入
- 在网易云首页找到歌单
- 找到一个你喜欢的或者是自己创建的点击进去
- 在浏览器的搜索框中找到其中的数字 例如:
12937122744
- 复制下来到index.html中替换defaultPlaylist: 例子如
defaultPlaylist: '12937122744'
- QQ音乐同理
按钮修改
在index.html中的找到以下代码,在第143-167行
<a href="https://blog.ioioi.lol/" class="social-btn">
<i class="ri-blogger-line"></i>
<span>biaoti</span>
</a>
修改配置
<a href="链接" class="social-btn"> // 要打开的链接
<i class="ri-blogger-line"></i> //icon图标 图标库为 `https://remixicon.com/`
<span>标题</span>
icon图标获取
浏览器访问https://remixicon.com/
然后找到一个相关的或者你喜欢的图标
点击该图标复制代码替换 <i class="ri-blogger-line"></i>
替换index.html中的<i class="ri-blogger-line"></i>
即可
依赖项目
https://github.com/metowolf/MetingJS
协议说明
- 允许: 免费使用、修改、分发(包括商业场景)
- 禁止: 直接售卖软件或用于付费服务
- 完整协议:
LICENSE