Removing Timthumb from a Custom Theme

Timthumb was a very popular php script for dynamically generating thumbnail images. That said it’s outdated and has performance issues when used with modern web host like Kinsta. The following is a walkthrough showing the steps I took to remove Timthumb from a custom theme for one of my customers.

Search for Timthumb usage using grep

Using grep on the command line you can quickly see all places where Timthumb is being used.

grep --include "*.php" -r -n "timthumb.php" wp-content/

Extract thumbnail dimensions using a pattern match

Copy that output into and use the regex timthumb.php.+h=(\d+)&w=(\d+) to select all thumbnail dimensions combinations. Under the Tools change the output to $1 $2\n which will output those dimensions.

Plan out the new thumbnail dimensions

Take those thumbnail dimensions into Google Spreadsheet and manually simply which sizes are actually needed. Start by grouping together similar aspect ratios and remove duplicates. For my set I was able to go from 11 unique dimensions down to 3 as shown in the following table.

Add new sizes, regenerate and update code

Add proper thumbnail images to the functions.php theme file as shown here.

add_image_size( 'category-thumb', 230, 150, true ); // 130 pixels wide and 150 pixels high
add_image_size( 'image-thumb', 360, 230, true );    // 360 pixels wide and 230 pixels high
add_image_size( 'box-thumb', 514, 486, true );      // 514 pixels wide and 486 pixels high

Next generate all missing thumbnails with a WP-CLI one-liner wp media regenerate --only-missing. Lastly, update each of the theme files to use the new format. While this may vary depending on how the thumbnails were embedded, here an example of what that might look like.

Old format

<img src="<?php print get_bloginfo("template_directory"); ?>/timthumb.php?src=<?php echo $attachments->src( 'full' ); ?>&h=116&w=152" />

New format

<img src="<?php echo $attachments->src( 'category-thumb' ); ?>" />