[Resolved] Customize blog and archive pages layout

[George]

I have looked everywhere, tried to apply filters but it doesn’t work.

In the blog settings I am displaying images left aligned, above titles and with a certain width. On the blog page only though I want to display posts in 4 columns with the images center aligned. I tried adding a filter:

add_filter( 'generate_blog_columns','gm_blog_column_count' );
function gm_blog_column_count( $count ) {
    if ( is_home() ) {
        return 25;
    }

    return $count;
}

Does it not work because the filter is only for custom post types?

Also I am using post images of 1200x400px but for all the archives pages(including the blog) I would like to have them center cropped and have a fixed height of 200px. The blog settings only allow me to set width dimensioans with the height automcatically set to auto, whatever value I enter for the height image attribute.

[George]

Hi, I think I did it!

I used the generate_blog_columns filter and set it to false.

add_filter( 'generate_blog_columns','tu_portfolio_columns' );
function tu_portfolio_columns( $columns ) {
    if ( is_search() || is_archive() ) {
        return false;
    }
    return $columns;
}

It worked. Is it the correct way to do it or is there a more bullet-proof way for this?

I also tackled the CSS issue:

.blog .inside-article .post-image img {
	height: 200px;
	object-fit: cover;
	object-position: center;
}

[Leo]

Hi there,

The code looks good to me. Basically makes the search page and archive pages single column.

That CSS should work as well. I would recommend to make sure it looks good on all devices: https://docs.generatepress.com/article/responsive-display/

[George]

Hi Leo, yes, I also applied media queries to the code to cater for mobile as well.

Ok, if it’s good, I am going to close the ticket.

Thanks!

[Leo]

No problem at all 🙂 Glad you figured it all out!

[Author]

Posts