linkyee

作者 ZhgChgLi已验证

A fully customized, open-source LinkTree alternative deployed directly on GitHub Pages.

148
Stars
27
Forks
JavaScript
语言
2026/8/23
添加时间

⚠️ 第三方软件声明

本 Skill 为第三方开源软件,独立托管于 GitHub。SkillTip 仅为信息目录,不控制或维护底层仓库。所显示的安全检查为自动化且范围有限,安装前请自行审查源码。

阅读服务条款

安装

添加到你的 Claude Code skills 目录:

# Add to your Claude Code skills
git clone https://github.com/ZhgChgLi/linkyee

快速入门

使用 linkyee 等 Skills 的指南。

安全报告

已验证

上次扫描:—

{
  "status": "PASSED",
  "issues": []
}

README.md

English | 繁體中文

linkyee — Your Own Link Page

A fully customized, 100% free, open-source LinkTree alternative — deployed straight to GitHub Pages.

Inspired by Jekyllrb and LinkTree.

Automatic build pages-build-deployment

Live Demo →

image

In one sentence: click Use this template, edit one YAML file, push — your link page is live on GitHub Pages with a free *.github.io domain (or your own). No SaaS, no monthly fee, no vendor lock-in. AI-assisted theming and plugin development included.

Table of contents


Why linkyee?

  • 100% free. Hosted on GitHub Pages. No subscriptions, no ads, no upsells.
  • 100% yours. Your config, themes, plugins, and content live in your own GitHub repo. Take it offline whenever you want.
  • 8 ready-made themes — switch by editing a single line in config.yml.
  • AI Style Designer. Describe the look you want in plain English; the bundled linkyee-style-designer Claude skill writes the full theme for you (HTML + CSS + JS).
  • 6 built-in plugins for live data — GitHub stars, last commit, profile stats, RSS/Atom feeds, date countdowns, latest YouTube video.
  • AI Plugin Builder. Want data from somewhere else? Describe the source; the bundled linkyee-plugin-builder skill writes the Ruby plugin and wires it in.
  • SEO + accessibility built-in. WCAG AA contrast, dark mode, responsive down to 320 px, OG/Twitter meta, keyboard-friendly focus states.
  • Local preview with auto-rebuild. ./preview.sh rebuilds on save; refresh the browser, no plugins needed.

Buy me a beer ❤️❤️❤️

Buy Me A Beer

If this project has helped you, feel free to sponsor me a cup of coffee, thank you.

Feel free to open an issue or submit a fix/contribution via pull request. :)


Configuration

Everything that ends up on your page is driven by a single file: config.yml. It's a Liquid-rendered YAML file with five top-level sections:

theme: default                     # ← directory under ./themes/
lang: "en"

plugins:                           # ← optional dynamic data fetched at build time
  - GithubRepoStarsCountPlugin: [ZhgChgLi/linkyee]

title: "Your Name"                 # ← profile header
avatar: "./images/profile.jpeg"
name: "@yourhandle"
tagline: "One line about you."

links:                             # ← buttons in the link list
  - link:
      icon: "fa-brands fa-github"
      text: "GitHub ({{ vars.GithubRepoStarsCountPlugin['ZhgChgLi/linkyee'] }} ⭐)"
      url: "https://github.com/yourname"
      target: "_blank"

socials: [ ... ]                   # ← icon-only social row
footer: "Free-form HTML."
copyright: "© 2026 You."

The shipped config.yml is a fully working example that exercises every built-in plugin — read it as the canonical reference. Edit fields in place, push, wait for GitHub Actions to rebuild, refresh.

Multi-language sites

Configure i18n to render one static site for each locale. The root page chooses a saved or browser-matching locale, then falls back to default_locale.

i18n:
  default_locale: en
  locales:
    en: locales/en.yml
    es: locales/es.yml

Each locale file overrides profile content and may supply UI labels:

lang: es
og_locale: es_ES
locale_label: Español
title: Página de enlaces
name: Ejemplo
ui:
  language_switcher: Idioma
  primary_links: Enlaces principales

Locale hashes merge with config.yml; locale arrays such as links and socials replace their base values. Builds create /<locale>/ directories and a root redirect page. Without i18n, the existing single-page output is unchanged. See examples/i18n for a complete generic configuration.

Automatic redeployment

The site rebuilds automatically once a day so plugin output (star counts, latest posts, etc.) stays fresh. The cron lives in build.yml:

schedule:
    - cron: '0 0 * * *'   # daily at 00:00 UTC

Delete the schedule: block if you don't want scheduled redeploys.


Themes 🎨

linkyee ships 8 built-in themes designed to be drop-in usable. Switch by editing one line in config.yml:

theme: minimal-mono   # any directory under ./themes/
SlugLightDarkAesthetic / good for
defaultdefault lightdefault darkClean cards · safe default for anyone
minimal-monominimal-mono lightminimal-mono darkSwiss minimal · monospace · engineers, writers
editorial-serifeditorial-serif lighteditorial-serif darkMagazine serif · drop cap · bloggers, journalists
neo-brutalismneo-brutalism lightneo-brutalism darkThick borders · primary colors · indie devs, artists
glassmorphismglassmorphism lightglassmorphism darkFrosted glass cards · designers, agencies
paper-cardpaper-card lightpaper-card darkPastel cards · rounded · creators, illustrators
newsprintnewsprint lightnewsprint darkNewspaper masthead · serif + mono · numbered link rows · the live look of link.zhgchg.li
terminal-retroterminal-retro lightterminal-retro darkCRT · scanlines · phosphor-green-on-black (dark) / olive-on-cream printer-paper (light) · hackers

Every built-in theme meets the same baseline: WCAG AA contrast, dark mode that auto-switches with your system appearance (no manual toggle), responsive down to 320 px, keyboard-accessible focus states, and prefers-reduced-motion support.

To try them locally before committing, see Local testing. To regenerate the preview screenshots above after any visual change, run ./scripts/screenshot-themes.sh (requires npx playwright).

Modifying a theme by hand

Each theme lives at ./themes/<theme-name>/ with three files:

  • index.html — Liquid template (consumes config.yml)
  • styles.css — the look
  • scripts.js — can be empty, but the file must exist

The default theme self-hosts Font Awesome under themes/default/fontawesome/. The other built-ins load Font Awesome from a CDN to keep theme directories small.

🤖 AI Style Designer — generate a theme by description

Don't see a vibe you like? Describe it in plain English and the bundled linkyee-style-designer Claude skill writes a full theme for you.

How to use it:

  1. Install Claude Code and open this repo with it.

  2. Ask in natural language. Examples:

    "Design a linkyee theme inspired by 1960s Penguin paperback covers."

    "Make my links look like a Japanese ryokan website — quiet, elegant, lots of negative space."

    "I want a vaporwave aesthetic but keep it accessible."

  3. The skill reads your config.yml, asks clarifying questions if the brief is vague, generates themes/<your-theme>/, switches theme: in config.yml, and runs the build.

  4. Run ./preview.sh <new-theme> to see the result locally.

The skill enforces the same quality bar as the built-in themes: no AI slop (no unwarranted purple-pink gradients, no emoji-as-icons, no centered-everything-no-hierarchy), real typographic hierarchy, accessibility minimums, and strict RWD — mobile-first, ≥44 px tap targets, no horizontal scroll at 320 px.

Deeper design tooling. If you want a richer designer experience (multi-direction exploration, expert review, animation export), install the upstream huashu-design skill alongside it. The linkyee skill defers to huashu-design when both are present.


Plugins 🔌

Plugins are tiny Ruby classes that fetch data at build time and inject it into your page. Use them to render live values inside any link, the tagline, or the footer — anything that's a Liquid string.

Built-in plugins

PluginWhat it emitsReference shape
GithubRepoStarsCountPluginStar count for one or more repos{{ vars.GithubRepoStarsCountPlugin['owner/repo'] }}
GithubLastCommitPluginLatest commit sha / date / message{{ vars.GithubLastCommitPlugin['owner/repo'].date }}
GithubProfilePluginfollowers / following / repos{{ vars.GithubProfilePlugin['user'].followers }}
RSSFeedPluginLatest items (Medium / blog / podcast / YouTube feeds){{ vars.RSSFeedPlugin['url'][0].title }}
CountdownPluginDays until / since a target date{{ vars.CountdownPlugin.label.days }}
YouTubeChannelLatestVideoPluginLatest video — title, URL, thumbnail{{ vars.YouTubeChannelLatestVideoPlugin['@handle'].title }}

Enable in config.yml:

plugins:
  - GithubRepoStarsCountPlugin:
      - ZhgChgLi/linkyee
  - RSSFeedPlugin:
      - https://yourblog.example/feed.xml

…then reference the result anywhere a Liquid string is rendered:

links:
  - link:
      icon: "fa-brands fa-github"
      text: "linkyee ({{ vars.GithubRepoStarsCountPlugin['ZhgChgLi/linkyee'] }} ⭐)"
      url: "https://github.com/ZhgChgLi/linkyee"

If a plugin fails at build time (network error, API change, expired token, …) the build still succeeds — the value renders empty and the failure is logged in GitHub Actions output. Your site never breaks because of a flaky external API.

🤖 AI Plugin Builder — generate a plugin by description

Want data linkyee doesn't ship out of the box? Open the repo with Claude Code and describe what you want. The bundled linkyee-plugin-builder skill knows the plugin contract.

Examples:

"Add a plugin that shows my 3 latest posts from medium.com/@myhandle as new links."

"Fetch the current weather in Taipei from wttr.in and show the temp in the footer."

"Add a plugin that pulls my Steam total playtime via the Steam Web API."

The skill will:

  1. Confirm the data source and shape with you.
  2. Generate plugins/<YourPlugin>.rb (using the base-class HTTP/JSON/cache helpers — no raw Net::HTTP).
  3. Wire it into config.yml under plugins: and reference the output where you asked it to appear.
  4. Run bundle exec ruby ./scaffold.rb and verify the value rendered in _output/index.html.

Developer wiki

For the full plugin contract — base-class helpers, common patterns (HTTP, JSON, scrape, cache), Liquid rendering rules, and debugging tips — read plugins/README.md. It's the canonical reference the AI skill loads when it generates a plugin.


Get Started – Deploy on GitHub Pages

About Github Pages

GitHub Pages is a free hosting service provided by GitHub, designed for creating and publishing websites directly from a GitHub repository. It allows developers, designers, and anyone with a GitHub account to host personal, project, or organizational websites without needing external hosting services. GitHub Pages works seamlessly with GitHub repositories, automatically generating a static website whenever new content is pushed.

Step 1. Click the “Use this template” button at the top-right corner of the linkyee Template Repo -> “Create a new repository”:

image

Step 2. Check “Include all branches,” enter your desired GitHub Pages repo name, and click “Create repository” once finished:

image

The GitHub Pages repo name will affect the access URL. If you enter your-username.github.io as the Repo Name, that will be the direct URL to your GitHub Pages site. If you already have a your-username.github.io repo, the GitHub Pages URL will be your-username.github.io/Repo-Name.

Wait for the fork to complete. You might encounter deployment errors during the initial setup due to forked repo permission issues. Let’s proceed with the steps to adjust this.

image

Step 4. Go to Settings -> Actions -> General, ensure the following options are selected:

image

  • Actions permissions: Allow all actions and reusable workflows
  • Workflow permissions: Read and write permissions

After selecting, click the Save button to save your changes.

Step 5. Go to Settings -> Pages and ensure the selected branch for GitHub Pages is set to “gh-pages”:

image

The message Your site is live at: XXXX above is your public GitHub Pages access URL.

Step 6. Go to Settings -> Actions and wait for the first deployment to complete:

image

Step 7. Access the GitHub Pages URL to ensure the fork was successful:

image

Congratulations! Deployment successful. You can now modify the configuration files with your own data. 🎉🎉🎉

Please note that after each files modification, you need to wait for GitHub Actions to complete the Automatic build and pages build and deployment tasks.

image

Refresh the page for the changes to take effect. 🚀


Local testing

Build and serve the site on http://localhost:8080:

./preview.sh                    # build with the theme currently set in config.yml
./preview.sh minimal-mono       # temporarily switch to <theme-name>, build, serve;
                                # restores config.yml on Ctrl-C
PORT=4000 ./preview.sh          # use a different port

When you pass a theme argument, preview.sh makes a backup of your config.yml, switches to the requested theme for the session, and restores the original on Ctrl-C — your committed config is never modified.

Auto-rebuild on save

While the preview is running, preview.sh watches:

  • themes/
  • plugins/
  • config.yml
  • scaffold.rb

Any change triggers an instant rebuild — just refresh the browser. Install fswatch (brew install fswatch on macOS) for sub-second reaction; otherwise it falls back to a 1-second polling loop that works without any extra dependencies.

If a build fails (e.g. a broken Liquid reference), the watcher prints the error and keeps running — fix the issue, save again, the next save rebuilds.

Requirements

  • Ruby (bundle install once to fetch liquid and nokogiri)
  • Python 3 (or Ruby) for the static file server preview.sh spawns

Container deployment

Build and run the generated site with Docker Compose:

docker compose up -d --build

The service listens on port 8080 by default. Override it with PORT, and set REBUILD_INTERVAL in seconds when plugin data should be refreshed:

PORT=8081 REBUILD_INTERVAL=3600 docker compose up -d --build

The image contains the application source. A named Docker volume persists plugin cache data, while the generated output remains inside the container.


Custom Domain ❤️❤️❤️

You can set a custom GitHub Pages domain, such as my own: https://link.zhgchg.li.

Follow my tutorial for domain binding. If you'd like, you can purchase a domain through my Namecheap referral link — I'll earn a small commission, which helps me keep contributing to open-source projects.


Showcase ✨

Real websites built with linkyee — fast, clean, and open-source.

Built your own site with linkyee?
⭐ Add it here by opening a PR and inspire others!

PreviewWebsiteDescription
ZhgChgLilink.zhgchg.liZhgChgLi (Harry Li)'s Personal blog link page
-Your SiteYour site could be featured here 🚀

Donate

Buy Me A Beer

About

Other works

Swift Libraries

  • ZMarkupParser is a pure-Swift library that helps you to convert HTML strings to NSAttributedString with customized style and tags.
  • ZPlayerCacher is a lightweight implementation of the AVAssetResourceLoaderDelegate protocol that enables AVPlayerItem to support caching streaming files.

Integration Tools

  • XCFolder is a powerful command-line tool that converts Xcode virtual groups into actual directories, reorganizing your project structure to align with Xcode groups and enabling seamless integration with modern Xcode project generation tools like Tuist and XcodeGen.
  • ZReviewTender is a tool for fetching app reviews from the App Store and Google Play Console and integrating them into your workflow.
  • ZMediumToMarkdown is a powerful tool that allows you to effortlessly download and convert your Medium posts to Markdown format.

常见问题

What is linkyee?

linkyee is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by ZhgChgLi. A fully customized, open-source LinkTree alternative deployed directly on GitHub Pages. It has 148 GitHub stars.

Is linkyee safe to use?

Yes. linkyee passed SkillsLLM's automated security scan — a dependency vulnerability audit plus prompt-injection heuristics — with no high-severity issues. You can read the full report in the Security Report section on this page.

How do I install linkyee?

Clone the repository with "git clone https://github.com/ZhgChgLi/linkyee" and add it to your Claude Code skills directory (see the Installation section above).

What programming language is linkyee written in?

linkyee is primarily written in JavaScript. It is open-source under ZhgChgLi on GitHub, so you can review or fork the full source.

Are there alternatives to linkyee?

Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh linkyee against similar tools.

评论 (0)

暂无评论,成为第一个分享想法的人!

ECC

by affaan-m

10

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

242,21936,702JavaScript
AI 智能体ai-agentsanthropicclaude-code
查看详情
15

An agentic skills framework & software development methodology that works.

234,96620,863Shell
AI 智能体ai-agentsbrainstorming
查看详情

hermes-agent

by NousResearch

10

The agent that grows with you

234,43747,175Python
AI 智能体ai-agentsagent-orchestration
查看详情

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

185,94028,768JavaScript
AI 智能体ai-agentsanthropicclaude-code
查看详情

cc-switch

by farion1231

3

A cross-platform desktop All-in-One assistant for Claude Code, Codex, OpenCode, OpenClaw, Grok Build & Hermes Agent. Only official website: ccswitch.io

128,8688,826Rust
AI 智能体claude-codeai-tools
查看详情

claude-code

by anthropics

Claude Code is an agentic coding tool that lives in your terminal, understands your codebase, and helps you code faster by executing routine tasks, explaining complex code, and handling git workflows - all through natural language commands.

120,03119,897Shell
AI 智能体
查看详情

开发者还喜欢

基于喜欢此 Skill 的开发者投票和收藏

ECC

by affaan-m

10

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

242,21936,702JavaScript
AI 智能体ai-agentsanthropicclaude-code
查看详情
15

An agentic skills framework & software development methodology that works.

234,96620,863Shell
AI 智能体ai-agentsbrainstorming
查看详情

hermes-agent

by NousResearch

10

The agent that grows with you

234,43747,175Python
AI 智能体ai-agentsagent-orchestration
查看详情

n8n

by n8n-io

12

Fair-code workflow automation platform with native AI capabilities. Combine visual building with custom code, self-host or cloud, 400+ integrations.

201,88160,308TypeScript
MCP 服务器apisai-tools
查看详情

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

185,94028,768JavaScript
AI 智能体ai-agentsanthropicclaude-code
查看详情

cc-switch

by farion1231

3

A cross-platform desktop All-in-One assistant for Claude Code, Codex, OpenCode, OpenClaw, Grok Build & Hermes Agent. Only official website: ccswitch.io

128,8688,826Rust
AI 智能体claude-codeai-tools
查看详情