Archived topic

Resizing Featured image in blog archive

3 replies · Started by Julia Wegmayr on January 26, 2022

Viewing posts 1–4 of 4

January 26, 2022 at 1:20 am #2093947

Dear GP team,

I'm stuck with the sizing of featured images in my blog post archive. Every image should have the same size - I know that they are uploaded in different sizes, but is there any possibility to have them cropped so that they are displayed in the same way - without uploading all of them again in the right format.

I already tried to add an image size with php:

add_action( 'init', function() {
add_image_size( 'my-archive-featured-image', 600, 400, true ); // 600 width, 400 height, crop
} );

but it didn't work as I expected it.

Thank you for your help!

January 26, 2022 at 3:48 am #2094085

Hi Julia,

Can you try to add this custom CSS?:

.gb-container.gb-container-ff15641f > .gb-inside-container img {
    height:100%;
    width: auto;
    object-fit: cover;
    position: absolute;
    top:0;
}

.gb-container.gb-container-ff15641f .gb-inside-container {
    position: relative;
    padding-top: 400px;
}

.gb-grid-wrapper > .gb-grid-column-ff15641f {
    width: 600px;
}

.gb-grid-column.gb-grid-column-64596747 {
    flex: 1;
}

Kindly adjust the padding-top(400px) and the width(600px) values to your preferred size.

You may refer to this link for assistance regarding adding custom CSS: https://docs.generatepress.com/article/adding-css/

Hope this adheres to your preference!

January 26, 2022 at 4:30 am #2094131

Hi Fernando,

Thank you so much! This works perfectly and is exactly what I wanted to achieve! :)

Best,
Julia

January 26, 2022 at 7:06 pm #2095181

You're welcome! Glad that did the job! :)

This archived topic is closed to new replies.

Start building better websites today.