WordPress: Enabling Category Images

By April 29, 2020WordPress
Entering number of credit card on website

Out of the box, WordPress does not enable images to be used for post categories. This can be enabled through the use of the Category Images II plugin.

Installation


Download category-images-ii.zip and extract on your computer. Upload the entire category-images-ii directory to your /wp-content/plugins directory. Log into the WordPress and click Plugins on the left side of the page. Under Actions (right side of the page) click Activate.

Using FTP, visit the wp-content/upload/ folder and there should be a subfolder named category-images-ii. Set the permissions on this folder to allow for category images to be placed here. 777 should work.

Adding Category Images


Click the downward arrow to the right of Post (first item under Dashboard). Click Categories.

To add an image to an existing category, click the category name to edit the category. Near the bottom of the edit category page, you will see “Upload a Category Image”. Click Browse. Navigate to the location of the image you wish to use on your computer. Select the image file and click Open. Click Update Category.

Adding Category images to Theme

Prior to category images becoming viewable, you will need to add the following to the desired page for the theme being used by WordPress. Using the default theme as an example, to add category images to the main page in the index.php file under wp-content/themes/default look for the following:

This will start pulling in posts from the database. Add the following code at the desired place inside this while loop.

lt; ?php ciii_category_images(); ? gt;

(remove spaces from lt; ?php and ? gt;)

A recommended place would be right after the h2 for the post title the_title() (before the a href). Save index.php and re-upload the file.

Modifying Category Image Appearance

By default, the category image is displayed inside an unordered list. To remove this feature, copy the view folder under wp-content/plugins/category-images-ii to your theme folder (using the default theme again) at wp-content/themes/default/view/. Edit the file at wp-content/themes/stblog/view/category-images-ii/category-images.php by removing all ul and li tags.

Now your category image will show to the left of the article title for each posting. If no category image set, none will be displayed.