Themeisle Docs

Appearance

Generating Featured Images from Post Content ​

Learn how to automatically use the first image from your post content as the featured image. This is the most common and efficient method.

In this article

Overview ​

The "Find in post" method scans your post and automatically selects the first suitable image to use as the featured image. No manual intervention required.

How First-Image Detection Works ​

The Detection Process ​

  1. Post is Published/Updated — Plugin hook is triggered
  2. Content is Parsed — HTML content is scanned for image tags
  3. Images are Validated — File format and accessibility are checked
  4. First Valid Image is Selected — Set as featured image and imported to Media Library if needed

Supported Image Formats ​

✓ JPEG/JPG — Most common format, best for photos ✓ PNG — Supports transparency, best for graphics/logos ✓ GIF — Animated GIFs supported ✓ WebP — Modern format with excellent compression ✓ AVIF — Next-generation format with high compression ✓ BMP and TIFF — Also supported

Not Supported: ✗ SVG, Base64 encoded images, CSS background images

Setting Up Content-Based Generation ​

Step 1: Enable the Feature ​

  1. Go to Auto Featured Image > Settings > General tab
  2. Select "Find in post" as the generation method
  3. Click Save Settings

Step 2: Check Which Image Settings Apply ​

The Image format and Image size options on the Auto Featured Image > Settings > Image Settings tab apply to images the plugin creates itself from your post title. They do not change an image that "Find in post" picks up from your post content.

When "Find in post" finds an image, the plugin assigns that image as the featured image as it is — importing it into your Media Library first if it is hosted on another site. Its width, height, and file format stay exactly as they were in your content.

⚠️ Important: Entering a custom width and height does not resize images found in post content. If your featured images keep their original dimensions after you change the Image size fields, the generation method is the reason — not a fault.

Controlling the Size of Content-Based Featured Images ​

The generation method decides whether Auto Featured Image controls the size of the featured image:

Generation methodDoes Image size apply?
Find in postNo — the image from your content is used at its original size
Generate from titleYes — the plugin draws the image at the width and height you set
Find or generateOnly when no image is found in the content and the plugin falls back to generating one from the title

You have two ways to get featured images at a predictable size:

  • Let the plugin create the image. Switch the generation method to Generate from title so every featured image is drawn at the exact width and height you configure. See Creating Featured Images from Post Titles for the full setup.
  • Keep using the image from your content. Leave the method on Find in post and control the displayed size through your theme's featured-image settings and the image sizes registered in WordPress. WordPress creates its own resized versions of each image in your Media Library, and your theme chooses which one to display.

💡 Tip: Resize images to a consistent size before you add them to your post content. This is the most reliable way to keep content-based featured images uniform across your site.

How It Works with Different Editors ​

WordPress Block Editor (Gutenberg) ​

Supported Blocks:

  • ✓ Image block
  • ✓ Gallery block (first image)
  • ✓ Cover block (background image)
  • ✓ Media & Text block

Classic Editor ​

  • ✓ Standard <img> tags
  • ✓ Images inserted via Add Media
  • ✓ Images in HTML blocks

Page Builders ​

  • Elementor: ✓ Image widgets, ✓ Image Box widgets
  • Divi: ✓ Image modules, ✓ Gallery modules
  • WPBakery: ✓ Single Image elements, ✓ Image Gallery elements

Note: Background images set via CSS are generally not detected by any editor or page builder.

Image Selection Rules ​

When multiple images exist in your post content, the plugin selects the first image it finds in the HTML, from top to bottom.

Handling External Images ​

External images (hosted on other domains) can be handled in two ways:

Option 1: Import to Media Library (Recommended)

  • Plugin downloads the external image and saves it to your /wp-content/uploads/ folder
  • Prevents broken links if the source removes the image
  • Full control over images and better performance

Option 2: Use External URLs Directly

  • Saves server storage but images can break if the source removes them
  • Not recommended for production sites

Troubleshooting ​

No Image Detected Despite Having Images ​

  • Verify your post content contains standard <img> tags (CSS background images are not detected)
  • Ensure the image format is JPG, PNG, GIF, or WebP
  • Check the Plugin Logs tab for any errors
  • Test with a simple post containing a single image

Wrong Image Selected ​

  • The first image in the HTML source may not be the visually first image (especially with page builders)
  • Fix: Move the desired image to the top of your content, or manually set the featured image for that post

External Images Not Importing ​

  • The remote server may be blocking requests, or PHP may be timing out
  • Try downloading the image manually and uploading it to your Media Library

Image Size Setting Appears to Be Ignored ​

  • Check the generation method on the Settings > General tab. With Find in post, the Image size fields do not apply — the image comes from your content at its original size
  • Switch to Generate from title if you need the plugin to produce images at an exact size
  • To keep the images from your content and still control how they appear, adjust your theme's featured-image settings instead

Best Practices ​

  1. Place your most important image first — the plugin uses the first valid image it finds
  2. Optimize images before adding to content — resize to 1200-2000px width and compress using tools like TinyPNG
  3. Use descriptive file names and alt text — improves accessibility and SEO
  4. Use consistent image sizes across posts for a professional, predictable layout

Need Help? ​

Was this helpful?