How to Limit Post Title Length on Archives with CSS

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.

Limiting Titles to 2 Lines

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

.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;
}