Container Width

Feed theme features a flexible layout with customizable content and sidebar widths. The theme’s default widths are carefully chosen to provide comfortable reading while maintaining properly sized navigation and widget areas.

Default Settings

The theme uses three main width variables:

• Content area (--layout--content--width): 640px
• Navigation sidebar (--layout--sidebar-navigation--width): 240px
• Widgets sidebar (--layout--sidebar-widgets--width): 360px

The content area controls the width of your main content, the navigation sidebar determines the size of your site navigation, and the widgets sidebar controls the width of the sidebar containing widgets and additional content.

Customizing Width

To modify these widths, you’ll need to add custom CSS code.

<style>
  body {
    /* Increase content area width to 720px */
    --layout--content--width: 720px;
    
    /* Adjust navigation sidebar width to 220px */
    --layout--sidebar-navigation--width: 220px;
 
    /* Adjust widgets sidebar width to 340px */
    --layout--sidebar-widgets--width: 340px;
  }
</style>

You can adjust these values to any width that works for your content. Just remember to maintain a reasonable reading width for optimal user experience.

Tips

• Keep readability in mind - extremely wide content areas can make text harder to read
• Test your changes across different screen sizes
• Ensure sidebar widths are appropriate for your navigation and widget content
• Use pixels (px) for precise control