Docs

[terzhi]

Hi,

Currently, I am playing around with the index feature post layout image option in ethos.

I have attached image to see how it would look. However, the images are being cut off. Including the post slider blog option.

Is there a specific size that the images have to be, so it can fit perfectly in the image post. Or is there an edit I can do, so regardless of it size, it will fit perfectly in the box.
or
Is there an edit I can do that can re-arrange the position of the image, so I can choose which area is to be displayed.

I will like an option where I can edit the image position or size, on how it will display for different images.

Thanks.

[terzhi]

This reply has been marked as private.

[Christopher]

Hi there,

The featured image dimensions should be around 1200*800 px.

Your images are square while the frame is rectangle so they don’t fit perfectly.

Thanks.

[terzhi]

Hi,

Cool. I understand your explanation.

However, is there a way I can change the feature post from a rectangle to a square shape instead??

Thanks

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> CSS :

.x-full-width-layout-active.x-content-sidebar-active a.entry-thumb.featured {
    width: 50%;
    margin: 0 auto;
}
.x-flexslider.x-post-slider {
    width: 50%;
    margin: 0 auto;
}

Hope it helps.

[terzhi]

This reply has been marked as private.

[Rue Nel]

Hello There,

To display the full image, you can make use of this custom css code:

.x-post-slider .x-post-slider-entry,
.x-full-width-layout-active.x-content-sidebar-active a.entry-thumb.featured {
  background-position: top center; 
  background-size: contain;
}

To eliminate the white spaces at the left and right of the image, you can just remove the background-size: contain; in the code.

Hope this helps.

[Author]

Posts