Designing Your Blog Post Pages
When a reader clicks a card on your blog listing, they land on the post itself. This article is about that page: how the top of a post is arranged, how wide and how large the writing runs, what details sit alongside it, and what a reader sees when they reach the end. You set it up once and every post on your blog follows it.
You'll find these controls in Site Settings → Features → Post Design. Site Settings is available to Site Admins; Site Editors won't see it. Like the listing settings, these only appear once the Blog feature is switched on.
One design for every post
Post Design is deliberately a site-wide setting rather than something you choose per post, and it's worth explaining why, because it's a genuine design decision rather than a limitation.
A blog's value comes from reading consistently. When every post opens the same way, a returning reader knows immediately where the title sits, where the date is, and where the writing begins. Per-post layout freedom sounds appealing, but in practice it tends to produce forty posts that don't match each other, and a blog that feels assembled rather than published. So you make the call once here, and every post, past and future, picks it up.
(This is different from Content Types, where each type genuinely is a different kind of thing and should look different. A property listing and a team member deserve their own layouts. Two blog posts don't.)
Choosing a post header layout
The header is the top of the post: the title, the featured image, and the supporting details. Pick one of five arrangements:
| Layout | How it's arranged | Best for |
|---|---|---|
| Classic | Title first, photo underneath | The dependable default. Your headline does the work and the photo supports it. |
| Image first | Photo first, then the title | Image-led writing, where the photo is the hook: project write-ups, recipes, before-and-afters. |
| Image behind the title | The title sits on top of the photo | A bold, magazine-style opening. Needs a strong photo with room for text to sit legibly on it. |
| Side by side | Photo beside the title | A balanced, editorial look that gets the reader to the first paragraph faster than a full-width image. |
| Text only | No photo, just the words | A writing-first blog, or one where you'd rather not source a good photo for every post. |
If you're unsure, Classic is the one to stay on. It's what your blog already uses and it suits almost any subject.
Header alignment
Choose whether the title and details line up on the Left or are Centered. Left is easier to read and is the standard for long-form writing; centered gives a post a more formal, announcement-like feel and works nicely with short titles.
This option is hidden when you pick Image behind the title, since that layout positions the text over the photo itself.
Photo shape
Sets the shape of the main image at the top of a post. Choose Widescreen (16:9), Cinematic (21:9), Classic (4:3), or Square.
Widescreen is the safe, familiar choice. Cinematic is a dramatic, letterboxed strip that gets the reader to the writing quickly. Classic and Square give the photo more presence, at the cost of pushing the first paragraph further down the page. This setting is hidden when you choose Text only, since there's no photo to shape.
How the writing reads
Two settings control the body of the post, and they matter more than people expect. Comfortable reading is most of what makes a blog worth returning to.
- Reading width: how wide the writing runs. Narrow keeps lines short, which is genuinely easier on the eye for a long post, because a reader's eye doesn't have to travel as far to find the start of the next line. Standard is the balanced middle. Wide fills more of the screen and suits posts with lots of images or tables that need the room.
- Text size: Comfortable or Compact. Comfortable is the more generous, more readable setting. Choose Compact if your posts are short and you'd rather fit more on screen at once.
If most of your posts are a few hundred words or more, Narrow plus Comfortable is the combination that reads best. It's the setup most publications land on for a reason.
What to show on a post
Under What to show on a post you'll find a set of toggles for the details around your writing. Turn on what serves the reader and leave the rest off:
- Category above the title: a small label showing what the post is about before the reader even reaches the headline.
- Summary under the title: the excerpt you wrote for the post, shown as a standfirst that sets up the piece.
- Author name and photo: who wrote it. Worth showing when your expertise is part of the pitch, and easy to leave off for a one-person business where every post is obviously yours.
- Published date: when it went out.
- Reading time: adds something like "6 min read" beside the date. StoutStack works this out from the length of the post automatically, so there's nothing to fill in. It's a small reassurance that helps a reader decide to start now rather than "later."
- Reading progress bar: a thin bar across the top of the screen that fills as someone scrolls through the post. On a long read it gives a quiet sense of progress and tends to keep people going.
Category, summary, author, and date are on to begin with. Reading time and the progress bar are off, so switching either on is an active choice.
After the post
The end of a post is the moment a reader decides whether to leave or stay. Under After the post you have three ways to give them somewhere to go next. All three are off to start with.
- Author card at the end: a short "written by" card under the post, using the bio on that person's user account. Good for consultants, agencies, and anyone whose credibility is part of the offer. If your authors have no bio filled in, add one first or the card has little to say.
- Show more posts at the end: suggests other posts so readers keep reading instead of leaving. StoutStack picks from the same category first, then tops up with recent posts so the row is never half-empty. Two extra settings appear when you turn it on: a Heading for that section (it starts as "More from the blog", and you can change it to whatever suits your voice) and How many to show, either 2, 3, or 4.
- Saved section under every post: pick one of your Saved Sections to appear at the bottom of every post. This is the strongest option of the three, because it lets you put a real call to action there: a "book a consultation" prompt, a newsletter signup, a link to your services. Build it once as a Saved Section and edit it in one place; every post updates. See Pop-ups (Modals) & Reusable Saved Sections.
A well-tested combination is a related-posts row followed by a saved section with a single clear next step. The row catches readers who want more reading; the saved section catches the ones who are ready to get in touch.
What your posts start with
Every default here reproduces the layout your blog already had, so an untouched blog looks exactly as it did before these settings existed. Nothing changes until you change it:
| Setting | Starting value |
|---|---|
| Post header layout | Classic, left aligned |
| Photo shape | Widescreen (16:9) |
| Reading width / text size | Standard, Comfortable |
| What to show | Category, summary, author, and date on; reading time and progress bar off |
| After the post | All off (no author card, no related posts, no saved section) |
Good to know
- Change it once, and every post follows. This applies to posts you published last year as well as the one you write tomorrow. There's no need to go back and update anything.
- Some options hide themselves. Header alignment disappears when you choose "Image behind the title", and photo shape disappears when you choose "Text only". Nothing is broken; the setting simply doesn't apply to that layout.
- "Image behind the title" needs the right photo. The title sits on top of the image, so it wants a photo with a calm area for the text to land on. A busy or pale image makes the headline hard to read. Check a real post before settling on it.
- Reading time is calculated, not typed. You'll never have to estimate or update it. It follows the length of each post on its own.
- Preview with a real post. These settings are easiest to judge on your longest post rather than a short one, because that's where reading width, text size, and the progress bar actually earn their keep.
Related reading: Designing Your Blog Listing Page (styling the cards readers see first), Writing Blog Posts & Using Categories (writing the posts themselves), and Pop-ups (Modals) & Reusable Saved Sections (building the section you can place under every post).
