How to Change Featured Image Size in WordPress: A Complete Technical Guide
Featured images — also called post thumbnails — are the primary visual anchor of any WordPress site. They appear in post listings, archive pages, social media previews, and RSS feeds, making their dimensions a direct factor in layout consistency and perceived design quality. Changing the featured image size in WordPress means either redefining the pixel dimensions WordPress registers at upload time, updating how your theme requests those dimensions at render time, or both — and failing to address both sides is the single most common reason resized images look wrong on the front end.
This guide covers every method available, from no-code dashboard settings to direct PHP customization, with precise technical context for each approach.
Understanding How WordPress Handles Image Sizes
Before touching any setting, you need to understand the pipeline. When you upload an image, WordPress does not store one file — it generates multiple derivative files based on registered size definitions. These definitions live in the database and are registered either by WordPress core, your active theme, or installed plugins.
The three sizes WordPress registers by default are:
- Thumbnail — typically
150x150px, hard-cropped by default - Medium — up to
300x300px, proportionally scaled - Large — up to
1024x1024px, proportionally scaled
Your theme registers additional sizes using add_image_size(). When a template calls the_post_thumbnail('large'), WordPress looks up the file that was generated for that registered size at upload time. This is the critical architectural point: changing a size definition does not retroactively resize already-uploaded images. You must regenerate thumbnails after any size change.
Method 1: Adjust Featured Image Size via WordPress Media Settings
This is the correct starting point for sites where the theme uses one of the three core sizes for its featured image output.
Step 1: Update the Media Settings
Navigate to Settings > Media in your WordPress dashboard. You will see three size groups. Identify which size your theme uses for featured images — check your theme documentation or inspect the rendered HTML to confirm the CSS class (e.g., wp-image-* alongside size-large).
Adjust the width and height fields for the relevant size. Setting either dimension to 0 tells WordPress to scale proportionally along the other axis rather than cropping.
Click Save Changes.
Step 2: Regenerate Existing Thumbnails
New uploads will use the updated dimensions immediately. For images already in your media library, you must regenerate derivatives. The most reliable tool for this is the Regenerate Thumbnails plugin by Alex Mills.
After installing and activating it, go to Tools > Regen. Thumbnails and click Regenerate All Thumbnails. On large libraries, this is a resource-intensive operation — run it during low-traffic hours, and if you are on a VPS Hosting plan, consider temporarily increasing PHP's max_execution_time and memory_limit in php.ini to prevent timeouts.
Common pitfall: If your theme registers its own custom size with the same label as a core size, the Media Settings panel will not affect it. The theme's add_image_size() call takes precedence.
Method 2: Use the WordPress Customizer or Theme Options Panel
Many commercial themes expose image size controls without requiring code changes.
Step 1: Check the Customizer
Go to Appearance > Customize. Look under sections labeled Theme Options, Blog Settings, Layout, or Post Settings. Some themes surface a dedicated Featured Image section here.
If controls exist, adjust width and height, then click Publish. The theme will update its registered size definition and, in some implementations, automatically regenerate affected images.
Step 2: Check a Dedicated Theme Options Panel
Premium themes built on frameworks like Redux or Kirki often have a standalone Theme Options or Theme Panel menu item in the dashboard sidebar. Look for subsections named Image Settings, Post Thumbnails, or Archive Layout.
Adjust the values, save, and then regenerate thumbnails manually using the plugin method described above, since most theme panels do not trigger regeneration automatically.
Method 3: Define Custom Image Sizes in functions.php
This is the technically correct method for developers and anyone who needs precise control over dimensions, cropping behavior, and size naming. It is also the only method that lets you register sizes that do not conflict with core defaults.
Step 1: Register the Custom Size
Edit your child theme's functions.php file. Never edit a parent theme's files directly — updates will overwrite your changes. If you do not have a child theme, create one before proceeding.
Add the following inside a hooked function:
function mytheme_custom_image_sizes() {
add_theme_support( 'post-thumbnails' );
add_image_size( 'featured-hero', 1200, 600, true );
add_image_size( 'featured-card', 400, 300, true );
}
add_action( 'after_setup_theme', 'mytheme_custom_image_sizes' );Parameter breakdown for add_image_size():
- Argument 1 — the size handle (string), used when calling the image in templates
- Argument 2 — width in pixels
- Argument 3 — height in pixels
- Argument 4 — crop mode:
truefor hard crop to exact dimensions;falsefor proportional scaling; an array likearray( 'left', 'top' )for positional cropping
Edge case: Passing true as the crop argument defaults to center-center cropping. If your featured images have subjects that are consistently off-center (e.g., portrait photography), use a positional array — array( 'center', 'top' ) — to prevent heads being cropped out.
Step 2: Call the Custom Size in Template Files
Locate the template file responsible for rendering the featured image. Common candidates are single.php, archive.php, content.php, or template-parts/content-single.php. Search for the_post_thumbnail to find the exact call.
Replace the existing size argument:
// Before
the_post_thumbnail( 'large' );
// After
the_post_thumbnail( 'featured-hero' );For more control over the output markup, use get_the_post_thumbnail() with custom attributes:
echo get_the_post_thumbnail(
get_the_ID(),
'featured-hero',
array(
'class' => 'hero-image lazyload',
'alt' => get_the_title(),
'loading' => 'lazy',
)
);Step 3: Make the Custom Size Selectable in the Media Uploader (Optional)
By default, custom sizes registered with add_image_size() do not appear in the WordPress media uploader's size dropdown. To expose them for editorial use, add this filter:
function mytheme_add_image_sizes_to_selector( $sizes ) {
return array_merge( $sizes, array(
'featured-hero' => __( 'Featured Hero (1200x600)', 'mytheme' ),
'featured-card' => __( 'Featured Card (400x300)', 'mytheme' ),
) );
}
add_filter( 'image_size_names_choose', 'mytheme_add_image_sizes_to_selector' );Step 4: Regenerate Thumbnails
Run the Regenerate Thumbnails plugin as described in Method 1. All previously uploaded images will have new derivative files generated at the new dimensions.
Method 4: Adjust Featured Image Size in a Page Builder
Page builders like Elementor, Divi, and Bricks Builder abstract the template layer, so template file edits may not apply. Each builder has its own image size controls.
Elementor
- Open the page or post in Elementor.
- Select the Featured Image widget or a Posts widget displaying the thumbnail.
- In the left panel, locate Image Size under the Content tab.
- Choose a registered size from the dropdown or select Custom to enter pixel dimensions.
- Click Update.
Technical note: When you select "Custom" in Elementor, it does not register a new WordPress image size — it uses JavaScript to resize the image client-side or requests the full-size image and scales it via CSS. This increases page weight. Always prefer a registered WordPress size over a custom Elementor dimension for performance-critical pages.
Divi
In Divi's Blog Module or Post Featured Image module, the Image Size option under Advanced controls which registered WordPress size is requested. Divi also has its own image size settings under Divi > Theme Options > General > Thumbnail Sizes, which register additional derivatives.
Method 5: Use a Plugin for No-Code Custom Image Sizes
If editing PHP is not an option, these plugins replicate the add_image_size() functionality through a UI:
| Plugin | Key Feature | Best For |
|---|
| — | — | — |
|---|
| Simple Image Sizes | Manage all registered sizes from Media Settings | General use, non-developers |
|---|
| Regenerate Thumbnails Advanced | Batch regeneration with selective size targeting | Large media libraries |
|---|
| Imsanity | Auto-resizes images on upload to a max dimension | Preventing oversized originals |
|---|
| ShortPixel Adaptive Images | Serves correctly sized images via CDN dynamically | Performance-focused sites |
|---|
Simple Image Sizes is the most direct replacement for add_image_size(). After installing it, navigate to Settings > Media — the plugin appends a custom sizes section below the core defaults. Define your size, save, and use the plugin's built-in regeneration to apply it.
Comparison: All Methods at a Glance
| Method | Technical Skill Required | Affects All Images | Survives Theme Updates | Best Use Case |
|---|
| — | — | — | — | — |
|---|
| Media Settings | None | After regeneration | Yes | Adjusting core size dimensions |
|---|
| Customizer / Theme Options | None | Depends on theme | Yes (theme-managed) | Premium themes with built-in controls |
|---|
| `functions.php` (child theme) | Intermediate PHP | After regeneration | Yes | Custom sizes, precise control |
|---|
| Page Builder UI | None | Per widget/page | Yes | Per-page layout variation |
|---|
| Plugin (Simple Image Sizes) | None | After regeneration | Yes | No-code custom size registration |
|---|
Performance and Image Optimization Considerations
Registering too many image sizes is a frequently overlooked server-side problem. Every registered size generates a new file on upload. A site with 15 registered sizes and 2,000 images in the media library has potentially 30,000 image files on disk. On shared hosting this fills quotas; on any server it inflates backup sizes.
Audit your registered sizes periodically. Use this snippet in a temporary plugin or functions.php to list all registered sizes:
add_action( 'wp_loaded', function() {
if ( current_user_can( 'manage_options' ) && isset( $_GET['show_image_sizes'] ) ) {
echo '<pre>';
print_r( wp_get_registered_image_subsizes() );
echo '</pre>';
exit;
}
} );Visit https://yoursite.com/?show_image_sizes=1 while logged in as an administrator to see the full list.
Additional performance practices:
- Use WebP format. WordPress 5.8+ converts uploaded images to WebP if your server's GD or Imagick library supports it. Verify support under Tools > Site Health.
- Implement lazy loading. WordPress adds
loading="lazy"to images below the fold by default since version 5.5. Ensure your customthe_post_thumbnail()calls preserve this attribute. - Compress before uploading. Tools like ShortPixel or Imagify integrate directly into the WordPress media pipeline and compress derivatives automatically. TinyPNG works well for manual pre-upload compression.
- Use a CDN. If your site serves a global audience, offloading image delivery to a CDN reduces latency independent of registered size count.
For sites with heavy image workloads — photography portfolios, news sites, WooCommerce stores — a VPS with cPanel gives you the server-level control to tune PHP memory limits, configure Imagick directly, and manage disk quotas that shared environments cannot offer.
Responsive Images and the srcset Attribute
WordPress automatically generates srcset and sizes attributes for images in content, pulling from all registered image sizes. This means every size you register contributes to the browser's ability to select the most appropriate resolution for the user's viewport and device pixel ratio.
When you call the_post_thumbnail(), WordPress outputs markup similar to:
<img src="hero-1200x600.jpg"
srcset="hero-400x300.jpg 400w, hero-800x400.jpg 800w, hero-1200x600.jpg 1200w"
sizes="(max-width: 600px) 400px, (max-width: 900px) 800px, 1200px"
alt="Post Title"
loading="lazy">The sizes attribute tells the browser how wide the image will render at various viewport widths. WordPress generates a default sizes value, but it is often inaccurate for complex layouts. Override it using the wp_calculate_image_sizes filter or by passing a custom sizes attribute in the $attr array of get_the_post_thumbnail().
SSL, Domain, and Hosting Context
If you are migrating a WordPress site to a new domain or switching from HTTP to HTTPS after obtaining an SSL Certificate, image URLs stored in post meta (_thumbnail_id references) are relative to the attachment ID and are not affected by domain changes. However, image URLs hardcoded in post content or theme options will need updating via a search-replace operation using WP-CLI:
wp search-replace 'http://olddomain.com' 'https://newdomain.com' --skip-columns=guidIf you are setting up a new WordPress installation from scratch, registering your domain through Domain Registration and pairing it with a properly configured hosting environment ensures your media upload paths and .htaccess rewrite rules are correct from the start, avoiding broken image URL patterns that are tedious to debug retroactively.
Technical Decision Checklist
Use this matrix to select the right approach for your situation:
- You need to change a core size (thumbnail/medium/large) and do not edit code — use Settings > Media, then regenerate thumbnails.
- Your premium theme has a Theme Options panel — check there first before touching any files.
- You need a size with exact pixel dimensions and hard cropping — use
add_image_size()in a child theme'sfunctions.php. - Your subject matter requires non-center cropping — pass a positional array as the fourth argument to
add_image_size(). - You use Elementor or Divi — use the builder's native Image Size control, but prefer registered WordPress sizes over "Custom" for performance.
- You cannot edit PHP and need a custom size — install Simple Image Sizes, define the size, regenerate.
- You have a large media library — use Regenerate Thumbnails Advanced, which allows selective regeneration by size name to avoid redundant processing.
- Performance is a priority — audit registered sizes, enable WebP, implement a CDN, and ensure lazy loading is active.
- You are on shared hosting and hitting memory or timeout errors during regeneration — consider migrating to a VPS Hosting plan where PHP limits are configurable.
FAQ
Why do my featured images still show the old size after I changed the Media Settings?
WordPress generates image derivatives at upload time. Changing a size definition in Settings > Media only affects new uploads. You must run a thumbnail regeneration tool — such as the Regenerate Thumbnails plugin — to resize files that are already in your media library.
What is the difference between add_image_size() with true versus false as the crop parameter?
Passing true forces WordPress to crop the image to the exact width and height you specify, centered by default. Passing false scales the image proportionally so that neither dimension exceeds your specified values, which means the actual output dimensions may be smaller than specified if the original aspect ratio differs.
Will registering many custom image sizes slow down my site?
Not at render time — WordPress serves pre-generated files. The performance cost occurs at upload time, when Imagick or GD must generate one derivative per registered size. Sites with many sizes and high upload volume can experience slow upload responses and significant disk usage growth.
Can I remove image sizes I no longer need?
Yes. Use remove_image_size( 'size-name' ) in your functions.php to stop generating a size for new uploads. Existing files for that size remain on disk until manually deleted. The WP-CLI command wp media regenerate --only-missing can help clean up by only generating missing sizes without recreating all derivatives.
Does changing the featured image size affect how images appear when shared on social media?
Not directly. Social platforms like Facebook and Twitter read Open Graph meta tags (og:image) to determine which image to display. These tags are typically set by an SEO plugin such as Yoast SEO or Rank Math, which registers its own image size (commonly 1200x630) specifically for social sharing. Changing your theme's featured image size does not alter the Open Graph image unless your SEO plugin is configured to use the same size handle.
