Sapling Grid for Elementor: A Blog Grid That Does Not Need a Theme

October 14, 2026
·
Shahidul Islam
Sapling grid for Elementor showing posts in three columns

Every theme ships a blog layout, and every theme’s blog layout is slightly wrong for the site it ends up on. The card is too tall, the date is where the category should be, the excerpt runs to forty words when twenty would do. Fixing it means a child theme and a template file.

A sapling grid moves that decision into the page. Columns, gaps, which fields show, how long the excerpt runs and how the card looks are all controls, so the blog section matches the page it sits on instead of the theme it inherited.

Sapling grid for Elementor in three columns
Three columns with image, category, title and excerpt, all switchable.

Where a sapling grid fits

  • Blog index sections on a home page, showing the three most recent posts.
  • Category landing pages, where the grid is queried to one topic.
  • Knowledge and resource hubs that group articles under headings.
  • News sections on corporate sites, where the date matters more than the image.
  • Case study listings, with the excerpt doing the summarising.
  • Author pages, filtered to one writer.

Why it beats the usual approach

ApproachWhat it costs you
Theme blog templateStyling lives in the theme, so every change is a code change
Elementor Posts widgetFewer field level switches, and the card styling is coarser
Hand built cardsThey do not update when a post is published
Sky Addons sapling gridEvery field switchable, every surface styled, queries stay current
Sapling grid as a travel grid and as yellow cards
Two grids from one widget: light travel cards, and tight yellow cards.

The features that decide it

Every field is a switch. Show Title, Show Image, Show Category, Show Author, Show Text, Show Date and Show Pagination turn on independently, so a news list and a photo led grid come from the same widget.

The excerpt is trimmed properly. Text Limit sets the word count, and Strip ShortCode keeps shortcode output from leaking into the summary, which is the usual cause of a card full of stray markup.

Layout is yours. Columns, Row Gap and Column Gap are separate, so a dense archive and an airy feature section are both a few numbers apart.

Cards are real surfaces. Padding, content padding, border, border radius, background and box shadow all have Normal and Hover states, so hover can lift a card rather than just tint it.

Video posts are handled. Show Video and the Video Settings section deal with posts whose feature is a video rather than an image, including the play button styling.

Sapling grid as a single column on a phone
At 390px the grid becomes one column, image on top, excerpt trimmed.

How to build one

  1. Decide what the reader needs on the card. Usually title, category and date; often not the author.
  2. Set Columns for desktop, then check tablet and phone. Three, two, one is a safe ladder.
  3. Set Text Limit. Twenty words is enough to say what a post is about.
  4. Style the card in the Normal tab first, then add one hover change, not three.
  5. Set Row Gap slightly larger than Column Gap. It reads better when cards have text of different lengths.
  6. Turn Show Pagination on only if the grid is the page rather than a section of it.

Why it works on a marketing page

A blog section on a sales page has one job: prove the site is alive and that somebody here knows the subject. Three current posts with real titles do that in a band across the page.

Three current posts with real titles prove the site is alive. That is the whole job of a blog section on a sales page.

Because the grid reads a query, it stays true without anybody remembering to update it. The section is written once and keeps being accurate, which is the difference between a blog section that helps and one that quietly ages.

Sapling grid as a dated list without images
The same widget with images off: a dated list that reads as news.

Choosing which fields to show

Every field you add makes the cards taller and the grid harder to scan, so the useful question is what the reader loses if it goes.

Category usually earns its place, because it tells a reader whether a post is for them before they read the title. Date earns it on news and release notes, and costs you on evergreen guides, where a year old date reads as stale even when the content is current.

Author earns it on sites where the writer is part of the offer, such as consultancies and agencies, and is noise almost everywhere else. Excerpts are the one people over use: a good title does most of the work, and twenty words of summary underneath often repeats it.

My default for a marketing page is image, category, title, and nothing else. For an archive where people are hunting, add the date and the excerpt.

Keeping the grid even

Uneven card heights are the main way a blog grid looks unfinished, and they come from content rather than from the widget. Two line titles next to one line titles, excerpts that stop mid sentence, and one post without a featured image will all break the rhythm.

Trimming the excerpt to a word count fixes most of it, because the text block becomes a predictable height. Setting a consistent image ratio fixes the rest. Where a post has no featured image, decide deliberately: either enforce one editorially, or switch images off for that grid so the absence is not visible.

Titles are the hard case, since they are written for search rather than for a card. Rather than truncating them, which loses meaning, give the card enough padding that a two line title still sits comfortably against a one line neighbour.

Deciding how many posts to show

Three is the right number for a home page band, because three cards fill a row and nobody has to scroll to understand what the section is. Six works when the grid is the reason for the page, such as a category landing page, since two rows still read as one block.

Nine and twelve are where grids start to feel like archives, and that is a decision rather than an accident. An archive wants pagination and a full set of fields; a section wants a link to the archive and nothing more.

There is a performance argument too. Each card carries a featured image, and a twelve card grid above the fold is twelve images the browser fetches before anything else finishes. Keeping the count low and the images sized for the card is the cheapest speed work available on most pages.

Where a site publishes rarely, a grid of three exposes that immediately: the newest post is from eight months ago and now it is on the home page. In that case a curated query, limited to evergreen posts, is more honest than a recent one.

Using the grid as an archive replacement

The default WordPress archive is a theme template, which means it looks like the theme and not like the rest of the site. Rebuilding it as a page with a sapling grid puts the archive on the same design system as everything else.

The mechanics are straightforward. Build a page, drop the grid, query the post type or category, and turn Show Pagination on so the page behaves as an archive should. Then point the menu at that page rather than the default archive URL.

Two things to watch. The first is that a page based archive is a separate URL from the theme archive, so internal links and any existing search presence should be pointed at one of them, not split across both. The second is ordering: an archive that shows posts in a curated order rather than by date will confuse anyone who arrives expecting the newest first.

Getting it right

  • Query deliberately. A grid showing every post type rarely shows what the reader wants.
  • Keep the image ratio consistent across the grid, not just within one row.
  • Use one hover change. A card that lifts, tints and zooms at once feels nervous.
  • Do not put pagination inside a home page section. Send people to the archive instead.
  • Check the grid with the longest title on the site, not a typical one.

What else it can carry

The widget queries post types, so it is not limited to blog posts. Case studies, products, events, team members and documentation entries all lay out the same way, and the field switches decide what a card shows for each.

For a grid with layout presets and a read more button, see the ultra grid. For one where the title sits over the image rather than under it, see the luster grid.

Sapling grid in four columns and as an orange two column section
A four column light grid, and a two column orange section, same widget.

Sapling grid: common questions

Is the sapling grid free?

Yes. It ships in the free Sky Addons plugin. The free versus Pro page lists what else is included.

Does it need another plugin?

No. It reads the posts already in WordPress.

Will it slow the page down?

The widget loads no JavaScript of its own. The cost is the query and the images, so keep the post count sensible and size the featured images for the card.

Does it work on mobile?

Yes. Set the column count per breakpoint and the grid reflows to a single column at phone width.

Can it show a custom post type?

Yes. The query settings cover post types, taxonomies and ordering, so any registered type can fill the grid.

In practice

A sapling grid is the straightforward answer when a blog section has to match the page rather than the theme. Switch off the fields the reader does not need, trim the excerpt to a word count, keep the image ratio consistent, and let the query keep the section current.

See it on the sapling grid demo, read the sapling grid documentation for every control, and check the plans on the pricing page. The WordPress query documentation explains what the query controls are doing underneath, and MDN on CSS grid covers the layout model the columns rely on.

Written by
Shahidul Islam
Writes about the work behind the widgets — what shipped, why, and what it cost.
Share
In this post

More from the journal

Sapling Grid for Elementor: A Blog Grid That Does Not Need a Theme

Sapling Grid for Elementor: A Blog Grid That Does Not Need a Theme

A sapling grid lays posts out in columns with the image, category, author, date and excerpt you choose, styled in Elementor rather than in the theme.
Pace Slider for Elementor: A Main Slide With Its Own Thumbnail Rail

Pace Slider for Elementor: A Main Slide With Its Own Thumbnail Rail

A pace slider pairs one large slide with a thumbnail rail, so visitors jump straight to what they want instead of waiting for the slider to reach it.
Panel Slider for Elementor: Vertical Panels That Open Where You Click

Panel Slider for Elementor: Vertical Panels That Open Where You Click

A panel slider shows several tall panels at once and opens the one you pick, with titles, text, links and overlay colours set per state in Elementor.

Comments are closed.