How to Add Thumbnails to Your Blog Page and Category Archive Pages

[tutorials]

Archive Page

Open archive.php and replace this:

<?php get_header(); ?>

with this:

<?php

get_header();

function sp_read_more_from($position) {
        ?>
                <strong><a href="<?php echo get_category_link(get_theme_mod($position)); ?>" rel="bookmark"><?php _e("Read More Posts From", 'studiopress'); echo " ". cat_id_to_name(get_theme_mod($position)); ?> &raquo;</a></strong>
        <?php
}

function sp_post_thumb($post, $position) {
        if( get_post_meta($post->ID, "thumb", true) ):
?>
        <a href="<?php the_permalink() ?>" rel="bookmark">
                <img class="thumb" src="<?php bloginfo('template_directory'); ?>/tools/timthumb.php?src=<?php echo get_post_meta($post->ID, "thumb", $single = true); ?>&amp;h=<?php echo get_theme_mod($position.'_thumb_height'); ?>&amp;w=<?php echo get_theme_mod($position.'_thumb_width'); ?>&amp;zc=1" alt="<?php the_title(); ?>" />
        </a>
<?php
        else:
                // You might want to show a default image?
        endif;
}
?>

Then add this:

   <?php sp_post_thumb($post, 'featured_main'); ?>

immediately above this:

  <?php the_excerpt(); ?>

This will place a thumbnail image the same size as the image chosen in Featured Main in your theme options panel.

Blog Page

Open page_blog.php and replace this:

<?php get_header(); ?>

with this:

<?php

get_header();

function sp_read_more_from($position) {
        ?>
                <strong><a href="<?php echo get_category_link(get_theme_mod($position)); ?>" rel="bookmark"><?php _e("Read More Posts From", 'studiopress'); echo " ". cat_id_to_name(get_theme_mod($position)); ?> &raquo;</a></strong>
        <?php
}

function sp_post_thumb($post, $position) {
        if( get_post_meta($post->ID, "thumb", true) ):
?>
        <a href="<?php the_permalink() ?>" rel="bookmark">
                <img class="thumb" src="<?php bloginfo('template_directory'); ?>/tools/timthumb.php?src=<?php echo get_post_meta($post->ID, "thumb", $single = true); ?>&amp;h=<?php echo get_theme_mod($position.'_thumb_height'); ?>&amp;w=<?php echo get_theme_mod($position.'_thumb_width'); ?>&amp;zc=1" alt="<?php the_title(); ?>" />
        </a>
<?php
        else:
                // You might want to show a default image?
        endif;
}
?>

Then add this:

   <?php sp_post_thumb($post, 'featured_main'); ?>

immediately above this:

  <?php the_excerpt(); ?>

This will place a thumbnail image the same size as the image chosen in Featured Main in your theme options panel.