wordpress

What Size Image to Use on WordPress

Posted on by Prakash Tiwari

When you upload images to WordPress, you want them to look good. You also want them to load fast. If your images are too big, your site becomes slow. If they are too small, they look blurry. That’s why you need the right image size.

In this guide, I will help you understand what size image to use on WordPress. I will also cover different image types, where to use them, and how to ensure they work well on all devices.

Default WordPress Image Sizes

When you upload an image to WordPress, it automatically creates different versions. These are the default sizes:

  1. Thumbnail – 150 x 150 pixels
  2. Medium – 300 x 300 pixels
  3. Large – 1024 x 1024 pixels
  4. Full Size – The original size you uploaded

You can change these in your dashboard:

  • Go to Settings > Media
  • Adjust the dimensions
  • Click Save Changes

Best Image Sizes for Common Uses in WordPress

Here are the most common places you use images and their ideal sizes.

1. Featured Image (Blog Post Thumbnail)

  • Best size: 1200 x 628 pixels
  • Why: This works well with social sharing and most WordPress themes.

2. Header Image

  • Best size: 1600 x 500 pixels
  • Why: Wide enough for desktop and readable on mobile.

3. Banner Image or Hero Section

  • Best size: 1920 x 1080 pixels
  • Why: Full-screen sections need high-resolution images.

4. Background Image

  • Best size: 1920 x 1200 pixels
  • Why: Covers the screen without losing quality.

5. Logo

  • Best size: 200 x 100 pixels
  • Why: Logos should be small and lightweight. Use transparent PNGs if needed.

6. Gallery Image

  • Best size: 800 x 600 pixels
  • Why: This keeps the layout clean and loads quickly.

7. Product Image (For WooCommerce)

  • Best size: 800 x 800 pixels
  • Why: The square format looks better in product listings.

8. Sidebar Image or Widget Image

  • Best size: 300 x 250 pixels
  • Why: Small but precise for sidebar display.

Use the Right Format

Besides size, you must choose the correct format.

  • JPG (JPEG): Good for photos and smooth gradients
  • PNG: Best for images with text, logos, and transparent background
  • WEBP: Modern format that loads fast without losing quality
  • SVG: Best for logos and icons but needs extra care in WordPress

WordPress now supports WEBP and is better for performance. Use it when possible.

How to Resize Images Before Upload

You should resize images before uploading them. This saves time and improves site speed.

Tools You Can Use:

  • Canva – Free and easy for basic resizing
  • Photoshop – Great for advanced editing
  • TinyPNG – Compresses and resizes images
  • IrfanView – Lightweight image editor for Windows
  • Preview – Default app on Mac to resize images

Always resize your image to the exact size you need. Don’t upload a large image, and scale it down using code. That still loads the full image in the background.

Optimize Images After Upload

Even after uploading, you can reduce the file size.

Use Image Optimization Plugins:

  • Smush
  • ShortPixel
  • EWWW Image Optimizer
  • Imagify

These plugins compress images without reducing visual quality. This helps your site load faster.

How to Set Custom Image Sizes in WordPress

Sometimes, you want more control over image sizes. You can add custom image sizes using code.

Steps to Add Custom Sizes:

  1. Open your theme’s functions.php file
  2. Add this code:

add_image_size( ‘custom-size’, 600, 400, true );

  1. Use this image size in your template files or page builders.

This way, WordPress generates an image with that exact size when you upload it.

Use a CDN for Faster Image Delivery

A CDN (Content Delivery Network) stores your images on servers worldwide, helping you deliver images faster.

Popular CDN Services:

Most caching plugins allow you to integrate a CDN. This is useful if you have many images or high traffic.

Mobile-Friendly Image Sizes

Many users visit websites on mobile. You need images that fit smaller screens.

  • Don’t use images larger than needed
  • Use responsive image tags (WordPress does this by default)
  • Test how images look on phones and tablets

Always check your site on different devices to make sure images look good.

Final Tips

  • Use high-quality images, but keep file sizes small
  • Use the right size for each section of your site
  • Always compress and optimize your images
  • Use proper formats like WEBP or JPG
  • Avoid uploading massive images just to crop them later

Conclusion

Using the right image size in WordPress makes your site look better and run faster. You don’t need large files or blurry photos. Just use the correct size, format, and tools.

Keep your images clean, sharp, and fast. That’s the best way to create a great user experience on your WordPress website.