Giter Club home page Giter Club logo

taxonomy-term-image's Introduction

Taxonomy Term Image

An example plugin for adding an image upload field to taxonomy term edit pages, and an example of the new taxonomy term meta data added in WordPress 4.4. This example IS NOT compatible with any version of WordPress lower than 4.4, it is meant to be used as an example only.

How to use within a theme or plugin:

Setup file:

  1. Delete plugin meta data at the top of taxonomy-term-image.php
  2. include_once taxonomy-term-image.php

Hooks

filter taxonomy-term-image-taxonomy:

Change the taxonomy targeted by the plugin. By default, the category taxonomy is the only taxonomy targeted. You can change this to tags if you'd like following the example below:

	function the_term_image_taxonomy( $taxonomy ) {
		// use for tags instead of categories
		return 'post_tag';
	}
	add_filter( 'taxonomy-term-image-taxonomy', 'the_term_image_taxonomy' );

Alternatively, the plugin can target more than one taxonomy by providing it an array of taxonomy slugs:

	function the_term_image_taxonomy( $taxonomy ) {
		// use for tags and categories
		return array( 'post_tag', 'category' );
	}
	add_filter( 'taxonomy-term-image-taxonomy', 'the_term_image_taxonomy' );

filter taxonomy-term-image-labels:

Change the field and button text.

	function the_taxonomy_term_image_labels( $labels ) {
		$labels['fieldTitle'] = __( 'My Super Rad Plugin', 'yourdomain' );
		$labels['fieldDescription'] = __( 'This plugin is cool, and does neat stuff.', 'yourdomain' );

		return $labels;
	}
	add_filter( 'taxonomy-term-image-labels', 'the_taxonomy_term_image_labels' );

filter taxonomy-term-image-meta-key:

Change the meta key used to save the image ID in the term meta data

	function the_taxonomy_term_image_meta_key( $option_name ) {
		// store in term meta where term meta key is = 'my_term_meta_key'
		return 'my_term_meta_key';
	}
	add_filter( 'taxonomy-term-image-meta-key', 'the_taxonomy_term_image_meta_key' );

filter taxonomy-term-image-js-dir-url:

Change where the js file is located. (no trailing slash)

	function my_taxonomy_term_image_js_dir_url( $option_name ) {
		// change the js directory to a subdirectory of this hook
		return plugin_dir_url( __FILE__ ) . '/js';
	}
	add_filter( 'taxonomy-term-image-js-dir-url', 'my_taxonomy_term_image_js_dir_url' );

show image on archive template

Term Image IDs are automatically attached to terms that are passed through the get_term and get_terms filters as the ->term_image property.

	$term = get_term( 123, 'category' );

	if ( $term->term_image ) {
		echo wp_get_attachment_image( $term->term_image, 'full' );
	}

In order to retrieve the term image on an archive page:

	$term = get_queried_object();

	if ( $term->term_image ) {
	    echo wp_get_attachment_image( $term->term_image, 'full' );
    }

References:

Articles:

Code References:

taxonomy-term-image's People

Contributors

cyrille37 avatar daggerhart avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

taxonomy-term-image's Issues

sizes.thumbnail

If the image uploaded doesn't have a thumbnail (the size of the image is smaller than thumbnail size) the script fails.

Something in the lines of if( 'undefined' == typeof sizes.thumbnail ) sizes.thumbnail = sizes.full; is needed in the updateImage function.

Use term meta instead of options table

I adapted your code to use core's recently introduced term meta functionality instead of the options table.

Would you consider accepting a pull request or should I just publish a new repo?

Please note that, because I wasn't using the code before term meta was introduced, I haven't written any code to migrate the existing options to term meta.

How to Show Thumbnail on Custom Post Type Archive?

@daggerhart what if the template where I'm trying to show the taxonomy term image is the archive of a Custom Post Type? I'm having issues with this. Here's my code:

<?php

    $args = array(
    'type' => 'lyric',
    'child_of' => 0,
    'parent' => 0,
    'orderby' => 'name',
    'order' => 'ASC',
    'hide_empty' => 0,
    'hierarchical' => 1,
    'taxonomy' => 'project'
);

foreach ( get_categories( $args ) as $taxonomy_cat ) {
  echo '<li>' . 
    wp_get_attachment_image( $taxonomy_cat->term_image, 'thumbnail' ) . 
    $taxonomy_cat->name . 
    '</li>';
}

?>

Seems as though everything works fine except for:

wp_get_attachment_image( $taxonomy_cat->term_image, 'thumbnail' )

If you could help me out with this as soon as possible, that would be great. Thanks!

Showing thumbnail

I cant show the thumbnail image. Please help me.

can you guide me? Thanks!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.