Download Plugin

Max Width Extension

Written by

in

Overview

The Max Width Extension allows you to control the maximum width of any WordPress block, constraining content for better readability and layout control. Essential for creating well-proportioned, professional layouts with proper content width limits.

Key Features

  • Custom Max Width: Set precise width limits in pixels or percentages
  • Theme Integration: Use theme content width settings
  • Alignment Options: Center, left, or right align constrained blocks
  • Responsive Widths: Different max widths per breakpoint
  • Unit Flexibility: px, %, vw, rem, em support
  • Works with All Blocks: Apply to any WordPress block

How to Use

  1. Select any block
  2. Find Max Width setting in sidebar
  3. Enable Custom Max Width
  4. Enter width value and unit
  5. Choose alignment (center, left, right)
  6. Configure responsive widths if needed
  7. Preview layout

Settings

Width Settings

  • Max Width: Maximum width value
  • Unit: px, %, vw, rem, em
  • Use Theme Width: Match theme content width
  • Alignment: How to align when width is constrained

Responsive Settings

  • Desktop Max Width: Width on large screens
  • Tablet Max Width: Width on medium screens
  • Mobile Max Width: Width on small screens (often 100%)

Common Width Values

  • 640px: Optimal for reading text (60-75 characters)
  • 768px: Tablet-friendly content width
  • 960px: Standard desktop content width
  • 1140px: Wide content, theme default
  • 1200px: Extra wide content
  • 100%: Full width of parent container

Best Practices

  • Use 640-680px for long-form text content
  • Center-align constrained blocks for balance
  • Use theme width for consistency
  • Set mobile max width to 100% or 95%
  • Consider reading comfort – avoid very wide text
  • Use max-width on paragraphs, headings, lists

Common Use Cases

  • Article Content: Constrain to 680px for readability
  • Forms: Limit width to 600px for better UX
  • Headings: Match text content width
  • Buttons: Prevent overly wide buttons
  • Nested Content: Control width within wide sections

Typography & Max Width

Optimal line length for readability:

  • 45-75 characters: Ideal line length
  • 640px: Works for most font sizes (16-18px)
  • Smaller fonts: May need narrower max-width
  • Larger fonts: Can use wider max-width

Troubleshooting

  • Content too narrow: Increase max-width value
  • Not centering: Check alignment setting
  • Responsive issues: Set appropriate mobile widths
  • Conflicting with theme: Use theme width or adjust parent container

More posts