Design Your Blog Header & Sidebar
Your blog layout in Recrevio is made up of three main areas:
- Header (hero section) – the top area of your blog that sets the tone and introduces the blog.
- Sidebar – the column next to your posts, often used for navigation and discovery.
- Main content area – the center area where your blog posts and blog list appear.
Because Recrevio’s Blog is built into Web Studio, you can design the Header and Sidebar using the same visual builder and widgets you use everywhere else—no plugins needed.
Where to Edit the Blog Header & Sidebar
To access Edit the Blog Header & Sidebar:
- Go to Web Studio
- Click Pages
- Open Blog
- From the Blog List view, click Edit the Blog Header & Sidebar
This opens the Edit the Blog Header & Sidebar view where you can configure layout and behavior for your blog.
What the Blog Header is
The Blog Header is the top “hero” area of your blog. It’s usually the first thing visitors see before the list of posts.
What it’s good for
Use it to quickly communicate:
- what your blog is about
- who it’s for
- what readers can expect
- what you want them to do next (optional)
What you can add
You can add any widgets here – just like on normal pages. Common choices:
- Headline + short intro text
- Background image or solid color section
- Button (e.g. “Start here”, “Browse categories”, “Join newsletter”)
- Featured post block
- Simple opt-in / CTA section
Tips for a strong header
- Keep the headline short and clear (1–2 lines).
- Add a one-sentence description that matches your brand tone.
- Avoid making it too tall—your posts should still be visible without heavy scrolling.
- If you use an image, make sure text stays readable (contrast matters).
What the Blog Sidebar is
The Sidebar is the column next to your blog list and blog posts. It’s a perfect space for “helpful navigation” and content discovery.
What it’s good for
Use it to help readers:
- find the right topics faster
- explore categories and tags
- discover popular or recent posts
- learn who’s behind the blog
What you can add
Just like the header, you can add any widgets in the sidebar. Common sidebar sections:
- About (short intro about you or the brand)
- Recent posts
- Categories
- Tags
- Newsletter signup
- Lead magnet signup
- Other call-to-actions (e.g. “Explore Courses”, “Join the Membership” or "Start the Program")
Using the Blog widget in the Sidebar
For most blogs, the easiest way to power the sidebar is to use a Blog widget, because it can automatically display dynamic blog content like.
Collection to display
Choose what type of blog data to show:
Recent Posts
Optionally limit the widget to show:
- All categories, or
- A specific category (e.g. “yoga”, “meditation”)
- Most Popular Categories
- Most Popular Tags
Display options
You can also choose things like:
- how many items to show, and
- styling such as item color
💡 Tip:
Use multiple Blog widgets in the sidebar to create separate blocks, for example:
- one widget for Recent posts
- one widget for Popular tags
- one widget for Categories
If you want a deeper walkthrough of everything the Blog widget can do, have a look at the dedicated Blog widget article.
What the main (center) area is
The large center area is where the blog’s primary content appears:
- your Blog list (when browsing posts)
- your Blog post content (when reading an article)
So: Header + Sidebar are your framing/navigation, while the center area is where the post itself lives.
Best-practice layouts you can copy
Simple, clean blog
Header: Title + short description
Sidebar: About + Recent posts + Tags
Content discovery focused
Header: Title + “Start here” button
Sidebar: Categories + Tags + Popular posts
Business / creator blog
Header: Value-driven intro + CTA
Sidebar: Lead magnet + Recent posts + Categories
(Works great if your blog supports courses, memberships, coaching, or digital products.)
Save and preview your updates
When you’re done editing the Header & Sidebar, click Save. Then preview your blog to make sure:
- spacing looks good on desktop and mobile
- sidebar blocks are not too long
- the header doesn’t push posts too far down
How Header & Sidebar Settings Work
Think of Header & Sidebar as the framing and navigation layer of your blog.
Blog Settings → global behavior
Controls layout, navigation, sharing, and commenting rules for the entire blog.
Header & Sidebar → visual structure & navigation
Defines the framing of your blog, including hero content, discovery, and contextual navigation.
Blog Post Settings → per-post customization
Allows fine-tuning of individual articles without affecting the rest of the blog.
Together, these layers give you a flexible system where global rules keep things consistent, while individual posts can be adapted when needed – without duplication or plugins.