The widget library for WordPress is here Download plugin

Full-Width List Cards Grid

Free

Organize your content with the Editorial List Grid, a sophisticated layout widget inspired by high-end financial and design publications. This widget abandons the traditional vertical card approach in favor of wide, horizontal panels that provide ample breathing room for typography.

The layout is built on a responsive 2x2 grid system. The Top Left quadrant features a prominent, high-impact headline. The Top Right houses a minimalist SVG directional arrow that serves as the call-to-action (CTA). The Bottom Left displays metadata (like dates or categories) in uppercase, while the Bottom Right contains a concise summary paragraph.

This spatial arrangement creates a balanced, rhythmic reading experience. The aesthetic uses a soft "Bone" or "Beige" color palette (#f0ede6) with subtle borders, making it perfect for roadmaps, article lists, changelogs, or feature breakdowns.

Key Features:

  • Full-Width Horizontal Layout: Maximizes horizontal screen real estate for a premium editorial feel.
  • Quadrant Grid System: precise placement of headline, arrow, date, and description for visual balance.
  • Minimalist Aesthetic: Features a soft beige color scheme with thin, elegant borders.
  • Hover Interaction: Subtle lift effect and arrow movement on hover provide tactile feedback.
  • SVG Directional Icons: Clean vector arrows that are fully editable via the link attribute.
  • Fully Editable Typography: All text elements support data-font-size-editable and data-family-editable.
  • Mobile Stack: Gracefully transforms into a vertical stack on smaller screens for continued readability.

How to use this widget

  • Change your content and adjust the styles to match your design
  • Click export and copy the code
  • Paste it on your web page by adding a code/html block in your website builder (e.g., Squarespace, WordPress, Webflow, Wix) and paste the code.

👋 P.S. Have questions? Leave a comment.