How to Limit Post Title Length on Archives with CSS

Last updated: May 18, 2026

Aurora’s archive layouts display post titles as they are, with no truncation. If your titles vary widely in length, cards in a grid layout can end up different heights, which breaks the visual alignment. CSS line clamping fixes this without changing your content.

Archive Layout Style dropdown showing all 13 options: Board, Cards, Default, Detailed, List, Magazine, Mega, Minimal, Minis, Overlay, Swapped, Tiled, Underlined

Limiting Titles to 2 Lines

Add this to Appearance → Customize → Additional CSS or your child theme’s stylesheet:

Child theme folder structure showing style.css, functions.php and other child theme files

.post-title a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

Change 2 to any number of lines you want to allow. Titles shorter than the limit display as normal. The rule only kicks in when the title exceeds the set length.

Targeting Specific Layouts

If you only want to limit titles on a specific archive layout, scope the selector to that layout’s wrapper class. For example, for the Cards layout:

.posts-card .post-title a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

Homepage Post Titles

Homepage post cards use the same .post-title class. The same rule applies there. Adjust the parent selector if you want to scope it to the homepage only:

.home .post-title a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

Line clamping is CSS-only. It clips the visual display without modifying the actual title text. Your SEO title, og:title, and schema headline are all unaffected. See How to Add Custom CSS to Aurora for where to place these rules.

#archive #custom-css #code-required

Previous ← How Nova’s CSS Loads Alongside Aurora’s

Next How to Add a Custom Banner Above the Header →

How to Limit Post Title Length on Archives with CSS

Limiting Titles to 2 Lines

Targeting Specific Layouts

Homepage Post Titles

Make your blog stand out

Getting Started with Elementor

Aurora WP Theme: Every Feature, Layout, and Option Explained

The best WordPress theme for blogs: Aurora