Blog post layout problems

Support
#1

I’ve been fiddling around with settings for hours but just cannot see a way to layout my blog like it’s laid out on this site:

I want image on the left - text on the right with the images all the same size so it looks neat. Please help or point me in the direction of a guide I can read, thank you.

#2

Hi @Pyke,

Thanks for reaching out.

That’s achievable through Ethos stack, then go to Theme Options > Blog and make sure the Style is set to standard instead of masonry.

Hope this helps.

#3

I’ve worked it out now, thanks.

Next problem is it shows the author, archive, date and so on underneath the blog title. How do I remove all of that from all posts and just have the title and text snippet underneath?

Also, how I do I make it so the featured image fits in the image box next to the text? At the moment it cuts off the person’s head!

#4

Hello There,

“the author, archive, date and so on” is called post meta. You can enable/disable (show/hide) this feature in X > Theme Options > Blog > Content > Post Meta.

The person’s head is cut off because you haven’t set the navbar top height. Please go to X > Theme Options > Header > Navbar and set the “Navbar Top Height” to at least 185 pixels because it is 0 or empty at the moment.

We would loved to know if this has work for you. Thank you.

#5

Hi,

Thanks for the reply. The meta content has now been removed but it still remains on the post slider. I’d like to remove that and know how to remove the post slider if possible. Changing the navbar height doesn’t seem to do a lot to the nave bar. It’s still really wide, I’m not sure if this is to do with my logo or not. Also, the picture still doesn’t fit in the box that displayed next to the text in the blog layout.

Is there a guide I can read that’s specifically written for Ethos 1? This is the stack I want to use. I’m a play around type of person instead of reading instructions religiously. On the other hand some instruction would be useful as I don’t wanna bother support every five minutes! Thanks.

#7

So I’ve managed to work it all out now :joy:

All except fitting the featured image into the box next to the text exert on the blog layout. No matter what I resize the image to it doesn’t fit and most of it is left out.

#8

Glad you’ve sorted out the other areas.

For your image, the Ethos blog thumbnail was designed to have an aspect ratio that is close to 4:3. If you don’t know what an aspect ration is yet, please see the links below:

With that said, please use an image with a landscape aspect ratio. You’re currently using a portrait image.

If you want to override Ethos’ blog thumbnail aspect ratio, add this code below in Theme Options > CSS.

a.entry-thumb {
    padding-bottom: 87%;
}

Adjust 87% as per your design. Just note that it is a single override, you can’t do this per image or per post so for the Ethos blog layout or with this type of layout in general, it’s best that you need to use a fixed image dimension.

Hope that helps.

#9

Thanks for the reply. Is there not a way I can move the position of the photo so a different section is visible in the thumbnail? I would certainly use landscape where possible but a lot of the the pictures I want to use are in portrait.

#10

Hi,

To adjust position of the image, you can add this in Theme Options > CSS

.blog .entry-featured a.entry-thumb,
.archive .entry-featured a.entry-thumb {
     background-position: 50px 50px !important;
}

Change 50px to adjust.

For more information about background position kindly refer to the link below

https://www.w3schools.com/cssref/pr_background-position.asp

Hope this helps

#11

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.