參考：https://github.com/Platane/Platane/tree/master

首先寫個自動化腳本 .github/workflows/snake.yml，GitHub Actions 會按計劃去生成并提交最新版的 “貪吃蛇” SVG。緊接著，再在你的 README.md 中引用它，就能看到效果啦！

自動化腳本

這一部分是 每天／每次你推代碼／手動運行 時，自動生成最新的兩張 SVG：淺色和深色「貪吃蛇貢獻動畫」；然后把它們提交到 output 分支。

首先，登錄后，點擊倉庫頁面上方的 Add file → Create new file，在 “Name your file…” 的輸入框中，直接輸入路徑：.github/workflows/snake.yml，在下方的大編輯區域，粘貼 workflow 內容：

# workflow name
name: generate animationon:# run automatically every 24 hoursschedule:- cron: "0 */24 * * *" # allows to manually run the job at any timeworkflow_dispatch:# run on every push on the master branchpush:branches:- masterjobs:generate:permissions: contents: writeruns-on: ubuntu-latesttimeout-minutes: 5steps:# generates a snake game from a github user (<github_user_name>) contributions graph, output a svg animation at <svg_out_path>- name: generate github-contribution-grid-snake.svguses: Platane/snk/svg-only@v3with:github_user_name: ${{ github.repository_owner }}outputs: |dist/github-contribution-grid-snake.svgdist/github-contribution-grid-snake-dark.svg?palette=github-dark# push the content of <build_dir> to a branch# the content will be available at https://raw.githubusercontent.com/<github_user>/<repository>/<target_branch>/<file> , or as github page- name: push github-contribution-grid-snake.svg to the output branchuses: crazy-max/ghaction-github-pages@v3.1.0with:target_branch: outputbuild_dir: distenv:GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

這段 GitHub Actions 的 YAML 文件是用來定時（和按需／每次推送）自動生成「貪吃蛇貢獻動畫」SVG，然后把它們發布到指定分支上的。

頂部元信息

name: generate animation

• 給這個 Workflow 起了個名字 “generate animation”。

觸發條件（on:）

on:schedule:- cron: "0 */24 * * *"workflow_dispatch:push:branches:- master

1. schedule

   • cron: "0 */24 * * *" 表示每天整點觸發一次（等同于“每 24 小時執行一次”）。

2. workflow_dispatch

   • 允許你在 GitHub 界面上手動點擊 “Run workflow” 來觸發。

3. push 到 master 分支

   • 只要有人往 master 分支 push 代碼，就會觸發這個 Workflow。
   • 當你在倉庫的 master（或 main）分支上做任何提交／推送操作時，GitHub 都會發出一個 “push” 事件，觸發對應配置中定義了 push: branches: [master] 的工作流。

這樣就保證了：

• 自動定時更新
• 可以手動隨時更新
• 每次推 master 時也會更新

Tip：現在很多倉庫默認主分支名字是 main 而不是 master，如果你的主分支叫 main，記得把配置改成：

on:push:branches:- main

這樣才會在你真正常用的主分支推送時觸發工作流。

• 進入你倉庫主頁，在頁面正中偏上，有一個下拉框寫著 “Branch: …”，它默認顯示的那個分支，就是你的主分支名稱（比如 main 或 master）。
• 或者點進 Settings →?Branches（左側菜單），在 “Default branch” 一欄就能看到。

作業（jobs:）

jobs:generate:permissions: contents: writeruns-on: ubuntu-latesttimeout-minutes: 5

• generate：作業 ID，隨便起名。
• permissions: contents: write：給這個作業寫權限，才能往分支里提交文件。
• runs-on: ubuntu-latest：在最新的 Ubuntu 虛擬機上跑。
• timeout-minutes: 5：如果跑超 5 分鐘還沒結束，就強制終止。

步驟（steps:）

1. 生成 SVG

- name: generate github-contribution-grid-snake.svguses: Platane/snk/svg-only@v3with:github_user_name: ${{ github.repository_owner }}outputs: |dist/github-contribution-grid-snake.svgdist/github-contribution-grid-snake-dark.svg?palette=github-dark

• uses: Platane/snk/svg-only@v3
  調用了社區提供的 Platane/snk Action，只要給它 GitHub 用戶名，就能抓取該用戶的過去一年貢獻熱圖，并在上面繪制“貪吃蛇”動畫。

• github_user_name: ${{ github.repository_owner }}
  自動傳入倉庫的擁有者用戶名（也就是你自己的 GitHub 用戶名），無需硬編碼。

• outputs

  • dist/github-contribution-grid-snake.svg：生成的淺色主題 SVG。
  • dist/github-contribution-grid-snake-dark.svg?palette=github-dark：生成的深色主題 SVG（通過 query 參數切換配色）。

生成后會把兩個文件都放進工作目錄下的 dist/ 文件夾。

2. 推送到 output 分支

- name: push github-contribution-grid-snake.svg to the output branchuses: crazy-max/ghaction-github-pages@v3.1.0with:target_branch: outputbuild_dir: distenv:GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

• uses: crazy-max/ghaction-github-pages@v3.1.0
  這是一個方便把某個目錄內容發布到指定分支（通常用于 GitHub Pages 或存放生成文件）的 Action。
• target_branch: output
  把 dist/ 目錄下的文件推送到當前倉庫的 output 分支。
• build_dir: dist
  指定要發布的本地目錄就是前一步生成的 dist/。
• GITHUB_TOKEN
  內置的 secrets.GITHUB_TOKEN 用來做認證，允許寫入 output 分支。

Commit & Push

編輯完上述 .github/workflows/snake.yml 后，Commit & Push 到 GitHub，等 Action 跑完，檢查 output 下是否有兩張 svg。

在 README 里引用

更新 README 中的 鏈接指向這兩個 SVG，

<picture><source media="(prefers-color-scheme: dark)"srcset="https://raw.githubusercontent.com/你的用戶名/你的倉庫/output/github-contribution-grid-snake-dark.svg"><source media="(prefers-color-scheme: light)"srcset="https://raw.githubusercontent.com/你的用戶名/你的倉庫/output/github-contribution-grid-snake.svg"><img alt="🐍 Snake eating contributions"src="https://raw.githubusercontent.com/你的用戶名/你的倉庫/output/github-contribution-grid-snake.svg">
</picture>

再次 Commit & Push，刷新你的個人主頁，就能看到「貪吃蛇吃你的貢獻」在 README 里動起來了 🎉

這樣，你的個人主頁上就會不斷更新，展示一個真正基于你自己 GitHub 活動數據的「貪吃蛇」動畫了。