mfields / Taxonomy-Images

Enables WordPress users to easily associate images from the media library to categories, tags and custom taxonomies.
http://wordpress.mfields.org/plugins/taxonomy-images/
52 stars 21 forks source link

Taxonomy Images

A WordPress plugin that enables you to associate images from your media library to categories, tags and custom taxonomies. For usage instructions please view the screencast.

Displaying Your Images in Your Theme

There are a few filters that you can use in your theme to display the image associations created by this plugin. Please read below for detailed information.

Display a single image representing the term archive

The following filter will display the image associated with the term asked for in the query string of the url. This filter only works in views that naturally use templates like category.php, tag.php taxonomy.php and all of their derivatives. Please read about template hierarchy for more information about these templates. The simplest use of this filter looks like:

print apply_filters( 'taxonomy-images-queried-term-image', '' );

This code will generate and print an image tag. It's output can be modifed by passig an optional third parameter to apply filters. This parameter is an array and the following keys may be set:

Here's an example of what a fully customized version of this filter might look like:

print apply_filters( 'taxonomy-images-queried-term-image', '', array(
    'after' => '</div>'
'attr' => array(
    'alt'   => 'Custom alternative text',
    'class' => 'my-class-list bunnies turtles',
    'src'   => 'this-is-where-the-image-lives.png',
    'title' => 'Custom Title',
    ),
'before' => '<div id="my-custom-div">',
'image_size' => 'medium',
) );

Similar functionality

If you just need to get the database ID for the image, you may want to use:

$image_id = apply_filters( 'taxonomy-images-queried-term-image-id', 0 );

If you need to get the full object of the image, you may want to use:

$image = apply_filters( 'taxonomy-images-queried-term-image-object', '' );

If you need to get the url to the image, you may want to use the following:

$image_url = apply_filters( 'taxonomy-images-queried-term-image-url', '' );

You can specify the size of the image in an option third parameter:

$image_url = apply_filters( 'taxonomy-images-queried-term-image-url', '', array(
    'image_size' => 'medium'
    ) );

If you need data about the image, you may want to use:

$image_data = apply_filters( 'taxonomy-images-queried-term-image-data', '' );

You can specify the size of the image in an option third parameter:

$image_data = apply_filters( 'taxonomy-images-queried-term-image-data', '', array(
    'image_size' => 'medium'
    ) );

List term images associated with a post object

When a post is being displayed you may want to display all of the images associated with all of the terms that are associated with the post (a mouthful? Yes indeed!). The taxonomy-images-list-the-terms filter does this. Here's what it looks like in its simplest form:

print apply_filters( 'taxonomy-images-list-the-terms', '' );

This filter accepts an optional third parameter that you can use to customize its output. It is an array which recognizes the following keys:

Here's an example of what a fully customized version of this filter might look like:

print apply_filters( 'taxonomy-images-list-the-terms', '', array(
    'after'        => '</div>',
    'after_image'  => '</span>',
    'before'       => '<div class="my-custom-class-name">',
    'before_image' => '<span>',
    'image_size'   => 'detail',
    'post_id'      => 1234,
    'taxonomy'     => 'post_tag',
    ) );

Working with all terms of a given taxonomy

You will want to use the 'taxonomy-images-get-terms' filter. This filter is basically a wrapper for WordPress core function get_terms(). It will return an array of enhanced term objects: each term object will have a custom property named image_id which is an integer representing the database ID of the image associated with the term. This filter can be used to create custom lists of terms. Here's what it's default useage looks like:

$terms = apply_filters( 'taxonomy-images-get-terms', '' );

Here is what php's print_r() function may return:

Array
(
[0] => stdClass Object
    (
        [term_id] => 8
        [name] => Pirate
        [slug] => pirate
        [term_group] => 0
        [term_taxonomy_id] => 8
        [taxonomy] => category
        [description] => Pirates live in the ocean and ride around on boats.
        [parent] => 0
        [count] => 1
        [image_id] => 44
    )

)

As you can see, all of the goodness of get_terms() is there with an added bonus: the image_id parameter!

This filter recognizes an optional third parameter which is an array of arguments that can be used to modify its output:

Here's and example of a simple custom loop that you can make to display all term images:

$terms = apply_filters( 'taxonomy-images-get-terms', '' );
if ( ! empty( $terms ) ) {
    print '<ul>';
    foreach( (array) $terms as $term ) {
        print '<li><a href="https://github.com/mfields/Taxonomy-Images/blob/master/' . esc_url( get_term_link( $term, $term->taxonomy ) ) . '">' . wp_get_attachment_image( $term->image_id, 'detail' ) . '</li>';
    }
    print '</ul>';
}

Support

If you have questions about integrating this plugin into your site, please add a new thread to the WordPress Support Forum. I try to answer these, but I may not always be able to. In the event that I cannot there may be someone else who can help.

Bugs, Suggestions

Development of this plugin is hosted in a public repository on Github. If you find a bug in this plugin or have a suggestion to make it better, please create a new issue

Hook it up yo!

If you have fallen in love with this plugin and would not be able to sleep without helping out in some way, please see the following list of ways that you can hook it up!:

Need More Taxonomy Plugins?

I've released a handfull of plugins dealing with taxonomies. Please see my plugin page for more info.

Installation

  1. Download
  2. Unzip the package and upload to your /wp-content/plugins/ directory.
  3. Log into WordPress and navigate to the "Plugins" panel.
  4. Activate the plugin.
  5. Click the "Taxonomy Images" link under the Settings section in the admin menu. There you can select the taxonomies that you would like to add image support for.

Changelog

0.8.0

0.7.3

0.7.2

0.7.1

0.7

0.6

0.5

0.4.4

0.4.3

0.4.2

0.4.1

0.4

0.3

0.2