Category image display

  • Resolved mrpritchett

    (@mrpritchett)


    11 years, 5 months ago

    I am using a script found at https://wpdevsnippets.com/add-category-tag-taxonomy-picture/. However, I cannot get the writer to answer a usage question, so here it is:

    How do I use this script with a custom taxonomy on a page.php or archive.php template?

    add_action('admin_head', 'wpds_admin_head');
add_action('edit_term', 'wpds_save_tax_pic');
add_action('create_term', 'wpds_save_tax_pic');
function wpds_admin_head() {
$taxonomies = get_taxonomies();
//$taxonomies = array('category'); // uncomment and specify particular taxonomies you want to add image feature.
if (is_array($taxonomies)) {
    foreach ($taxonomies as $z_taxonomy) {
        add_action($z_taxonomy . '_add_form_fields', 'wpds_tax_field');
        add_action($z_taxonomy . '_edit_form_fields', 'wpds_tax_field');
    }
}
}

// add image field in add form
function wpds_tax_field($taxonomy) {
wp_enqueue_style('thickbox');
wp_enqueue_script('thickbox');
if(empty($taxonomy)) {
    echo '<div class="form-field">
            <label for="wpds_tax_pic">Picture</label>
            <input type="text" name="wpds_tax_pic" id="wpds_tax_pic" value="" />
        </div>';
}
else{
    $wpds_tax_pic_url = get_option('wpds_tax_pic' . $taxonomy->term_id);
    echo '<tr class="form-field">
    <th scope="row" valign="top"><label for="wpds_tax_pic">Picture</label></th>
    <td><input type="text" name="wpds_tax_pic" id="wpds_tax_pic" value="' . $wpds_tax_pic_url . '" /><br />';
    if(!empty($wpds_tax_pic_url))
        echo '<img src="'.$wpds_tax_pic_url.'" style="max-width:200px;border: 1px solid #ccc;padding: 5px;box-shadow: 5px 5px 10px #ccc;margin-top: 10px;" >';
    echo '</td></tr>';
}
echo '<script type="text/javascript">
    jQuery(document).ready(function() {
            jQuery("#wpds_tax_pic").click(function() {
                tb_show("", "media-upload.php?type=image&TB_iframe=true");
                return false;
            });
            window.send_to_editor = function(html) {
                jQuery("#wpds_tax_pic").val( jQuery("img",html).attr("src") );
                tb_remove();
            }
    });
</script>';
}

// save our taxonomy image while edit or save term
function wpds_save_tax_pic($term_id) {
if (isset($_POST['wpds_tax_pic']))
    update_option('wpds_tax_pic' . $term_id, $_POST['wpds_tax_pic']);
}

// output taxonomy image url for the given term_id (NULL by default)
function wpds_tax_pic_url($term_id = NULL) {
if ($term_id)
    return get_option('wpds_tax_pic' . $term_id);
elseif (is_category())
    return get_option('wpds_tax_pic' . get_query_var('cat')) ;
elseif (is_tax()) {
    $current_term = get_term_by('slug', get_query_var('term'), get_query_var('taxonomy'));
    return get_option('wpds_tax_pic' . $current_term->term_id);
}
}

    And here is the function that is used to call this:

    wpds_tax_pic_url();
    or

    wpds_tax_pic_url($category->cat_ID);
    How do I use this script with a custom taxonomy on a page.php or archive.php template?

Viewing 6 replies - 1 through 6 (of 6 total)
  • Moderator bcworkz

    (@bcworkz)

    If you haven’t already, create a child theme for your customizations so they are not lost during a theme update.

    The script goes in the functions.php file of the child theme and you use wpds_tax_pic_url() in any template or function to get the image URL, usually to place in the src attribute of an img tag.

    Thread Starter mrpritchett

    (@mrpritchett)

    I’m building a custom theme. I’ve done all this and get the error:

    Notice: Undefined property: stdClass::$term_id in /home/trbc.org/domains/mrp.trbc.org/public_html/wp-content/themes/trbc2013/archive-sermons.php on line 16
    NULL

    Here is my archive-sermons.php (custom post type). I am trying to pull the image from the field based on the custom taxonomy “sermon_series.”

    <?php get_header(); ?>
	<div class="container">
		<div class="row">
			<div class="span12">
				<div class="page-content">
					<h1>Sermon Archive</h1>
					<div class="row">
					<?php if(have_posts()): while(have_posts()): the_post(); ?>

						<div class="span2">
							<div class="sermon-archive-single">
								<div class="thumbnail">
									<img src="<?php wpds_tax_pic_url(); ?>" />
								</div>
								<span class="sermon-archive-series"><b><?php echo do_shortcode('[tax id="sermon_series" before="" separator=", " after=""]'); ?></b> - </span><span class="sermon-archive-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></span>
							</div>
						</div>

					<?php endwhile; endif; ?>
					<?php kriesi_pagination(); ?>
					</div>
				</div>
			</div>
		</div>
	</div>
<?php get_footer(); ?>
    Moderator bcworkz

    (@bcworkz)

    If the template is not for a taxonomy or category query, you must pass the taxonomy term ID as a parameter in order to get the associated image URL: wpds_tax_pic_url($terms[0]->term_id)

    You can get the term IDs of the current post from the array of term objects returned by $terms = wp_get_post_terms( $post->ID, 'sermon_series');. Thus, the first term in the array is $terms[0] even if it is the only term. If there are multiple terms, you can’t know which is the first term, though it is likely the one with the lowest ID.

    Thread Starter mrpritchett

    (@mrpritchett)

    Now I’m getting “Notice: Trying to get property of non-object in wp-content/themes/trbc2013/archive-sermons.php on line 14”

    <?php if(have_posts()): while(have_posts()): the_post(); ?>

						<div class="span2">
							<div class="sermon-archive-single">
								<div class="thumbnail">
									<?php $terms = wp_get_post_terms( $post->ID, 'sermon_series'); ?>
									<?php wpds_tax_pic_url($terms->term_id); ?>
									<p><?php echo $terms[0]->term_id ?></p>
								</div>
								<span class="sermon-archive-series"><b><?php echo do_shortcode('[tax id="sermon_series" before="" separator=", " after=""]'); ?></b> - </span><span class="sermon-archive-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></span>
							</div>
						</div>

					<?php endwhile; endif; ?>
    Moderator bcworkz

    (@bcworkz)

    Right, use this:
    <?php wpds_tax_pic_url($terms[0]->term_id); ?>

    $terms is an array of term objects, even if there is only one term. You have to specify which term object you want to use by array index number. The [0] bit says to use the first term object in the array.

    The other thing that will happen is the function will now return an URL, but nothing is done with it. You need to assign it to something and then output it inside a img tag:

    <?php $pic_url = wpds_tax_pic_url($terms[0]->term_id);
echo "<img src='$pic_url'>"; ?>

    Thread Starter mrpritchett

    (@mrpritchett)

    Duh. Needed to echo it out. Thanks. Confirmed working. Thanks so much!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Category image display’ is closed to new replies.