Skip to content

Wide

Main window on top, remaining windows arranged horizontally below. Ideal for ultrawide monitors where vertical space is limited.

Layout

1 window

┌───────────────────────────────────────────────────────────┐
│ │
│ │
│ │
│ │
│ │
│ │
│ │
│ 1 │
│ │
│ │
│ │
│ │
│ │
│ │
│ │
│ │
│ │
└───────────────────────────────────────────────────────────┘

2 windows

┌───────────────────────────────────────────────────────────┐
│ │
│ │
│ │
│ 1 │
│ │
│ │
│ │
│ │
├───────────────────────────────────────────────────────────┤
│ │
│ │
│ │
│ 2 │
│ │
│ │
│ │
│ │
└───────────────────────────────────────────────────────────┘

3 windows

┌───────────────────────────────────────────────────────────┐
│ │
│ │
│ │
│ 1 │
│ │
│ │
│ │
│ │
├─────────────────────────────┬─────────────────────────────┤
│ │ │
│ │ │
│ │ │
│ 2 │ 3 │
│ │ │
│ │ │
│ │ │
│ │ │
└─────────────────────────────┴─────────────────────────────┘

4+ windows

┌───────────────────────────────────────────────────────────┐
│ │
│ │
│ │
│ 1 │
│ │
│ │
│ │
│ │
├───────────────────┬───────────────────┬───────────────────┤
│ │ │ │
│ │ │ │
│ │ │ │
│ 2 │ 3 │ 4 │
│ │ │ │
│ │ │ │
│ │ │ │
│ │ │ │
└───────────────────┴───────────────────┴───────────────────┘

Stack windows share equal width. More windows means narrower columns.

Capabilities

  • Adjustable ratio: Yes - resize the main area
  • Adjustable nmaster: Yes - put multiple windows in main
  • Stateful: No

Configuration

spoon.Shoji:configure({
default_layout = "wide",
main_ratio = 0.5, -- Main area gets 50% of screen height
nmaster = 1, -- One window in main area
})

Main ratio

The main ratio controls how much vertical space the main area occupies. Bind hotkeys to adjust it dynamically:

spoon.Shoji:bindHotkeys({
increase_main_ratio = { { "ctrl", "alt" }, "=" }, -- Taller main
decrease_main_ratio = { { "ctrl", "alt" }, "-" }, -- Shorter main
})

30% main ratio

┌───────────────────────────────────────────────────────────┐
│ │
│ │
│ 1 │
│ │
│ │
├─────────────────────────────┬─────────────────────────────┤
│ │ │
│ │ │
│ │ │
│ │ │
│ │ │
│ 2 │ 3 │
│ │ │
│ │ │
│ │ │
│ │ │
│ │ │
└─────────────────────────────┴─────────────────────────────┘

70% main ratio

┌───────────────────────────────────────────────────────────┐
│ │
│ │
│ │
│ │
│ │
│ 1 │
│ │
│ │
│ │
│ │
│ │
├─────────────────────────────┬─────────────────────────────┤
│ │ │
│ │ │
│ 2 │ 3 │
│ │ │
│ │ │
└─────────────────────────────┴─────────────────────────────┘

Multiple masters

Increase nmaster to share the main area. With nmaster = 2, main windows sit side-by-side on top:

nmaster = 2 (with 3 windows)

┌─────────────────────────────┬─────────────────────────────┐
│ │ │
│ │ │
│ │ │
│ 1 │ 2 │
│ │ │
│ │ │
│ │ │
│ │ │
├─────────────────────────────┴─────────────────────────────┤
│ │
│ │
│ │
│ 3 │
│ │
│ │
│ │
│ │
└───────────────────────────────────────────────────────────┘

When to use

Wide layout shines on:

  • Ultrawide monitors (21:9 or wider) with abundant horizontal pixels
  • Laptop screens with limited vertical space
  • Video editing and timeline-based workflows
  • Horizontal content like spreadsheets or logs

Wide vs Tall

AspectWideTall
Main positionTopLeft
Stack directionHorizontalVertical
Best forUltrawide, short screensStandard, tall screens

Mirrored wide

Prefer the main window on the bottom? Use the Mirror modifier:

local Modifiers = require("layouts.modifiers")
local Mirror = require("layouts.modifiers.mirror")
local Wide = require("layouts.wide")
local wideBottom = Modifiers.wrap(Wide, Mirror.vertical(), {
name = "wide-bottom",
displayName = "Wide (Bottom)",
})

Mirrored result (3 windows)

┌─────────────────────────────┬─────────────────────────────┐
│ │ │
│ │ │
│ │ │
│ 2 │ 3 │
│ │ │
│ │ │
│ │ │
│ │ │
├─────────────────────────────┴─────────────────────────────┤
│ │
│ │
│ │
│ 1 │
│ │
│ │
│ │
│ │
└───────────────────────────────────────────────────────────┘