page webring

in autumn 2025, as the leaves fell and the air turned crisp, teens in Hack Club spent 2 months designing and making their own personal website, as part of the personal site ysws event. these sites gave an outlet for them to showcase themselves, their hobbies and their interests to the world.

this webring is a collection of those personal websites, so people (like you!!) can go explore, find new friends, and get inspiration for making your own personal site.

join

made a personal website? part of hack club? dm @gideon to get added!

you should include:

your preferred name or username
a link to your amazing personal website
an 88x31 button! either as an image, or a link to it hosted on your website

don’t have a button yet? make one! you can use a design tool like Figma, a pixel art editor like Aseprite, or generate one online, for example here or here. make sure it’s an image 88px wide and 31px tall, and remember to be creative!

include

next you want to include the webring on your personal website! it’s super easy, just add this script tag to the very end of your website’s body:

<script src="https://pagering.gideon.sh/embed.js"></script>

then, wherever you want the webring link to appear in your page, add:

<pagering-link></pagering-link>

there are also some extra options you can configure:

theme: the colour of the link - if your website always has a light or dark background, set this to ‘light’ or ‘dark’

<pagering-link theme="dark"></pagering-link>

api

don’t worry be api 🙂

GET /to/*: navigate to these pages to redirect to members of the webring

# GET /to/random     → to a random member
GET /to/random
# GET /to/[id]       → to a specific member
GET /to/acon
# GET /to/[id]/next  → to the next member
GET /to/acon/next
# GET /to/[id]/prev  → to the previous member
GET /to/acon/prev

302 Found

GET /api/v1/members: get all members of the webring

GET /api/v1/members

200 OK
[
  {
    "id": "acon",
    "name": "acon",
    "url": "https://aconlin.com",
    "buttonUrl": "/buttons/acon.gif"
  },
  ...
]

GET /api/v1/members/[id]: get a specific member by id, and the previous and next members

GET /api/v1/members/acon

200 OK
{
  "current": {
    "id": "acon",
    "name": "acon",
    "url": "https://aconlin.com",
    "buttonUrl": "/buttons/acon.gif"
  },
  "prev": { ... },
  "next": { ... }
}

GET /api/v1/embed: get all members, and the current, previous, and next members for the current site.

If you’re calling this from a server, set your ‘Origin’ header to your site’s URL (including http:// or https://)

GET /api/v1/embed
# provided by your browser :)
Origin: https://aconlin.com

200 OK
{
  "current": {
    "id": "acon",
    "name": "acon",
    "url": "https://aconlin.com",
    "buttonUrl": "/buttons/acon.gif"
  },
  "prev": { ... },
  "next": { ... },
  "members": [ ... ]
}

made with 🩶 and 💻 in hack club by heygideon. personal website ysws by acon.