Full-width excerpt image?

Thanks for using Tracks!

Sure, something like this should work pretty well:

.excerpt-container {
  display: none;
}
.excerpt .featured-image {
  position: relative;
  padding-bottom: 30%;
  width: 100%;
}

Please copy & paste the code above into the “Additional CSS” section in the Customizer (Appearance > Customize), and it will take effect right away. The padding-bottom value can be increased to make the images taller.

Thanks Ben! Is there any to apply this to only posts with no text (or of a certain tag/category) rather than globally for all excerpts?

Specific categories is doable. If you can link me to the category you’d like to target, I can provide an updated code snippet.

Posts can be targeted individually if they don’t have a Featured Image, but they can’t be targeted based on the presence of an excerpt.

A category would be perfect! I can define a category named ImagesOnly and would like for the excerpts to be a full-width featured image only (no text) for that specific category.

Do you need me to do that and give you a link? Or could you post the code just based on the category name?

Thanks in advance!

Kevin.

The category name is enough. Here’s an updated version of the snippet:

.category-imagesOnly .excerpt-container {
  display: none;
}
.category-imagesOnly.excerpt .featured-image {
  position: relative;
  padding-bottom: 30%;
  width: 100%;
}

This will affect all posts in the imagesOnly page on any archive page they show up on including the homepage.

• This reply was modified 4 years, 8 months ago by Ben Sibley.
• This reply was modified 4 years, 8 months ago by Ben Sibley.

The category CSS label had to be all lowercase (to match the slug for it in the Categories list) but that worked like a charm.

Thanks so much! ??

Got it, glad I could help ??