rachelleyen
9/8/2017 - 4:19 AM

custom_post_thumbnail() with size detection. It will fill up space by checking the image's orientations.

custom_post_thumbnail() with size detection. It will fill up space by checking the image's orientations.

.post-thumbnail {
    height: 224px;
    overflow: hidden;
    position: relative;

    span.blackbg {
        background: rgba(0, 0, 0, 0.04);
        width: 100%;
        height: 100%;
        position: absolute;
        display: block;
        left: 0;
        z-index: 1;
    }

    img {
        height: 224px;
        left: 50%;
        max-width: none;
        top: 50%;
        @include translate(-50%,-50%);
        position: absolute;
        width: auto;
    }

    &.portrait img {
        height: auto;
        width: 100%;
    }
}
function custom_post_thumbnail() {
	if ( '' !== get_the_post_thumbnail() ) : 
		$image_arr = wp_get_attachment_image_src(get_post_thumbnail_id(get_the_ID()), 'large');
	$image_url = $image_arr[0]; 
	if ($image_arr[1] > $image_arr[2]) {
		$getimagesize = "landscape";
	} else {
		$getimagesize = "portrait";
	} 
	echo "<div class='post-thumbnail ".$getimagesize."'>";
	the_post_thumbnail( 'large' );
	echo "</div>";
	endif;
}