Code pages
A code page is your coin page written in HTML and CSS. You decide the layout, the type and the colors, section by section, and your coin's identity, live numbers, Buy button and installed apps go where you put them. There is no JavaScript to write, and nothing on the page can break the parts of the coin page that are ours.
| Plan | |
|---|---|
| Code pages | Pro |
Your tiles are kept. Going back to them is one button, and your code stays saved.
Open the editor
- Open your coin manager: account button, My Coins, Manage.
- Press Code in the top bar, beside Style.
You should see the editor: your HTML on the left, your CSS beside it, and a preview that redraws as you type, at desktop and phone widths. Owners and managers can open it; the plan is the owner's.
Start from a template, or from your tiles
On a blank page the editor offers Templates: complete one-page coin sites you edit from. Each has a nav, a hero with your price, market cap and a copyable contract address, a roadmap, a story, tokenomics, how to buy, your chart and live trades, and a community section. Pick one, then change the words, the colors and the order.
- Hood: bright accent, cream and ink, bold display type.
- Trenches: dark, one neon accent, mono labels, chart first.
- Minimal: light, lots of space, thin rules.
From tiles writes your current page out as HTML and CSS instead, so you start from a page that already looks right.
What you write
Plain HTML and CSS, plus four tags of ours. The full reference is Code pages in the developer docs; the short version:
| Tag | Shows |
|---|---|
<cd-identity> | Your coin's identity: logo, name, chain and address. Every page has exactly one. |
<cd-app app="core-dexchart"> | An app you have installed, drawn in the box your CSS gives it. |
<cd-data bind="market.price" format="usd"> | A live value: price, market cap, holders, supply, your address and more. |
<button cd-action="buy"> | Our buy sheet. Also copy-address, sign-in and connect-wallet. |
Links to sections of your own page work with anchors (<a href="#tokenomics">). CSS can use @media, @container, @supports and @keyframes; nothing can be fixed or sticky, and scripts, forms, iframes and inline styles are not kept. The editor lists each line it dropped and why.
The page responds to its own width, so size for the phone first and add @container page (min-width: 700px) steps for wider screens.
Fonts
Write a font by name in your CSS and we serve it: font-family: "Bangers", Impact, sans-serif. The editor's Fonts list shows every family you can use, display faces and body faces. Fonts from elsewhere are not loaded.
Images
Upload from the editor's Images panel, then Insert or Copy URL. Uploads count toward your page storage. An <img> can also point at an image hosted elsewhere.
Apps on a code page
A <cd-app> draws an app you have installed from Apps. Install the app first; the page then fills the box. A box with no size from your CSS is drawn at the app's smallest size, and the editor says so.
Preview, publish, and back to tiles
- Save keeps a draft only you see.
- Publish makes the code page your coin page. Publishing needs exactly one
<cd-identity>and no blocking issues. - Use tiles puts your tiles back and keeps the code saved, so you can return to it.
Your HTML and CSS can each be up to 64 KB.
Related
- Look, Layouts & Game Layout: tiles, layouts and the style editor
- Code pages: the full reference for the four tags, fonts and images
- Apps on your own site: your coin's card and apps on a site you host yourself