个人主页推荐——無名の主页

图片[1]-个人主页推荐——無名の主页-微生之最

主页的 Logo 字体已经过压缩,若用本站 Logo 以外的字母会变回默认字体,这里是 完整字体,若无法下载,可将字体目录下的  Pacifico-Regular-all.ttf  进行替换

功能

  • 载入动画
  •  站点简介
  •  Hitokoto 一言
  •  日期及时间
  •  实时天气
  •  时光进度条
  •  音乐播放器
  •  移动端适配

自动部署

以采用  Github Actions  来进行自动构建

图片[2]-个人主页推荐——無名の主页-微生之最

然后在仓库中进行任意修改后均会触发工作流的运行,在工作流完成后,会在下方生成一个可供下载的压缩包,这就是构建出的静态文件,可自行上传至服务器

图片[3]-个人主页推荐——無名の主页-微生之最

网站链接

在  src/assets/siteLinks.json  中可以自定义网站链接(以指向自己的网站):

{
"icon": "Blog",						
"name": "博客",						
"link": "https://blog.imsyy.top/"	
},

其中  icon  网站链接的图标可以在  src/components/Links/index.vue  中添加:

// 可前往 https://www.xicons.org 自行挑选并在此处引入
// 此处引入的是 fa 类型
import {
Link,
Blog,
CompactDisc,
Cloud,
Compass,
Book,
Fire,
LaptopCode,
} from "@vicons/fa";
...
// 网站链接图标
const siteIcon = {
Blog,
Cloud,
CompactDisc,
Compass,
Book,
Fire,
LaptopCode,
};

社交链接

在  src/assets/socialLinks.json  中可以自定义社交链接。

天气

前往 高德开放平台控制台 创建一个  Web 服务  类型的  Key ,并将  Key  填入  .env  中的  VITE_WEATHER_KEY  中

音乐

请在  .env  文件中更改歌曲相关参数即可实现自定义歌单列表

# 歌曲 API 地址
VITE_SONG_API = "https://api-meting.imsyy.top"
# 歌曲服务器 ( netease-网易云, tencent-qq音乐 )
VITE_SONG_SERVER = "netease"
# 播放类型 ( song-歌曲, playlist-播放列表, album-专辑, search-搜索, artist-艺术家 )
VITE_SONG_TYPE = "playlist"
# 播放 ID
VITE_SONG_ID = "7452421335"

GitHub地址

imsyy/home: 个人主页,我的个人主页,个人主页源码,主页模板,homepage (github.com)

© 版权声明
THE END
支持我嘛~
点赞12 分享
碎语词话 共3条
头像
请文明发言哦~
提交
头像

昵称

取消
昵称表情代码