Kadence – Image Sizes and Fixing Blurry Images

This guide will show you how to:

  • Adjust image size and image ratio in the Customizer for the blog/category pages and single posts
  • Change the image ratio and image size in the Kadence Posts block, Kadence Image block, or Kadence Gallery block inside the editor
  • Fix common issues with blurry images

Blog & Category Page Images

  1. From your WordPress dashboard, navigate to Appearance > Customize > Posts/Pages Layout
  2. Click Archive Layout
  3. Scroll down to the bottom to the Post Item Layout section
  4. Find Feature and open the settings
  5. Here you can adjust both the image ratio and image size
  • Adjust the Image Ratio (e.g., 1:1, 3:4, 2:3) to control the shape of the featured image.
  • Choose an Image Size (thumbnail, medium, large, full, etc.) to ensure images display at the correct resolution.

πŸ’‘ Tip: Selecting the "Full" image size is not always the best choice– opt for an image size that balances quality and page load speed. If your images look mostly fine at a medium large size, use "medium large" over "full" to save a bit on page load time.

Single Post Page Featured Image

  1. From your WordPress dashboard, navigate to Appearance > Customize > Posts/Pages Layout
  2. Click Single Post Layout
  3. Scroll down until you find Featured Image Ratio

πŸ’‘ Tip: Use "Inherit" to inherit the original ratio shape you uploaded the image at.

Kadence Posts Block Featured Images

If you're using a Kadence Posts block inside a page to display blog posts, you can customize how featured images appear in the block settings.

  1. Open the page where you have a Posts block.
  2. Click somewhere on the Kadence Posts Block to select it and the Block Settings Panel will appear on the right-hand side.
  3. Click the Style tab and then open Image Settings

Kadence Image block (adv) or Gallery block images

Images still blurry?

If your images still appear appear blurry, here are a couple of possible reasons:

Image Compression is Reducing Quality

How to fix:

  • Avoid overly aggressive compression when uploading images, especially if you have an image optimization plugin that is optimizing the image even more after uploading to the media.
  • If using an image optimization plugin, adjust the compression settings to balance quality and file size.

Image is Simply Too Small

How to fix:

  • Re-upload your images at a larger size

πŸ’‘ Tip: Keep the size of the area that the image is going into in mind. If the image is only 600 pixels wide, but it's going to be placed and stretched into an area that is 800 pixels wide, then the image will appear blurry. In this case, you'd want to upload the image at at least 800px.

Still need help? Contact Us Contact Us