AutoBlogged has a built-in thumbnail feature that automatically creates thumbnails for images in posts. However, a number of premium themes use their own scripts such as TimThumb or Viva Thumbs for handling thumbnails. Because these scripts often use the same custom WordPress fields that AutoBlogged uses, you will sometimes see HTML code or an error message in place of the thumbnail image.

AutoBlogged automatically adds the custom fields image and thumbnail that contain the HTML IMG tag to display the image. However, some themes or thumbnail plugins also uses this custom field but expect it to contain a relative path to the image file.

For example, the image custom field might contain something like this:

<img src=”http://example.com/wp-content/uploads/2010/02/xxxxxxxxxx.jpg” />

But your theme expects to see something like this:

/wp-content/uploads/2010/02/xxxxxxxxxx.jpg

Using the AutoBlogged custom fields feature you can easily change the format of the image or thumbnail custom fields to provide the image format you need. You may need to review the documentation for the theme or script to determine which custom field name it is looking for and how it wants image paths formatted.

Using Custom Fields

Depending on how your theme or thumbnail script expects to see the image path, you can use different custom field settings. Below are the three most common cases we see.

Note that depending on your theme or script, you may need to use a different custom field name such as Image, Thumbnail, etc. Keep in mind that in WordPress, case is important so a field named image is not the same as one named Image.

1. The script expects a full HTTP URL to the image

Set up a custom field with these values:

Custom Field: image

Custom Field Value: %image_url%

2. The script expects a file path relative to your web root

First, check the feed setting Save local copies of all images in the feed and uncheck the setting Create local thumbnails for each image. Then set up a custom field with these values:

Custom Field: image

Custom Field Value: %image_path%

3. The script expects a file path relative to the WordPress uploads directory:

First, check the feed setting Save local copies of all images in the feed and uncheck the setting Create local thumbnails for each image.

Next, set up a search and replace with these values:

Search for: /wp-content/uploads/

Replace with:  /

Then set up a custom field with these values:

Custom Field: image

Custom Field Value: %image_path%

The Custom Field Value uses the same syntax as post templates, so you can use any variable that you would use there. Here are the image-related variables available:

%image% – The full HTML IMG tag to display an image, for example <img src=”http://farm3.static.flickr.com/2712/xxxxxxxx.jpg” />

%image_url% – The full URL to the image, for example http://farm3.static.flickr.com/2712/xxxxxxxx.jpg

%image_path% – The relative path to the image, normally useful only if you cache images locally, for example /wp-content/uploads/2010/02/xxxxx-150×93.jpg

%thumbnail% – The full HTML IMG tag to display the locally created image thumbnail, for example <img src=”http://example.com/wp-content/uploads/2010/02/xxxxx-150×93.jpg” />

%thumbnail_url% – The full URL to the thumbnail, for example http://example.com/wp-content/uploads/2010/02/xxxxx-150×93.jpg

%thumbnail_path% – The relative path to the thumbnail, normally useful only if you cache images locally, for example /wp-content/uploads/2010/02/xxxxx-150×93.jpg

If you come across any situations where you need to set up custom fields to get your theme or plugins to work correctly, we’d like to hear about them in the comments below.

The Arthemia Premium theme is a perfect theme for autoblogs. It has a clean and professional look and is easy to navigate. Customizing the theme is fairly easy and a full-featured options page means you don’t need to edit too much of the theme itself.
The theme has nice drop-down navigation menus for categories you select and has built-in support for banner ads, Google AdSense, Google Analytics, and FeedBurner.

We have certified the Arthemia Premium theme for use with AutoBlogged and highly recommend it! You can see the Arthemia Premium theme in action at http://mspatchwatch.com.

AutoBlogged Integration

Arthemia Premium will automatically create a thumbnail for each post based on the value of the Image custom field as described in this article. AutoBlogged will automatically perform all these steps for you and create the Image custom field when it encounters an image in a post. The Arthemia theme will use this field to display post thumbnails if they exist.

Implementation Notes

• To use the auto thumbnail feature you must check the Save local copies of all images in the feed box under each feed’s settings.
• Under the Arthemia options page you must set the Thumbnail Assignment setting to Post Custom Field.
• The auto thumbnail feature currently only supports JPG images.
• Because the theme creates its own thumbnails you should remove %if:thumbnail%<p>%thumbnail%</p>%endif:thumbnail% from the post template.

Embedded Videos

The Arthemia theme currently only supports the automatic embedding of YouTube videos. If using an YouTube feed, you can take advantage of Arthemia’s built-in video support through AutoBlogged by creating a custom field in your feed settings named Video with the value %Video_URL%.  Note that if you do this, you should remove %if:video%<p>%video%</p>%endif:video% from your post template.

AutoBlogged uses WordPress to create thumbnails. To change the size of thumbnails that AutoBlogged creates, go  Settings -> Media in WordPress and set the thumbnail size there.

Many premium WordPress themes make extensive use of thumbnails or featured images in your posts, but many feeds just don’t provide good images to work with. Rather than letting this feature go unused, there is a little trick you can use to add images to each post.

In one of our sample sites AdvertiserGuide.us, we are using the very cool Gazette Edition theme by WooThemes. The design of this theme relies heavily on the cross-fading featured images at the top, as well as thumbnails for each article, but most of the articles we were using simply didn’t have any associated images.

To fix this, we went to sites like istockphoto.com and www.sxc.hu to download both free and purchased stock photos that seemed relevant to the theme, yet generic enough to use with any article. We gathered 50 good photos, resized them all to the same size, and then renamed them 1.jpg through 50.jpg and uploaded them to our site.

Next, for each feed that doesn’t produce good images we added a custom field in AutoBlogged called Image. Note that the Gazette Edition theme specifically looks for images in this custom field. We set the value of the field as follows:

http://advertiserguide.us/img/[1|2|3|4|5|6|7|8|9|10|11|12|13|14|15|16|17|18|19|20|21|22|23|
24|25|26|27|28|29|30|31|32|33|34|35|35|37|38|39|40|41|42|43|44|45|46|47|48|49|50].jpg

Below is a screen shot of that setting:

You can use post template syntax in your custom field values and bracketed values separated by pipes indicates to AutoBlogged to pick a random value from the list. In other words, AutoBlogged will randomly pick a number between 1 and 50 to create Image field values like these:

http://advertiserguides.us/img/13.jpg

http://advertiserguides.us/img/8.jpg

http://advertiserguides.us/img/41.jpg

http://advertiserguides.us/img/19.jpg

With just 50 images we do sometimes get two or more articles with the same picture on the front page but for the most part that isn’t that big of a deal and it greatly improves the look and professionalism of the site.