Enlarge thumbnail pictures on listing ads from 75px to 100px on Classipress 3.3

Thumbs on default theme for Classipress are too small and you can make them look better with just a little modification of style.css file. So, here we are going to enlarge thumbnail pictures on front page when looping ads.

The default size for thumbnails is 75 x 75px. Here is how you can make it look better by enlarging them to 100 x 100px.

This modification was tested on WordPress 3.5.2 and Classipress 3.3.

This tutorial requires you to change these two files:

wp-content/themes/classipress/style.css
wp-content/themes/classipress/includes/theme-functions.php

It is recommended to make backup of these two files before changing them.

Let’s start with style.css.

Step 1

Around line 242 find:
.content_res img.attachment-ad-thumb { max-width: 75px; }


Replace with:
.content_res img.attachment-ad-thumb { max-width: 100px; }

Around line 399 find:

.post-block .post-right {float:right;max-width:458px;min-width:380px;}

Replace with:

.post-block .post-right {float:right;max-width:433px;min-width:380px;}

Around line 1222 find:

      .post-block .post-left {  
           max-width: 102px; /* 102px / 560px */  
      }

Replace with:

      .post-block .post-left {  
           max-width: 127px; /* 102px / 560px */  
      }

Around line 1305 find:

      .post-block .post-left {  
           max-width: 85px;   
      }

Replace with:

      .post-block .post-left {  
           max-width: 110px;   
      }

Step 2

Now open file theme-functions.php (on newer versions of Classipress this file was renamed to functions.php)

Around line 337 find:

 $adthumbarray = wp_get_attachment_image( $image_id, 'ad-thumb' );

Replace with:

 $adthumbarray = wp_get_attachment_image( $image_id, 'ad-small' );

Around line 356 find:

 echo '<a title="' . the_title_attribute('echo=0') . '" href="' . get_permalink() . '"><img title="" src="' . appthemes_locate_template_uri('images/no-thumb-75.jpg') . '" alt="" />';</a>

Replace with:

 echo '<a title="' . the_title_attribute('echo=0') . '" href="' . get_permalink() . '"><img title="" src="' . appthemes_locate_template_uri('images/no-thumb-100.jpg') . '" alt="" width="100" height="100" /></a>';

Around line 540 find:

 $img_check = '<img title="" src="' . appthemes_locate_template_uri('images/no-thumb-75.jpg') . '" alt="" />';

Replace with:

 $img_check = '<img title="" src="' . appthemes_locate_template_uri('images/no-thumb-100.jpg') . '" alt="" width="100" height="100" />';

That’s it. Now you have a better looking classipress site.

If you find any issues with this tutorial, please be so kind and write a comment. I’ll try to help as much as I can.

If you find this tutorial useful, please consider making a small donation.