How to Generate Thumbnail Images from WordPress Pages
Add featured images to WordPress pages, create theme-sized thumbnails, and regenerate image files already in your Media Library.
To generate thumbnail images for WordPress pages, enable featured-image support in your theme, register an image size that fits your page layout, assign a featured image to each page, and request the registered size in the template. For images already in the Media Library, regenerate the image sizes after registering or changing them.
In WordPress, “thumbnail” can mean either the featured image representing a page or one of the smaller image files generated from an upload. These are related but separate: assigning a featured image does not create a new size, and registering a size does not automatically rebuild files for older uploads.
1. Enable featured images for pages
Add theme support for post thumbnails. In a classic theme, place this in the theme’s setup code, commonly in functions.php:
add_action( 'after_setup_theme', function () {
add_theme_support( 'post-thumbnails' );
} );
WordPress describes featured images, also called post thumbnails, as representative images for a post, page, or custom post type. The featured-image control normally appears in the editor sidebar. If your theme only wants this feature on selected post types, pass the supported types as the second argument:
add_action( 'after_setup_theme', function () {
add_theme_support( 'post-thumbnails', array( 'post', 'page' ) );
} );
If pages still lack a featured-image control, check that the code runs in the active theme, confirm the current post type is supported, and inspect the editor’s sidebar or screen options. A page builder or custom post type may have its own settings.
2. Register a thumbnail size for the page layout
Choose dimensions and an aspect ratio based on the card, archive, or other layout where the image will appear. Register a named size in your theme setup code:
add_action( 'after_setup_theme', function () {
add_theme_support( 'post-thumbnails', array( 'post', 'page' ) );
add_image_size( 'page-card', 640, 400, true );
} );
The fourth argument controls cropping:
| Value | Effect | Use it when |
|---|---|---|
false |
Scales the image proportionally to fit within the requested dimensions; it does not crop to fill both dimensions. | You need the full image visible and can accept varying output dimensions. |
true |
Crops to the requested width and height, centered by default. | Your cards need a consistent frame and aspect ratio. |
Array, such as array( 'left', 'top' ) |
Crops to the requested frame with a chosen horizontal and vertical crop position. | The subject is consistently off-center and a fixed crop would cut it off. |
For example, array( 'left', 'top' ) anchors a hard crop at the top left; horizontal positions can be left, center, or right, and vertical positions can be top, center, or bottom. Check the result with representative images: WordPress cannot infer which part of every photo is important.
WordPress also provides set_post_thumbnail_size() to set the default post-thumbnail dimensions and crop behavior. Use add_image_size() when you want an explicit named size for a particular layout. Built-in size names include thumbnail, medium, medium_large, large, full, and post-thumbnail. A custom registered name is usually easier to reason about when a theme has a dedicated page-card layout.
3. Assign the featured image to a page
- Open the page in the WordPress editor.
- Find the Featured image control in the editor sidebar.
- Select an existing Media Library image or upload one.
- Save or update the page.
This associates the source image with the page. The image size requested by the template determines which generated derivative WordPress uses when displaying it.
4. Request the registered size in the template
The template must request the same registered name, page-card, to use that derivative. For example, in a PHP template that is inside the page loop:
<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail( 'page-card', array(
'alt' => get_the_title(),
'loading' => 'lazy',
) );
}
?>
To build a link around the image, use the thumbnail URL and dimensions WordPress provides, or use the template’s existing markup and classes. Keep the registered name and template request in sync: requesting a different size will not select the custom derivative you just defined.
If the card is rendered by a block theme, a page builder, or a plugin rather than a PHP template, configure that component to use the desired image size. The exact control and supported size names depend on the theme or builder.
5. Regenerate image sizes for existing uploads
Registering a new size affects image processing for new uploads. It does not by itself create that derivative for images already in the Media Library. Regenerate those files after adding or changing a size.
With shell access to the WordPress installation and WP-CLI available, preview the operation first:
wp media regenerate --dry-run
Then regenerate the library:
wp media regenerate
WP-CLI’s media regeneration command also accepts attachment IDs, which is useful when you only need to rebuild selected images:
wp media regenerate 12 34 56
For command options and behavior, consult the WP-CLI media regenerate reference. If you do not have shell access, an admin plugin can expose regeneration or custom image-size controls. The WordPress.org listings for Simple Image Sizes and reGenerate Thumbnails Advanced describe relevant controls. Check current compatibility with your WordPress, PHP, and theme versions before using a plugin, and back up site media before a large bulk operation.
6. Check the generated result
- Inspect the page card at the actual size and aspect ratio used by the theme.
- Check several source images, including portrait, landscape, and off-center subjects.
- Confirm that the page template requests the registered size and that the size definition uses the same name.
- If the page is cached, clear the relevant page or image cache before judging the result.
For remote visual review, ScreenshotNeo can capture a page as an image or PDF. It is a screenshot API and MCP server; it does not register WordPress sizes or regenerate your Media Library derivatives.
Choose the right method
| Method | Best fit | Scope | What to consider |
|---|---|---|---|
Theme code with add_image_size() |
You control the theme and want a stable, reusable size. | Defines a size for image processing; templates must request it. | Requires code access and regeneration for old uploads. |
| WP-CLI regeneration | You have shell access and want to rebuild existing derivatives. | Can process the library or selected attachment IDs. | Check available disk space and run a large job when the site can handle it. |
| Admin plugin | You need an admin interface for managing sizes or regeneration. | Depends on the plugin’s controls. | Verify current compatibility and back up before bulk changes. |
Performance, reliability, and storage
Each registered image size can add another derivative when an image is processed. More sizes can make uploads and regeneration take longer and consume additional disk space. Register only sizes that the site actually uses.
Regenerating a large library is a bulk media operation. Its completion time depends on the host, image dimensions, image-processing capacity, and library size; there is no universal duration. Use a backup, consider processing selected attachment IDs first, and avoid interrupting a regeneration job if the tool reports it is still working.
For reliable output, keep the size name consistent across theme registration and template calls, verify crop positions with real content, and regenerate after changing dimensions or crop settings. A successful code change alone does not guarantee that old files exist in the new dimensions.
Troubleshooting
| Symptom | Likely cause | Fix |
|---|---|---|
| No featured-image control in the editor | The active theme has not enabled post-thumbnail support, the current post type is not included, or the editor sidebar control is hidden. | Add add_theme_support( 'post-thumbnails' ) during theme setup; include page if support is scoped; inspect editor sidebar or screen options. |
| The page shows the original image or the wrong dimensions | The template requests a built-in or different custom size, or a builder controls the image output. | Request the registered name, such as page-card, in the template or configure the builder’s image-size setting. |
| A new size works for recent uploads but not old pages | Existing attachments have no derivative for the new size. | Run wp media regenerate or use a compatible admin regeneration tool. |
| The crop cuts off the subject | A centered hard crop does not match the image composition. | Adjust the crop position array, choose proportional scaling, or use source images composed for the card frame. |
| WP-CLI reports that it cannot find WordPress | The command is running from the wrong directory or outside the site environment. | Run it from the WordPress root or pass the site path using WP-CLI’s supported path option. |
| Regeneration fails or stops partway | The host may lack memory, execution time, disk space, or image-processing support for the workload. | Check the host and PHP error logs, confirm free disk space, process smaller batches or selected IDs, and retry after addressing the reported resource limit. |
| The old image still appears after regeneration | A page, CDN, or browser cache may still serve an earlier response or file. | Clear the relevant cache and reload the page; inspect the image URL and dimensions being returned. |
Or skip the browser setup
If you need to inspect the published page after updating its images, ScreenshotNeo captures it with one GET request. See the ScreenshotNeo API documentation for parameters and options.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp
import requests
r = requests.get(
"https://api.screenshotneo.com/v1/shot",
params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"},
timeout=90,
)
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
await import('node:fs/promises').then(fs => fs.writeFile('shot.webp', Buffer.from(await res.arrayBuffer())));
ScreenshotNeo accepts cookie and consent banners before capture and removes more than 60 known consent platforms, newsletter popups, and chat widgets; each step can be turned off. Bot checks, blank pages, failed loads, timeouts, and cache hits are not billed, and response headers report the page verdict and billing status. Its MCP server gives AI agents screenshot, page-info, and PDF capture tools. The free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000 shots.
Sign up for 1,000 free screenshots a month, with no card required.
FAQ
Does assigning a featured image create a thumbnail file?
No. Assignment chooses the representative source image for the page. WordPress generates and serves image sizes separately.
Do I need a custom size for every page?
No. Use a custom named size when a layout needs dimensions or cropping distinct from the site’s existing sizes. Otherwise, a built-in size may be suitable.
Can I make WordPress crop around a face or subject automatically?
The documented crop positions set an anchor such as left, center, or right and top, center, or bottom. They do not identify the subject in each image, so review representative crops.
Will changing the registered size update the original upload?
No. Image sizes are derivatives. The source upload remains the original; regeneration creates or updates derivative files.


