sprouter-nate
4/22/2020 - 1:05 AM

Custom UABB post layout with same height cropped images

.uabb-post-thumbnail img {
    object-fit: contain;
    height: 240px;
}
.uabb-blog-posts-shadow.clearfix {
    min-height: 450px;
}


/* circle cropping */
.cs--homepage-uabb-latest-news .uabb-post-thumbnail img {
    object-fit: cover;
    height: 200px;
    width: 200px;
    border-radius: 100%;
}
[wpbb-if post:featured_image]
  <a href="[wpbb post:url]">
	<div class=" uabb-blog-post-section" style="min-height: 240px; max-height: 240px; overflow: hidden;">
		<img 
		    src="[wpbb post:featured_image size='medium' display='url']" 
		    class=" wp-post-image" 
		    alt="[wpbb post:featured_image display='alt']" 
		    itemprop="image" 
		    style="object-fit: cover; height: 240px"
		    >
	</div>
	</a>
[wpbb-else]
<!-- for fallback image if needed -->
[/wpbb-if]

<div style="margin: 20px;">
	<h3 class="uabb-post-heading uabb-blog-post-section" style="">[wpbb post:link text="title"]</h3>

	<span class="uabb-post-meta uabb-blog-post-section">
		<span class="uabb-meta-date"> [wpbb post:date format="F j, Y"] </span>
	</span>

	<div class="uabb-post-meta uabb-blog-posts-description uabb-blog-post-section uabb-text-editor" 
	    style="padding: 10px 0px;">
		[wpbb post:excerpt length="18" more=" ..."]
	</div>

	<span class="uabb-read-more-text" style="padding-top: 0px;">
		[wpbb post:link text="custom" custom_text="Keep Reading <span class='uabb-next-right-arrow'>→</span>"]
	</span>
</div>