About this plugin
Editorial Blocks adds magazine blocks and news blocks to the WordPress block editor: a post grid, a post list, a featured post group, a hero post and an author list. They are the layouts a blog, magazine, newspaper or news site needs on its homepage, category pages and landing pages.
See example website — the Evermag demo homepage is built with these blocks.
See more demos: all Evermag demos, from a local news site and sports news to food and fashion magazines, each front page built with Editorial Blocks.
The plugin adds blocks and nothing else. There is no settings page, no dashboard widget and no onboarding wizard — you add a block, set it up in the sidebar like any core block, and you are done.
Why not just use the Query Loop block?
WordPress already ships the Query Loop block, and it is a good tool for building a post layout from parts: a Post Template, a Post Title, a Post Featured Image, a Post Date, then columns, groups and spacing, assembled by hand. Editorial Blocks is for when you would rather not build at all.
- Advanced magazine layouts, ready-made. A lead story with a rail of headlines beside it, the classic three-column newspaper homepage, a hero with the headline over the image, a post list that turns into cards on a phone. With Query Loop these take several nested blocks, two queries and an offset — here each one is a single block.
- Choose, don’t build. You pick the layout, the column count and the posts from the sidebar. There is no post template to assemble and nothing to nest.
- Stable, fixed layouts. The structure belongs to the block, so it cannot be pulled apart by an accidental drag in the editor, and the same block looks the same on every page you put it on.
- Responsive out of the box. Separate column counts for desktop, tablet and phone, and thumbnails that give way before headlines do, so a title is never squeezed into a column of single words.
- Already styled. Bylines with author avatars, dates, categories, comment counts, image ratios, title sizes and section headings are done for you — while fonts, colours and heading sizes still come from your theme.
Blocks
- Post Grid — posts as a grid of cards, with a column count each for desktop, tablet and phone.
- Post List — posts as a list of rows, each with a thumbnail beside the text, or as stacked cards on a phone.
- Post Group — a featured cluster: one lead story with the rest of the posts beside it, either as a single rail or as the classic three-column homepage layout with the lead left, centre or right.
- Hero — one story, shown large, with the image above the text, beside it, or behind it.
- Authors — a grid of author cards, each with an avatar, bio and latest post.
Choosing the posts
Every block picks its posts the same way: by number, category, tag, author, or an explicit list of post IDs — and each of those can be excluded as well as included. Post Group and Hero can also take their lead story from somewhere else entirely, such as your sticky post or the newest post in one category, and the block will make sure that story does not then repeat further down.
Section headings
Every block can carry a heading above it — “Latest news”, with a “See all” link beside it — set in the block’s Heading panel. Leave the text blank, which is how a block starts, and no heading is shown at all. The heading can be aligned left, centre or right, and can have a rule above it, below it, or running along beside the words.
Post titles
Post Grid and Post List let you set how big a card title is — small, medium, large or huge — and, separately, which heading level it prints as. They are two different questions: the size is how the title looks, the heading level is where it sits in the page’s outline. So a small title can still be an h2.
Leave the size on Default and the title keeps whatever size your theme gives that heading.
Notes
Blocks render on the server, so a block always reflects your posts as they are right now — editing or publishing a post updates every block that shows it, with nothing to re-save. It is also the same code that draws the editor preview, so what you see while editing is what the page will show.
The blocks come laid out and styled, but inherit fonts, colours and heading sizes from your theme, so they look native rather than bolted on.
Credits
The comment icon is “message-circle” from Feather by Cole Bemis, used under the MIT licence.
Recommended Theme
The blocks work with any theme. They lay themselves out and inherit fonts, colours and heading sizes from whatever theme you run, so there is nothing to match up and no theme you have to switch to.
org:
- Evermag
- Stoat
- Rural Blog