urlu

Put Multiple QR Codes on One Shareable Page

When you need separate scans for menu, booking, Wi-Fi, and social links, publish one urlu document with a grid of QR images.

Updated: 2026-08-18 · 7 min read

When to combine QR codes

At booths, café tables, or office corridors you often have more than one scan target but limited space for separate stickers. urlu document publishing (/posts/{id}) lets you lay out a grid of QR images in HTML and share a single URL—print it once or send it in chat.

Each image is rendered live by /api/qr, so you never upload QR files. When a destination changes, PATCH the document; the public link (id) stays the same.

How to structure the page

In your HTML document, use this pattern.

  • Wrap each QR in a <figure> with <img src="/api/qr?…">, width, height, and alt.
  • Place figures inside a div with grid grid-cols-1 sm:grid-cols-2 (or 3) and gap-6.
  • Add a short label in <figcaption>—Menu, Wi-Fi, etc.
  • For URL QR codes, URL-encode the data= value. For Wi-Fi, use type=wifi with ssid and password.
  • If the scroll gets long, use the deck class instead of a grid: one QR fills the screen at a time, and a ‹ 1 / 2 › pager below it — drawn by the site, so the document only writes the panels — steps through them (ai-authoring.md section 4.2).

Building it from the home page

You do not have to write HTML. On the home page, pick the QR tab and switch to ‘Several’: add as many QR entries as you need, choose the grid or paged layout, and publish the page in one click.

Each entry keeps its own content type (URL, Wi-Fi, text, …) and label, and the panel previews exactly what will be published. Publishing hands back the share link and its edit token.

Publishing with AI or API

Agents and scripts should follow public/ai-authoring.md section 6.5. POST the HTML file to /api/posts to receive a share URL and editToken.

In the browser, use the QR tab's ‘Several’ mode or /write with HTML format, or ask an AI to ‘publish QR grid HTML per ai-authoring.md 6.5’.

Operations tips

Beyond six QR codes, a three-column grid often fits more above the fold on desktop; mobile stacks to one column automatically.

Use the grid when codes are compared side by side, the paged deck when each one is scanned on its own — a deck also prints one QR per sheet.

Shorten long URLs with /api/shorten before encoding them—simpler patterns scan better on print.

Pages with Wi-Fi passwords should use expiresIn or be deleted with editToken after the event.

← All guides