How to design, publish, and sell your seating chart

Step 1

Draw the room

Open the designer, or practice in the demo above. Add tables with the buttons above the canvas and drag them into place.

• Round table and long table seat guests around the edge; row of seats is theater style.
• Click a table to edit its label, seats, and price in the side panel. Use a tier, or give the table its own price, per seat or as a whole.
• Add a grid lays out rows and columns of tables in one step. The easiest way on a phone.
• Tables snap to the grid and line up with guides as you drag.
• Drag a box or shift-click to select several tables and move them together. R rotates.
• Everything autosaves in your browser; Ctrl+Z undoes.
• Import and Export save and load a design as a file.
• Photo to chart turns a photo of your floor plan into tables you can adjust.

Step 2

Price the seats

Make price tiers in the panel, Standard, Premium, VIP, each with its own price and any color you like, and assign tables to them. Tap a seat in the table panel to give just that seat its own tier or its own price. The room summary totals what the room is worth if every seat sells.

Discounts are optional and yours to set: a percent off a fully booked table, or a percent off bulk orders of so many seats. Guests see the offer and the discount line at checkout; the bigger of the two applies.

Step 3

Publish it

Publishing needs a free account. Press Publish & preview in the designer and you get a booking link like seat-layer.com/book?chart=chart-xxxxx. Republishing updates the chart in place; sold seats stay sold.

Step 4

Share the booking link

Send the link to your guests or put it in the invitation. They tap a table, pick their seats, and pay. Taken seats gray out live, so two guests can never buy the same seat.

Sales land on your account page as they come in.

Step 5

Get paid

Without payment keys the checkout runs in demo mode: seats reserve, no money moves. Connect Stripe, PayPal, or Square and the same checkout takes real cards; guests get an email confirmation with their seats and reference.

Extra

Put the seat picker on your own website

You can embed the live seat picker on your own site. Two lines of script:

<div id="seats"></div>
<script src="https://seat-layer.com/seatlayer-sdk.js"></script>
<script>SeatLayer.mount("#seats", { chartId: "chart-xxxxx" });</script>

The server operator has to allow your site's address first (the SEATLAYER_ALLOWED_ORIGINS setting). The full reference is in the repository's sdk/ folder.