Docs

[Noellemena]

Hello!! Hope you are all well, it has been quiet a bit since I have needed to post 🙂

Ok, I am using Ethos for my client at http://todaysladyvirtue.com/

On her blog page I am not liking the giant grey box around blog post titles (see attached image) I want that box to just cover the title itself with very little padding.

Second, her titles are super truncated, can I make it show the entire title?

Third. Masonry look on Ethos, I know it comes boxed with cropped images. Has this changed or been updated and now is there a way that her images will not be cropped to a square?? I do not understand why Ethos does this but all the other stacks I can change it. Isn’t the point of going Mason to have it nudge up against each other?? Help. 🙂

LAST, (thank you) IF I decide to rebuild a custom Blog page and use the “Essential Grid”, will it pull in ALL blog posts just like her regular blog page would do??? If so, I might just choose to go that way as I have used it for certain categories on separate page like: Motherhood http://todaysladyvirtue.com/resources/motherhood/

THANK YOU SO MUCH!
Noelle
Leaving Login Below too. So you can see my CSS as well.

[Noellemena]

This reply has been marked as private.

[Friech]

Hi Noelle,

Thanks for writing in! You can add this under Custom > CSS in the Customizer.

.blog .h-entry-cover {
	padding: 1.5%;
	top: calc(100% - 1.5em);
}

Cheers!

[Noellemena]

Hey, why did you only answer one of my questions?? Please see the others so I can handle tomorrow since it takes 24 hours for an answer. Thanks so much, Noelle

[Rue Nel]

Hello Noelle,

Thanks for the updates!

1] To reduce the grey box and the padding around it, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.blog .h-entry-cover {
	padding: 1.5%;
	top: calc(100% - 1.5em);
}

2] To remove the truncation, you’ll probably need to update the code in #1 and make use of this code instead:

.h-entry-cover {
	padding: 1.5%;
	top: calc(100% - 2.5em);
}

.h-entry-cover span {
	text-overflow: clip;
	white-space: normal;
}

3] All the feature images in Ethos as used as cover and it is being displayed as a background image. If you want to display the whole image without being cropped, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.h-entry .entry-cover {
	background-size: contain;
}

Please be advised that setting the background image size as contain, you may see extra spaces on the left and right of the image.

4] Yes it will display all the blog post. For more detailed instruction how you can do it, please check out the documentation here: https://www.themepunch.com/faq/auto-populate-grid-for-blog-pages-with-the-loop-advanced/

As this is all custom development, regretfully we won’t be able to assist further. Custom development is outside the scope of our support. We’re happy to provide advice and get you started in the right direction, but you would still be responsible for the implementation.

Thank you.

[Noellemena]

Thank you!!! 🙂

[Rad]

You’re welcome!

[Author]

Posts