Branching Tree website @sillylittle.tech and Redirect tool @kiya.party
A tiny, static link-tree + redirect template intended to be forked and customized.
Overview
grow/— Link-tree style static site (pure HTML/CSS/JS). Theme toggling usesdata-themeon<html>and is persisted inlocalStorage(/grow/script.js). Edit/grow/index.html,/grow/style.cssand/grow/script.jsto customize.magic/— Redirect bundle for Cloudflare Pages. Short links are declared in/magic/_redirectsusing the Cloudflare_redirectsformat. The Pages build output should be configured to use/magicso Cloudflare will process the_redirectsfile.- Root
index.htmlis a small landing page that links to both sections. There is no build system — this is plain static content.
Why use this as a template
- Minimal, easy-to-edit structure for personal link pages and short redirects.
- Keeps redirects and the public-facing listing together so site owners can update links in a single repo.
Quick start (local)
- Clone or fork this repository.
- Serve the repo locally to browse the pages:
# from repo root
python3 -m http.server 8000Open http://localhost:8000/ and click through grow/ and magic/.
Note: Local static servers will not process _redirects the way Cloudflare Pages does; /magic/index.html is a human-readable listing of redirects for local testing.
Customizing the Grow link tree
- Edit
/grow/index.htmlto change the profile, avatar, bio and link list. Preserve the.linkscontainer and.link-buttonmarkup.- Example: add a link inside the
.linkscontainer:
- Example: add a link inside the
<a href="https://example.com" class="link-button">
<span class="link-title">Example</span>
</a>- Theme variables live in
/grow/style.css. The JS in/grow/script.jssetsdata-themeon<html>and saves the selection tolocalStorage. If you rename variables in CSS, update the JS behavior accordingly.
Managing short links (Magic)
- Add redirects to
/magic/_redirectsusing Cloudflare's format:
/CODE https://destination-url.com 301
- Fields:
source destination [status]. The status is optional (e.g.301permanent,302temporary). - Example already present in
/magic/_redirects:/GH https://github.com 302(or similar). The/magic/index.htmlfile lists examples for humans.
Deploying to Cloudflare Pages
- Connect the repository to Cloudflare Pages.
- In Pages build settings set:
- Build command: (none)
- Build output directory:
/magic
- Deploy. Cloudflare will process
/magic/_redirectsand create the short links.
short.io integration (optional)
If you want to use a custom short domain (like go.example.com) instead of Cloudflare Pages path redirects, consider short.io (or a similar short-link provider). Typical steps:
- Register an account on short.io and add your domain (e.g.
go.example.com). - In your DNS provider, add the records short.io requires (usually a CNAME pointing
gotoc.short.ioor similar — follow short.io docs). Do NOT commit secrets or API keys to this repo. - Configure short.io to forward short codes to your destination URLs. short.io provides a dashboard and API for creating/updating short links programmatically.
Notes about choosing short.io vs Cloudflare redirects
- Cloudflare Pages
_redirectsis simple (source -> destination) and lives in the repo; it's ideal for static repo-driven redirects. - short.io gives you a branded short domain and analytics, and an API to create links dynamically (useful if you want programmatic short link creation outside the Pages workflow).
Contributing & conventions
- Keep changes minimal and static — avoid adding build tools without a clear reason.
- When editing links, prefer updating
grow/index.htmland/magic/_redirectstogether so the human-facing list and redirect behavior stay in sync. - Prefer inline SVGs for icons (the repo uses inline SVGs in the HTML); adding an external icon library is unnecessary for this small template.
Checklist before merging link/redirect changes
- Update
/grow/index.html(UI) if you add or remove short codes. - Update
/magic/_redirectsfor the actual redirect mapping. - Preview locally (open files or run a static server) and double-check HTML/CSS.
License
- BSD 3-Clause (see
LICENSE).