Skip to main content
Prime Direction

Reading Mode

Break has two ways to lay out a page. In Columns the sections of a page stand side by side and the page moves from left to right. In Scroll the same sections stack and the page moves down, like any other website.

Columns is the default. Readers can switch to Scroll for themselves, and you can turn Columns off for everyone.

Where Columns Applies#

The sideways layout needs room. A page reads sideways only when all of these are true:

  • the browser window is at least 992 pixels wide
  • the window is wider than it is tall (landscape)
  • the window is at least 600 pixels tall
  • the reading mode is Columns

Everywhere else the sections stack. That covers phones, tablets held upright, short windows and every reader who chose Scroll.

PageReading mode
The front pageFollows the reader's choice
Archives: /blog/, tag and author pages, /projects/, /issues/Follows the reader's choice
Pages the theme builds by slug, such as live, video, podcast, markets and archiveFollows the reader's choice
PostsAlways Scroll
Ordinary pagesAlways Scroll

Posts and ordinary pages are always read top to bottom, whatever the reader picked. On those pages the reading mode row in the settings panel shows Scroll and cannot be changed.

Moving Through a Sideways Page#

On a sideways page the mouse wheel moves the page left and right. Trackpad swipes and the left and right arrow keys work as usual. Page Down and Space jump to the next section, Page Up and Shift + Space to the previous one. Home and End go to the start and the end of the page.

Some sections hold a list that is taller than the window, such as the wire. The wheel scrolls that list first and moves the page on once the list reaches its end.

The Bottom Bar#

A bar along the bottom of the window shows where the reader is on the page. It is there in both modes.

PartWhat it shows
ArrowsJump to the previous or next section
TrackA thumb that moves with the reader's position. Click the track to jump there
PercentageHow far through the page the reader is
Section labelThe name of the section in view, for example Live updates or Reading
CounterThe section's place in the page, for example 03 / 12

On a post with headings, the middle of the bar also shows the heading being read. See Table of Contents.

On a page with a single section, the arrows and the counter are hidden.

The Reader's Choice#

Readers switch between the two modes in two ways:

  • the Reading mode row of the settings panel, opened from the gear icon in the top bar
  • the r key, on any page that follows the reader's choice

The choice is kept in the reader's own browser and applies to every page and every later visit. It is not tied to a member account, so a reader on a second device starts with Columns again. See Reading Preferences.

Turning Columns Off for Everyone#

If you want a vertical site, add reading-columns to Disabled features.

  1. Go to ⛭ Settings → Design
  2. Click Customize
  3. Open the Theme tab
  4. Add reading-columns to Disabled features, separated from the other values by a comma
  5. Click Save

Every page then stacks its sections on every screen. The Reading mode row disappears from the settings panel, and the r key does nothing. The bottom bar stays. See Features.

Notes#

  • The sideways layout depends on the window, not the device. A laptop window made narrow or short switches to the stacked layout at once, and back again when it grows.
  • The section headings of the front page run up the left edge of each section on a sideways page and sit above the section when it stacks.
  • A section with nothing to show is left out of the page and out of the counter. See Front Page Overview.