如何让你的 github profile 让人眼前一亮?默认的 github profile 页面是支持 Markdown 语法的,如是可以玩出很多花样来!给它添加各种特效和信息吧
Github Stats Card
Github https://github.com/appotry/github-readme-stats 参考代码
Docker Hub https://hub.docker.com/r/bloodstar/github-readme-stats
更详细参数使用说明,请参考 Github 仓库 Readme 说明
由于 github 对 api 调用次数有限制,最好自建服务器使用!
自建 Docker 服务
docker-compose.yml
version: "3"
services:
grs:
image: bloodstar/github-readme-stats:latest
container_name: grs
environment:
PAT_1: ghp_****
CACHE_SECONDS: 600
ports:
- 9000:9000
docker run
$ docker run \
--name grs \
--restart=unless-stopped \
-d \
-e PAT_1="ghp_****" \
bloodstar/github-readme-stats
Vercel 和 docker 调用差异
和Vercel 部署调用不同,不需要 /api
这里vercel 和 docker 调用接口一致是比较容易实现的。为了方便和上游同步,这里就没有做修改。
# Vercel 部署调用

# Docker 部署调用

[](https://github.com/appotry/github-readme-stats)
GitHub Stats Card
[](https://github.com/appotry/github-readme-stats)
<picture>
<source
srcset="https://ghstats.17lai.site/?username=appotry&show_icons=true&theme=dark"
media="(prefers-color-scheme: dark)"
/>
<source
srcset="https://ghstats.17lai.site/?username=appotry&show_icons=true"
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
/>
<img src="https://ghstats.17lai.site/?username=appotry&show_icons=true" />
</picture>
GitHub Repo Pins
[](https://github.com/anuraghazra/github-readme-stats)
GitHub Gist Pins
[](https://gist.github.com/Yizack/bbfce31e0217a3689c8d961a356cb10d/)
Top Languages Card
[](https://github.com/anuraghazra/github-readme-stats)
WakaTime Stats Card
[](https://github.com/anuraghazra/github-readme-stats)
自动获取最新 RSS 文章
项目代码需要 rss2才能用。为了下面代码正常运行,需要安装支持 RSS2 的 hexo 插件 hexo-feed
创建 Profile Repo
创建一个和用户名一样的仓库,这个仓库就是你的 Github Profile 仓库。仓库的Readme.md
文件将会显示在 github/[name]
代码仓库导入 https://github.com/appotry/appotry
修改个人信息
.template/README.md
generator.py
.github/workflows/get rss.yml
.template/README.md
把博主的信息,换为你自己的信息
generator.py
把常量定义修改为你自己的信息
# 常量定义
POSTS_RSS_URL = 'https://blog.17lai.site/rss.xml'
BLOG_URL_PREFIX = 'https://blog.17lai.site'
RECENT_POST_LIMIT = 12
.github/workflows/get rss.yml
修改文件仓库名称等相关内容
创建 action CI_TOKEN
- name: Generate README.md for github.com
env:
GH_REPO: github.com/appotry/appotry.git
run: |
mkdir -p /home/runner/work/artifacts/
cd /home/runner/work/artifacts/
git clone https://github.com/appotry/appotry.git
cd /home/runner/work/artifacts/appotry
git config user.name "appotry"
git config user.email "andycrusoe@gmail.com"
rm -f README.md
配置完成后,运行 github action
最终效果
当然,还有很多其它方法用来美化 Github Profile
这里只是介绍了简单的几种,profile中使用的技术还没介绍完全
参考&致谢
最近发现一个 github action 实现了类似的功能 gautamkrishnar/blog-post-workflow
系列教程
Hexo系列
[三万字教程]基于Hexo的matery主题搭建博客并深度优化完全一站式教程
- Hexo Docker环境与Hexo基础配置篇
- hexo博客自定义修改篇
- hexo博客网络优化篇
- hexo博客增强部署篇
- hexo博客个性定制篇
- hexo博客常见问题篇
- hexo博客博文撰写篇之完美笔记大攻略终极完全版
- Hexo Markdown以及各种插件功能测试
- markdown 各种其它语法插件,latex公式支持,mermaid图表,plant uml图表,URL卡片,bilibili卡片,github卡片,豆瓣卡片,插入音乐和视频,插入脑图,插入PDF,嵌入iframe
- 在 Hexo 博客中插入 ECharts 动态图表
- 使用nodeppt给hexo博客嵌入PPT演示
- GithubProfile美化与自动获取RSS文章教程
- Vercel部署高级用法教程
- webhook部署Hexo静态博客指南
- 在宝塔VPS上面采用docker部署waline全流程图解教程
- 自建Umami访问统计服务并统计静态博客UV/PV