Using lower resolution/size images for thumbnails on posts index

Question

In each of my post I set a feature image with a width of 800px.

This is fine, however if I browse to the blog index page, which shows all posts (the feature image + an excerpt), then I end up with a heavy page because there are 20 posts per page, so that's 20 images of 800px.

On the blog index page, how can I set the thumbnail to be of a smaller size. Actually it appears smaller but it is still using the same image as the feature image. So how can I use a smaller image for thumbnails ?

Answer 1

You will have to edit your theme files for that, but you can use the_post_thumbnail (Codex) to show the featured image in a smaller size.

This is an example from the Codex which you can probably use 1 to 1:

<?php if ( has_post_thumbnail() ) : ?>
   <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
      <?php the_post_thumbnail(); ?>
   </a>
<?php endif; ?>

It works fine and helps a lot with getting better load times.