b站小徽章

Overview

Bilibili Stats Badges

Bilibili状态徽章,可用于网站、README等地方进行显摆(划掉)展示自己的B站账号信息。

目录

关系状态数徽章

粉丝数

Followers

显示有多少人关注你

链接: https://bilistats.lonelyion.com/followers?uid=[你的UID]

HTML: <img src="https://bilistats.lonelyion.com/followers?uid=[你的UID]" alt="Followers"/>

Markdown: ![Followers](https://bilistats.lonelyion.com/followers?uid=[你的UID])

关注数

Following

显示你关注了多少人

链接: https://bilistats.lonelyion.com/following?uid=[你的UID]

HTML: <img src="https://bilistats.lonelyion.com/following?uid=[你的UID]" alt="Following"/>

Markdown: ![Following](https://bilistats.lonelyion.com/following?uid=[你的UID])

UP主状态数徽章

视频播放量

Video Views

显示所有视频投稿的播放数总和

链接: https://bilistats.lonelyion.com/views?uid=[你的UID]&type=video, 其中&type=video可有可无

HTML: <img src="https://bilistats.lonelyion.com/views?uid=[你的UID]" alt="Video Views"/>

Markdown: ![Video Views](https://bilistats.lonelyion.com/views?uid=[你的UID])

专栏阅读量

Article Views

显示所有专栏投稿的阅读数总和

链接: https://bilistats.lonelyion.com/views?uid=[你的UID]&type=article

HTML: <img src="https://bilistats.lonelyion.com/views?uid=[你的UID]&type=article" alt="Article Views"/>

Markdown: ![Article Views](https://bilistats.lonelyion.com/views?uid=[你的UID]&type=article)

获赞数

Likes

就个人空间里那个获赞数,我也不知道算哪些的总和

链接: https://bilistats.lonelyion.com/views?uid=[你的UID]&type=likes

HTML: <img src="https://bilistats.lonelyion.com/views?uid=[你的UID]&type=likes" alt="Likes"/>

Markdown: ![Likes](https://bilistats.lonelyion.com/views?uid=[你的UID]&type=likes)

用户信息徽章

用户等级

Level

不会还有人不是B站6级用户吧

链接: https://bilistats.lonelyion.com/level?uid=[你的UID]

HTML: <img src="https://bilistats.lonelyion.com/level?uid=[你的UID]" alt="Level"/>

Markdown: ![Level](https://bilistats.lonelyion.com/level?uid=[你的UID])

直播间开播状态

Live Status

就很简单的在不在播,这个UID也是用户ID不是直播间号

链接: https://bilistats.lonelyion.com/live_status?uid=[你的UID]

HTML: <img src="https://bilistats.lonelyion.com/live_status?uid=[你的UID]" alt="Live Status"/>

Markdown: ![Live Status](https://bilistats.lonelyion.com/live_status?uid=[你的UID])

附加参数

color

改变徽章右侧的颜色,支持CSS颜色名字或十六进制数字

默认值: blue

参数 外观
?color=red
?color=0a8b9d

style

改变徽章的样式,支持以下几种外观

默认值: flat-square

参数 外观
?style=plastic
?style=flat
?style=flat-square
?style=for-the-badge
?style=social

label

改变徽章的标签,特殊字符(如空格)最好使用URL编码转换

默认值: Bilibili 粉丝数等上面文档显示的那样

参数 外观
?label=粉丝数
?label=B站%20粉丝数
?label=直播

label_color

改变徽章左侧的颜色,支持CSS颜色名字或十六进制数字

默认值: grey

参数 外观
?label_color=magenta
?label_color=33ab06

logo_color

改变徽章左侧的颜色,支持CSS颜色名字或十六进制数字

默认值: grey

参数 外观
?logo_color=green
?logo_color=cf34eb

format

改变数字的格式,支持none, commas, short

默认值: none

参数 外观
?format=none
?format=commas
?format=short

混搭参数

通过对url参数的组合,可以同时生效多个样式,例如

参数 外观
?style=social&label=关注
?label=播放量&style=for-the-badge&color=3d3d3d&format=commas
?label=获赞&style=for-the-badge&color=blue&label_color=00a1d6&logo_color=white

调试和部署

调试

调试需要安装和配置好NodeJS 14以上版本以及Vercel CLI

clone本项目后

npm install 或 yarn
vercel dev

即可在本地运行Vercel Serverless Functions环境,并且可以自动反馈文件修改。

部署

目前本项目仅支持部署到Vercel,也欢迎移植到其他平台。

Deploy with Vercel

点击上方按钮一键部署至Vercel,需要的环境变量已在部署步骤Configure Project中说明。

TODOs

  • 支持更多的字段信息
  • 对一些只有两个值的信息(例如直播状态:未开播已开播),增加两个color的支持以对应不同的状态
You might also like...
Owner
离子
Always believe that something wonderful is about to happen.
离子