Set site widths and gutters

  • widths
  • layout
  • gutters
  • customizer
  • site-editing

Dirigible width settings control how wide the site, content column, and aligned blocks feel. Set these early so pages and headers share one rhythm.

Styles → Widths

  1. Go to Appearance → Customize → Styles → Widths.
  2. Set Gutters for horizontal padding around content.
  3. Set Max Site Width for the overall site ceiling.
  4. Set Content Width for the main reading column.
  5. Set Hero Content for hero copy width.
  6. Adjust Alignwide Max and Alignwide Min for wide-aligned blocks.
  7. Click Publish.

Header and footer span

  1. Open Appearance → Customize → Settings → General.
  2. Set Site Width to Full (header/footer edge to edge) or Wide (stay within the wide column).
  3. Publish.

Site Width pairs with Max Site Width and Content Width above — change them together when the masthead looks too narrow or too stretched.

Tips

  • Preview an interior page and a hero page after changing widths.
  • Pair with Choosing colors and fonts once the layout frame feels right.
  • Extreme content widths can make long paragraphs hard to read — keep Content Width comfortable for body copy.