Blog
Blog — Archive Page
Copy-paste layout brief covering Page Header, Filter Options, Post List Layout and Post Card Elements — hand it to ChatGPT, Claude, or v0 as-is.
Blog — Archive Page is a copy-ready build prompt for blog pages. Paste it into ChatGPT, Claude, v0 and iterate from the first draft it returns.
If something here is out of date, the source link below is always the canonical reference.
| Use case | Blog |
|---|---|
| Works with | ChatGPT, Claude, v0, Cursor |
| Source | websiteprompts.com |
Create a blog archive/listing page:
1. PAGE HEADER
- Page title: "Blog" or "All Articles"
- Post count: "128 articles"
- Search bar
2. FILTER OPTIONS
Categories:
- All (default)
- Technology
- Design
- Tutorials
- Opinion
- News
Tags (if separate from categories):
- Popular tags as clickable pills
Sort by:
- Latest (default)
- Oldest
- Most Popular
- Most Commented
3. POST LIST LAYOUT
Option A - List view:
- Featured image left
- Content right
- Title, excerpt, meta
Option B - Grid view:
- Cards in 2-3 columns
- Image top, content bottom
Option C - Mixed:
- Featured post large
- Rest in grid
4. POST CARD ELEMENTS
- Featured image
- Category badge
- Title (linked)
- Excerpt (2-3 lines)
- Author avatar and name
- Date
- Read time
- Tags (optional)
5. PAGINATION
Option A - Numbered:
- Previous, 1, 2, 3, ..., 10, Next
- Current page highlighted
Option B - Load more:
- "Load More Posts" button
- Shows loading state
Option C - Infinite scroll:
- Auto-loads on scroll
- "Back to top" button
6. SIDEBAR (optional)
- Search
- Categories list
- Popular posts
- Tags cloud
- Newsletter signup
- About widget
- Social follow
7. EMPTY STATE
When no posts match filter:
- "No articles found"
- "Try a different category"
- Suggested posts
8. CATEGORY/TAG ARCHIVE
When viewing specific category:
- Category name as title
- Category description
- Post count
- Filtered posts
Design: Scannable, easy to browse. Good use of whitespace. Quick access to posts.How to use it
- Copy the full prompt with the button above.
- Paste it into your model and add your brand, copy and colours.
- Ask for one section at a time if the first pass is too broad.
Compiled and written by HowToPrompts from public sources. View original source ↗
← Back to Website Prompts