Roconpaas

Blog

WordPress Featured Image Blog Post Divi Size

August 13, 2026 Written by Saurabh Rai

WordPress Keeps Logging Me Out

Choosing the right WordPress featured image blog post Divi size can save you from a lot of image problems later. If your featured image looks cropped, blurry, or stretched in a Divi blog layout, the image dimensions or aspect ratio may be the reason.

Divi displays featured images in different places, including blog grids, single posts, and full-width layouts. Each layout can display the same image differently, so an image that looks fine in one place may not look right in another.

The Divi featured image size also affects image quality and page performance. Uploading an image that is much larger than the space where it will appear can add unnecessary file weight, while a small image may look soft when displayed at a larger size.

In this guide, we’ll cover the recommended image sizes for common Divi layouts, explain why featured images get cropped, and show you how to prepare and optimize them for WordPress. We’ll also cover Divi settings and a few ways to keep your images consistent across different screen sizes.

How Divi Handles WordPress Featured Images

Before choosing a Divi featured image size, it helps to understand what happens after you upload an image to WordPress.

WordPress automatically creates several image versions, including thumbnail, medium, large, and the original full-size file. Your theme and plugins can also create additional image sizes.

Divi then uses these images in its different modules. For example, the Divi Blog Module can use cropped versions of featured images for post listings. This is one reason an image may look different after you add it to a blog layout.

Aspect Ratio Matters too

The shape of your image can affect how Divi displays it. The Blog Module commonly uses a 16:10 aspect ratio for featured images in certain layouts. If your original image has a very different shape, Divi may crop it to fit the available space.

This can make the same featured image look different in a grid, a single post layout, or a full-width module.

Divi can display featured images in several places, including:

  • Blog grid listings
  • Single post headers
  • Full-width blog layouts
  • Blog Extras and other third-party modules

Because each layout can display an image differently, choosing a consistent aspect ratio and suitable image dimensions can help keep your featured images looking clean across your site.

Exact Featured Image Sizes for Divi by Layout

Here’s the reference you’ve been looking for. If you want your images to display perfectly in Divi without cropping or distortion, use these recommended sizes:

Divi Layout / Column Recommended Size Aspect Ratio Retina (2×) Size Typical Use Case
Single post header / full-width blog module 1080–1920px wide 16:9 or 16:10 2160–3840px wide Hero images, large headers
2/3 column 700px wide 16:10 1400px wide Blog grid with larger cards
1/2 column 510px wide 16:10 1020px wide Two-column layouts
1/3 column 320px wide 16:10 640px wide Blog grids, small previews
Grid/list thumbnail (Divi default) 400×250px 16:10 800×500px Blog Module default thumbnail
Social/OG sharing 1200×628px ~1.91:1 2400×1256px Facebook, LinkedIn, Twitter previews

Pro Tip: If you want a one-size-fits-all solution, export images at 1200×675px. It aligns closely with Divi’s aspect ratio, looks good on most grids, and works well for social sharing.

Why You’re Seeing Blurred or Cropped Featured Images

If your featured images look wrong, it usually comes down to one of these issues:

  1. Wrong aspect ratio
    Divi expects 16:10, but you uploaded something taller or wider. The system auto-crops, cutting off important parts of your image.
  2. Low-resolution upload
    If your uploaded image is smaller than what Divi needs (say 600px wide on a full-width blog), WordPress will stretch it. That’s when you get the dreaded blur.
  3. Theme cropping rules
    WordPress + Divi generate preset sizes. If none of those sizes fit your layout, WordPress serves the closest match and crops the rest.
  4. Caching & old thumbnails
    Sometimes, you’ve fixed your sizes but still see the wrong crop because WordPress is using an old thumbnail. That’s why regenerating thumbnails often fixes the issue.

Prepare and Export Perfect Featured Images

Here’s the workflow I recommend for creating flawless featured images:

  1. Start with the right canvas size
    Always design/export at the largest size you’ll need. For most Divi blogs, that’s at least 1920×1080px.
  2. Keep the aspect ratio consistent
    Stick to 16:10 (or 16:9 if you prefer social media harmony). This prevents Divi from chopping off parts of your image.
  3. Use the safe zone
    Keep important text or subjects away from the edges — Divi grids and some social networks crop tighter.
  4. Export in the right format
    • JPEG for photos
    • PNG for graphics with transparency
    • WebP for best of both worlds (smaller file sizes, great quality)
  5. Control file size
    Aim for under 200KB. Use tools like TinyPNG, ShortPixel, or ImageOptim to compress without losing visible quality.
  6. Create retina-ready versions
    Export at 2× (e.g., 2160px instead of 1080px) so Divi’s responsive system (srcset) can serve crisp images on high-DPI devices.
  7. Batch process if you publish often
    Use Photoshop actions, Affinity presets, or even command-line tools like ImageMagick to automate resizing.

Divi Settings and Module Tweaks to Preserve Featured Images

The biggest problem with the Divi featured image is images stretching, blurring or getting cropped weirdly in different layouts. The good news is Divi gives you loads of control through the Blog Module and other design settings—you just need to know which ones to use and when. Let’s get into it.

Blog Module Settings: Thumbnail Size Options

When you drop a Blog Module into your Divi layout, you’ll find a setting called “Featured Image Size” under Design → Layout → Featured Image. By default, you’ll usually see three choices:

  • Medium – WordPress-generated version (usually 300px wide). Good for very small grid layouts, but not ideal for larger cards.
  • Large – A WordPress-generated size (commonly 1024px wide). Works well for grid layouts with 2–3 columns.
  • Full – The original uploaded image, without resizing. Best for single-column blog feeds or featured posts.

When to use each:

  • If you’re building a multi-column blog grid, use Large to keep images sharp but not oversized.
  • If you want maximum clarity for a single-column or featured post, go with Full—but only if your uploaded image is optimized (ideally 1200px or more in width).
  • Avoid relying on Medium unless your thumbnails are tiny; otherwise, they’ll look blurry on modern devices.

Choosing Between “Full” and “Large” in Divi

This is where many Divi users get confused. Both “Full” and “Large” sound like they’ll deliver high-quality images, but the choice really depends on your workflow:

  • Use Large when performance matters most. WordPress creates a “Large” size (around 1024px wide by default), which is often enough for blog grids or cards. Since the file size is smaller, your pages load faster without noticeably losing quality.
  • Use Full when sharpness is critical. If you’re running a photography blog, design portfolio, or magazine-style layout, “Full” ensures your featured image matches the original clarity. But remember—if your original upload is 4000px wide, serving that “Full” image in a small blog grid is overkill and will slow down your site.

Pro tip: If you want the best of both worlds, register a custom Divi image size (e.g., 800×450 for blog grids) in your child theme. Then you can assign that size specifically for your Blog Module, keeping consistency and performance in check.

How the Blog Grid and Extras Modules Select Thumbnail Sizes

Divi offers two primary ways to display blog posts visually:

  1. Blog Grid Layout (inside the Blog Module).
  2. Third-party modules like Blog Extras (popular in Divi marketplaces).

Here’s how they handle featured images differently:

  • Blog Grid Layout: By default, the grid pulls from WordPress’s registered image sizes. If you select “Large,” Divi uses the cropped 1024px version. If you select “Full,” it loads the original upload. The challenge is, WordPress doesn’t crop all images to the same aspect ratio—so some thumbnails may look mismatched.
  • Blog Extras Module: These often add advanced layout options (masonry grids, magazine layouts, etc.) and may default to using Medium or Large sizes. Some even have built-in settings to crop or force a ratio (like 16:9 or square).

When to change:

  • If your grid looks uneven, switch to a plugin/module that supports fixed aspect ratios.
  • If you want total control, manually crop and upload consistent sizes (e.g., always 1200×675px). Divi will then scale them properly no matter which module you use.

Practical Workflow to Preserve Image Quality

Here’s a step-by-step approach that solves 90% of Divi featured image headaches:

  1. Upload consistent images. Aim for 2× resolution (e.g., 1200×675px for grids, 1920×1080px for hero layouts).
  2. In Blog Module → Featured Image Size, pick Large for grids and Full for single posts.
  3. If inconsistent crops appear, add a custom image size in functions.php and reassign it to the module.
  4. Test across devices. Always preview your blog module on desktop, tablet, and mobile to confirm no blurriness or awkward cropping.
  5. Optimize file sizes. Use plugins like ShortPixel or Imagify to keep load times fast without sacrificing clarity.

By using these Divi settings and blog module options you can control the WordPress featured image across your whole site. The key is consistency: choose one workflow, stick to the same aspect ratio and let Divi do the rest.

Two Bulletproof Fixes for Cropping & Aspect Issues

Even with the right upload size, Divi sometimes insists on cropping your featured images. Here are two reliable fixes you can apply — one quick CSS tweak, and one safer developer approach.

1. CSS Fix (Quick and Easy)

If Divi’s Blog Module is cropping your images to a fixed aspect ratio, you can override it with custom CSS.

Go to Divi → Theme Options → Custom CSS and paste this:

.et_pb_image_container img {

    object-fit: cover;

    height: auto;

    width: 100%;

}

This tells Divi to display the full image proportionally rather than force-cropping it. The object-fit property is the hero here — it makes sure your images fill their container without distortion.

Best for: Non-technical users who want a quick fix without touching theme files.

2. functions.php Fix (Developer-Friendly)

If you want total control, register custom image sizes that align with Divi’s column widths. Add this code to your child theme’s functions.php file:

function custom_divi_image_sizes() {

    add_image_size(‘divi_full’, 1080, 0, false); // full width

    add_image_size(‘divi_two_third’, 700, 0, false);

    add_image_size(‘divi_half’, 510, 0, false);

    add_image_size(‘divi_one_third’, 320, 0, false);

}

add_action(‘after_setup_theme’, ‘custom_divi_image_sizes’);

Then, install and run the Regenerate Thumbnails plugin so WordPress creates these sizes for all your existing images.

Best for: Developers or site owners who want consistent sizing across all posts and layouts.

How to Register Divi-Friendly Image Sizes in Theme

To take the functions.php method further, you can explicitly tell Divi to use these new sizes. Here’s how:

  1. Register sizes as shown above.
  2. Use the wp_get_attachment_image_src() function in your templates to call these sizes directly.
  3. If you’re working with custom modules, you can hook into Divi’s filters (like et_pb_blog_image_width) to specify which size should load.

By doing this, you’re making sure Divi doesn’t guess which WordPress size to use — you’re telling it exactly what you want. This approach keeps everything consistent and avoids the blurry-or-cropped lottery.

Image Optimization & Performance

A stunning featured image means nothing if it slows down your site. Google cares about speed, and users bounce from slow-loading blogs. Here’s how to optimize without losing quality:

  • Use WebP or AVIF formats whenever possible. They’re much smaller than JPEG/PNG but still sharp.
  • Compress smartly — tools like ShortPixel, Imagify, or TinyPNG can shrink images by 60–80% with minimal loss.
  • Lazy load below-the-fold images. WordPress 5.5+ does this by default, but always test it.
  • Keep image weight low. Aim for under 200KB for featured images, especially if they appear multiple times (grid, related posts, etc.).
  • Serve via CDN. A content delivery network like Cloudflare or BunnyCDN ensures images load fast worldwide.

Remember: a large 2MB featured image can be the difference between a 90+ Google PageSpeed score and a failing one.

Social Sharing, Open Graph, and Structured Data

Here’s a trap many Divi users fall into: an image looks perfect on the site but shows up cropped or pixelated when shared on Facebook or LinkedIn. That’s because social platforms pull from Open Graph (OG) tags, not from what Divi displays.

Best practice:

  • Upload a separate 1200×628px image specifically for social sharing.
  • In Yoast SEO or RankMath, set your OG image under “Social” → “Facebook Image.”
  • For Twitter, enable “Twitter Card” and provide a 1200×628 image as well.

By separating social images from Divi images, you guarantee both look their best, no matter the platform.

Tools and Plugins Roundup

Here are the most useful plugins and tools to streamline your workflow:

  • Regenerate Thumbnails: refresh image sizes after changes.
  • ShortPixel / Imagify / Smush: compress and optimize images.
  • WebP Express: serve modern formats automatically.
  • Canva / Photoshop / Affinity Photo: quick export in correct ratios.
  • Divi Blog Extras: adds more blog display options (but watch how it handles image sizes).

Divi Featured Image Size Guide

Here’s the condensed version you can pin to your desk:

  • Full width → 1080–1920px (use 2160px for retina)
  • 2/3 column → 700px (1400px retina)
  • 1/2 column → 510px (1020px retina)
  • 1/3 column → 320px (640px retina)
  • Grid/list thumbnail → 400×250px (800×500px retina)
  • Social sharing → 1200×628px (2400px retina)

Conclusion

For the WordPress featured image blog post Divi size the rule of thumb is to balance quality with performance. After testing across layouts and devices the best workflow is to upload images at 2x the recommended size—for example 1200×675 for landscape blog thumbnails or 2160×1350 for full-width Divi modules. This way you get sharp images on retina screens and small file sizes.

Add Divi’s custom image size registration in your functions.php (or a child theme) so WordPress always delivers perfectly cropped images without manual resizing. Saves time, no blurry images and a consistent design.

To make it even easier, grab our Divi Featured Image Size guide and try the sample code snippet above—you’ll never second guess your image sizes again.

Divi Featured Image Size FAQs

1. What size should a featured image be for a Divi blog post?

For most Divi blog layouts, a featured image around 1200 × 675 pixels works well as a general-purpose size. It uses a 16:9 ratio and can be displayed cleanly across common blog layouts.

2. What is the recommended Divi featured image size?

The right size depends on the Divi layout. The article recommends around 400 × 250 pixels for default grid thumbnails, 700 pixels wide for 2/3-column layouts, 510 pixels for 1/2-column layouts, and 320 pixels for 1/3-column layouts.

3. Why does Divi crop my featured images?

Divi may crop featured images to fit the dimensions and aspect ratio of the module you’re using. If your original image has a different shape, important parts of the image may be cut off when it appears in a blog grid or other layout.

4. Why is my Divi featured image blurry?

A featured image can look blurry when the source image is too small for the space where Divi displays it. Using a sufficiently large, optimized image and selecting an appropriate image size in the Divi Blog Module can help prevent this.

5. What aspect ratio should I use for Divi featured images?

A 16:10 aspect ratio works well with many Divi Blog Module layouts. A 16:9 ratio can also be useful when you want your featured images to work well with common social media formats.

Avatar photo

Saurabh Rai

Saurabh is a WordPress developer and technical writer with 4+ years of experience delivering solutions for clients across diverse industries. His writing cuts through the noise - no documentation rewrites, no generic tutorials. Just practical, experience-backed insights on the WordPress problems developers and site owners actually face.

Start the conversation.

    Leave a Reply

    Your email address will not be published. Required fields are marked *

    Recommended articles

    WordPress

    53zjckcremjnyfos

    Sreekar

    WordPress

    Why Managed Kubernetes is Future of WordPress Hosting

    Ankit

    WordPress

    Kinsta vs Rocon: Price, Speed & Features Compared

    Maria