Featured Image size/align

Hi

How can i reduce the size of the featured image on my blog articles and also align them right/left of my article text ?

Thanks!

Hello There,

Thanks for writing in!

Please add following CSS to change featured image size:

.single-post .entry-featured {width:50%;float: left;margin-right: 30px;}

Thanks.

Thanks however that change is also moving the featured image to the top of the post and covers over the post intro heading/title.

is there a way to get this to sit under the heading and/or even sit within the first paragraph of the posts body ?

Hi there,

Can you please share the URL of the post so we can take a look?

Thanks!

see below, i have secured the url

Hi again,

To display the image under the heading, add the following jQuery script in your Customizer via Appearance > Customize > Custom > Edit Global Javascript

(function($) {
	$('.single-post article').find('.entry-featured').insertAfter('.entry-header');
})(jQuery);

Then replace previous provided CSS with:

.single-post .entry-featured {
    width: 50%;
}

And add the following CSS code in your Customizer:

.single-post .x-main.left .hentry .entry-featured {
    margin: 0 !important;
}

Hope this helps!

Hey,

made those changes but it’s sitting above the title and not below, or within the start of the post body. can you have a look and suggest what needs to be changed >

Thanks!

Hi again,

I checked your site and there is a syntax error in your Customizer JS. Please remove your code from the Customizer since it’s breaking your site then add the following code only:

(function($) {
	$('.single-post article').find('.entry-featured').insertAfter('.entry-header');
})(jQuery);

This should fix the issue. Let us know how this goes!

1 Like

Great, that worked! however if i want to move the image into the first paragraph of the posts text (its currently below the headline and above the posts text) can that be done too ?

Hi again,

Regretfully that can’t be done in this way, but there is a work around that you can try. manually add the image in the content (after first paragraph) and remove the featured image from the post.

Hope this helps!

1 Like