the full tutorial

everything from building your page to hosting it on your own domain with music and live discord presence.

1build your page

go to the builder and customize everything: your name, bio, avatar, background, buttons, colors and effects. the preview on the right updates live — what you see is exactly what visitors get. when you're happy, hit download source code. you get a single index.html file that is your entire website. you own it, no watermarks, no accounts.

2add music (custom audio)

your song needs to be a direct file link (ends in .mp3 or .ogg) — a youtube or spotify link won't work.

  1. get your song as an mp3 file on your pc.
  2. upload it to a file host that gives direct links — catbox.moe is free, no account needed, and gives you a link like https://files.catbox.moe/abc123.mp3.
  3. paste that link into the audio file URL box in the builder.

keep the click to enter screen on — browsers block music from autoplaying until the visitor clicks something, and the entry screen is that click. the volume slider appears in the bottom-left corner of your page.

3custom backgrounds

4discord lanyard setup (live presence)

lanyard is a free API that broadcasts your discord presence — what you're listening to on spotify or the game you're playing shows up on your page live.

  1. join the lanyard discord server: discord.gg/lanyard. you must stay in the server — that's how the API tracks your presence.
  2. get your discord user ID: discord settings → advanced → turn on developer mode. then right-click your own name anywhere and hit copy user ID.
  3. in the builder: tick enable live discord presence and paste your ID.
  4. for spotify to show up, connect spotify to discord (discord settings → connections) and have "display current activity" on.

your page checks the API every 15 seconds — a green/yellow/red dot next to your name shows your discord status, and a card appears with your current song (with album art) or game.

5host your website for free

your downloaded index.html can be hosted anywhere. easiest free options:

option A — netlify drop (easiest, no account git stuff):

  1. put your index.html in an empty folder.
  2. go to app.netlify.com/drop and drag the folder onto the page.
  3. done — you get a live link like something.netlify.app instantly.

option B — github pages:

  1. make a free account at github.com.
  2. create a new public repository named yourusername.github.io.
  3. upload your index.html (add file → upload files).
  4. your site is live at https://yourusername.github.io within a minute or two.

option C — cloudflare pages: free account at pages.cloudflare.com → create a project → direct upload → drag your folder in. great if you also want your domain on cloudflare (next step).

6put your own custom domain on it

  1. buy a domain from a registrar — namecheap, porkbun, or cloudflare registrar (cheapest, at-cost pricing). a .xyz or .lol domain is usually only a few dollars a year.
  2. connect it to your host:
    • netlify: site settings → domain management → add custom domain → follow the DNS instructions it shows you (you'll add a CNAME record at your registrar pointing to your netlify site).
    • github pages: repo → settings → pages → custom domain, then at your registrar add a CNAME record pointing www to yourusername.github.io.
    • cloudflare pages: project → custom domains → add — if your domain is already on cloudflare it's literally one click.
  3. enable HTTPS — all three hosts give you a free SSL certificate automatically, just make sure "force HTTPS" is on.
  4. DNS changes can take a few minutes up to a couple hours to go live.

7editing the source code yourself

the file you downloaded is normal HTML/CSS/JS — open it in notepad or VS Code. all your settings are in one place near the middle: look for const CFG = {...}. you can change any value there (colors, links, your bio, the audio URL) and just save + re-upload. everything is commented and self-contained, nothing to install.

8need help? find ticky