Featured image and text wrap in blog posts

Support
#1

Hi. I am sizing all images for blog posts to be 300x300px, but when they are set as the Featured Image, a purple bar is spanning the remaining width of the page. How can we see just the image (no bar) and also start the text up next to the image so it wraps around it, rather than beginning beneath the image? Thanks!

#2

Hi there,

Please add this code in the custom CSS:

.single-post .entry-featured {
    width: 300px;
    float: left;
    margin-right: 25px;
}

Hope this helps.

#3

Perfect. Thanks.

#4

Hey,

You are welcome!

#5

Ugh. There’s a problem with this code I didn’t notice before. It does a fine job of making the Featured Image small on the single blog page and allowing text to wrap around it. However, it ALSO now makes the embedded Vimeo player small. We can’t have that. Can the code be modified to operate only on Featured Images, but NOT on the embedded Vimeo player?

This is the embedded video code:

Thanks.

#6

Hi there,

Sure, please change it to this

.single-format-standard .entry-featured {
    width: 300px;
    float: left;
    margin-right: 25px;
}

Thanks!

#7

Brilliant! I love you guys!!

#8

You’re most welcome! :slight_smile:

#9

Hi again. I just saw a new, small issue with this. The code you gave me to make the Featured Image small works fine with we’re looking at single blog posts. But when I use the search option, the resulting page, labelled, “Search Results” shows the featured images larger, and with that purple bar again (see the second item listed in the image). I assume there’s code to have it display the image smaller, like it does on the single blog posts? Thanks!

#10

Hi again,

To fix the issue, please add the following code in your Customizer as well:

.search-results .entry-featured {
    width: 300px;
    float: left;
    margin-right: 25px;
}

Let us know how this goes!

#11

Perfect. Thanks so much!

#12

Glad we could help.

Cheers!