Elegant Themes gives you a few options for displaying images on blog posts as well as blog and category pages and using the Divi blog module. It’s much easier to achieve your desired layout if you have a basic understanding of how the images will be generated and displayed BEFORE you start creating blog posts. The purpose of this tutorial is to provide the basics to get you started.

Featured Images

If you set a featured image for a blog post, your theme will default to this image when viewing the post itself and will use the thumbnail of this image when viewing blog pages, category pages, and the Divi blog module. The only setting you can change with a featured image is whether an image is displayed at all. It’s all or nothing.

Removing featured image thumbnails from preview pages

You can turn the featured image off by going to the Epanel->Layout Settings->General Settings and disabling “Show Thumbs on Index pages”. This will remove the thumbnail from category pages and Divi blog modules. Even if you have an image manually inserted into your post, no image will be displayed.

Removing featured image from blog posts

You can also remove the featured image from the top of the blog post by going to Epanel->Layout Settings->Single Post Layout and disabling “Place Thumbs on Posts”. This will remove the featured image but still display images you’ve manually inserted into the post. This might be helpful if you want to display similar images on preview pages for design purposes but a different image once the post is clicked on.

Most people want the featured image displayed in both places so the default settings are usually ideal and none of the changes above need to be made.

Grab the first post image

The other option with Elegant Themes is to use the first image of each post as the thumbnail to be displayed on blog pages, category pages, and the Divi blog module. To enable this feature, navigate to the Epanel General Settings and enable “Grab the first post image”. Now if you manually insert an image into a post, that image will be used on preview pages. It will also be inserted into a post twice, once at the top and again wherever you have manually inserted it.

Removing duplicate images in posts

To disable this, go to Epanel->Layout Settings->Single Post Layout and disable “Place Thumbs on Posts”.

The main advantage to using the first post image instead of the featured image is if you want more control of how the image is displayed in the blog post. Maybe you want to have a few paragraphs explaining the picture before displaying it. Maybe you want to add a caption under the picture or would like to have more control over the size. In any case, enabling the “Grab the first post image” setting will give you more control.

Featured image thumbnails override first post image thumbnails

There is one important exception to grabbing the first post image. If you have a featured image set, it will override the first post image on preview pages. This could actually work to your advantage if you wanted most posts to display the first image but maybe have a few you would like to show a different image as the thumbnail preview. For example, you might have a post category called “Friday Freebies” and want all thumbnails of these posts to have the same image but don’t want that image displayed once the post is opened. Just set the featured image for all “Friday Freebies” to the same image and it will override the first post image, but only for those posts since your other posts won’t have a featured image set.

Which should you use?

Confused yet? It’s not rocket science but it does require a little brain power to wrap your mind around it. The general rule of thumb is to just set the featured image and use that for both thumbnails and the post itself.

If you want the thumbnail image to be different than the post image, you’ll need to use the Featured Images method. Just remember to go to Epanel->Layout Settings->Single Post Layout and disable “Place Thumbs on Posts”. That way the featured image is not displayed on the post and you can manually insert your own image.

If you will always manually insert the image so you can control its placement, size or other display features, you should probably enable grabbing the first post image. That way you only have to insert the image once.