Custom WordPress Thumbnails

You may find this post interesting if you are using the built-in WordPress method for uploading and inserting photographs, which I have only just recently given in to using as explained in Multiple WordPress Photo Albums On Same Post.

Once you have uploaded any media to your WordPress blog, you can access it through your Media Library within your Admin Dashboard. From there you can give each file a Title, Alternative Text (web accessibility), Caption and Description. You can even perform some basic edits to change how the photograph will appear, and even limit your edits to certain sizes of the photograph. WordPress will typically make five or six versions of each file that you import based on predefined dimensions which you may edit. You may change these dimensions along with the upload location of all media in the “Media Settings” page of the Admin Dashboard (Dashboard > Settings > Media).

As I said, when you upload your photographs, WordPress does some “crunching” and creates alternate versions. These versions are stored with the original file and have file names appended with their resized dimensions. For instance:

The file “wordpress_gallery_id.jpg” was something I uploaded for a different post. In the case of this file, because it’s a Windows screen capture the WordPress resized versions are absolutely useless, however if this was a photograph, the alternative versions are nice because they can be used for people with lower screen resolutions.

The file that I want to concentrate on is the “-120×120” version, which is the Thumbnail. By default, WordPress scales the original file to make this thumbnail file, which I personally do not find very useful. You may use the built in tools to change how the thumbnail will look however I find this to be inflexible and tedious. What I prefer (perhaps because I’m used to doing things the long way), is to include making my own thumbnails as part of my photo preparation process.

If you make your own thumbnail files, then all you have to do is rename them to the names WordPress uses (filename-120×120.jpg) and overwrite the WordPress generated files. Just use an FTP client, navigate to the upload folder and overwrite. Very simple! That’s the reason all of my thumbnails have a white vignette on their edges.


3 comments to Custom WordPress Thumbnails