play.html, served at the /play path of any ClickHouse HTTP port) can keep chosen columns of a result visible while the rest of the table is scrolled sideways. A pinned column sticks to the near edge of the result area instead of scrolling away, so a key column — an identifier, a name, a date — stays in view next to whichever far-right columns you are reading.
Pinning a column
A 📌 pushpin icon appears at the left of every column header. Click it to pin the column; click it again to unpin it. The icon is a real button, so keyboard users can tab to it and toggle it with the keyboard, and it exposes its pinned state to assistive technology. On devices with a hovering pointer (a mouse) the icon is shown only while the header is hovered or the toggle is focused, so it stays out of the way otherwise; on touch and other coarse-pointer devices, which have no hover, the icon is always shown so it can be tapped directly. A pinned column keeps its icon shown at full strength as an indicator that the column is pinned.When pinning is available
Pinning is offered only when the table is wide enough to scroll horizontally. When the whole table fits in the viewport there is nothing to scroll away from, so the pin toggle is disabled and excluded from the keyboard tab order. As soon as the result becomes horizontally scrollable — a wide result, a narrow window, or a horizontally growing streamed result — the toggles become active.How a pinned column behaves when scrolling
A pinned column slides with the content during horizontal scrolling until it would leave the viewport, at which point it sticks to the near edge — the left edge for columns on the left, the right edge for columns on the right — and stays visible. Several pinned columns stack against the edge in their original order, each delimited from the scrolling content by a border. A pinned cell paints over the ordinary cells scrolling underneath it, including a selected cell, so it always stays readable.Shared across a result
Pins are tracked by column name and shared across the result tables that belong to one result — aRun all (multi-query) run renders one table per statement, and all of them share the same pinned set — the same way the per-column color coding modes are. Pinning a column named id in one of those tables keeps a column named id pinned in the others and in later runs of the same query that return the same column.
The pinned set belongs to the result it pins: to the query tab, and within a tab that is a notebook to the individual cell. Pinning a column in one cell therefore leaves the other cells — and the other tabs — with their own independent pins.
Persistence
The pinned set is remembered in the page URL, in the browser history, and in the result snapshot of the cell it belongs to, so reloading the page, sharing the link, or navigating back and forward preserves it. Toggling a pin in a cell that does not currently hold the editor updates that cell’s saved copy too, so the state survives a reload. Only pinned columns are stored — an empty set adds nothing to the URL or history state — to keep them compact.Limitations
- The vertical (transposed) single-row layout has no horizontally scrolling columns, so it offers no pinning.