WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] thumbnails with wp_list_categories?

[Resolved] thumbnails with wp_list_categories?

  • Hi, I’ve been working on this all day and can’t find it or figure it out.

    I have thumbnails associated with categories and I’d like to show all categories. Seems like wp_list_categories would be the way to go. (2.3)

    I’ve named the category thumbnails by cat_ID. Here’s what I have, and it doesn’t work:

    $cats = wp_list_categories('title_li=&echo=0');
    foreach ((array)$cats as $cat) {
    $catdesc = $cat->category_description;
    echo '<li><a href="'. get_category_link($cat).'" title="'. strip_tags($catdesc) .'">'. $cat->cat_name . '</a><a href="' . get_category_link($cat) . '" title="'. strip_tags($catdesc) .'"><img src="/images/' . $cat->cat_ID . '.jpg"
    alt="' . $cat->cat_name . '" /></a></li>'; }

    Any suggestions?

Viewing 15 replies - 1 through 15 (of 24 total)
  • Why WP Support really slow to cover some problem from members?

    I’m still having no luck despite trying different things to get this array to work. Does anyone see what the problem is?

    Thanks in advance.

    I am not a coder, so I can’t tell what’s wrong (if anything).
    Did you see this?
    Template_Tags/get_the_category#Show_Category_Images

    Yes, the problem is that get_the_category works within the loop, so it will only show the cats of the current posts, not all cats.

    Unless there’s a way around it, and there might be if I use a multiple loop. I’d rather not use a multiple loop as it messes with one of my plugins. I’m not a coder either.

    Seems like, if there’s been an echo parameter added to wp_list_categories, should be possible to do something with it in an array. I’m bummed I can’t figure it out. Probably it’s something simple.

    Thank you for the suggestion, though.

    Any more ideas? Keep ’em coming.

    $cats will be returned as a string, not an array, so:

    foreach ((array)$cats as $cat) {

    will not work. Instead you should use the ‘internal’ WordPress function get_categories():

    $cats = get_categories();

    Wonderful. Thank you. I didn’t know about this one — not on the category template tags list.

    Here’s the documentation if anyone else has been looking for this sort of thing:

    http://codex.wordpress.org/Function_Reference/get_categories

    Thank you, Kafkaesqui!

    Here’s the code in case anyone else wants to do this:

    <?php
    $cats = get_categories();
    foreach ((array)$cats as $cat) {
    $catdesc = $cat->category_description;
    echo '<li><div style="float:right;"><a href="'. get_category_link($cat).'" title="'. strip_tags($catdesc) .'">'. $cat->cat_name . '</a></div><a href="' . get_category_link($cat) . '" title="'. strip_tags($catdesc) .'"><img src="/images/' . $cat->cat_ID . '.jpg" alt="' . $cat->cat_name . '" /></a></li>';
    } ?>

    This works well if you have an image for every category.

    The only problem now is making it check to see if the image exists first before trying to echo an image that might not be found. I tried the if (file_exists()) but it couldn’t find the images that in fact exist, so nothing displayed.

    An easier way to do it would be to use the include or exclude parameters of get_categories, but I’d like to add this to the functions file of my theme to ‘set and forget.’

    Any ideas?

    Here’s the final product. Put the category image files in your theme’s image folder:

    <?php
    $cats = get_categories();
    foreach ((array)$cats as $cat) {
    $catdesc = $cat->category_description;
    $catnumber = $cat->cat_ID;
    $photofile = (TEMPLATEPATH . '/images/' . $cat->cat_ID. '.jpg');
    if (file_exists($photofile)){
    echo '<li><div style="float:right;"><a href="'. get_category_link($cat).'" title="'. strip_tags($catdesc) .'">'. $cat->cat_name . '</a></div><a href="' . get_category_link($cat) . '" title="'. strip_tags($catdesc) .'"><img src="' . get_bloginfo ('template_url') . '/images/' . $cat->cat_ID. '.jpg" alt="' . $cat->cat_name . '" /></a></li>';
    } else echo '<li><div style="float:right;"><a href="'. get_category_link($cat).'" title="'. strip_tags($catdesc) .'">'. $cat->cat_name . '</a></div>';
    } ?>

    Provide an absolute (or full) directory path to the image on the server — not its url — with file_exists():

    <?php
    $image_path = '/users/username/www-root/images/';
    $cats = get_categories();
    foreach ((array)$cats as $cat) {
    	$catdesc = attribute_escape(strip_tags($cat->category_description));
    	$image = $cat->cat_ID . '.jpg';
    	if( file_exists($image_path . $image) )  {
    		$cat_img = '<a href="' . get_category_link($cat) . '" title="'. $catdesc .'"><img src="/images/' . $image . '" alt="' . $cat->cat_name . '" /></a>';
    	} else {
    		$cat_img = '';
    	}
    	echo '<li><div style="float:right;><a href="'. get_category_link($cat).'" title="'. $catdesc .'">'. $cat->cat_name . '</a></div>' . $cat_img . '</li>';
    }
    ?>

    If you’re unsure what that path is, a quick way to find out is to create a PHP document with the following three lines (and nothing more):

    <?php
    echo dirname(__FILE__);
    ?>

    Name it something like path.php, upload it to your site’s root directory, and access it through your browser.

    That works. Thank you so much for your time.

    Kafkaesqui: No, he was right the first time. TEMPLATEPATH is the server path to the current template directory, not the URI to that directory.

    So file_exists(TEMPLATEPATH.'/images/whatever.png'); is perfectly valid and correct.

    Otto, I was basing my stuff on the original code, which has:

    <img src="/images/' . $cat->cat_ID . '.jpg"

    My last reply was written/sent before ever seeing the “final product.” But you’re correct that if one has the images directory within their active theme’s directory, using the WordPress constant TEMPLATEPATH is an easy way to point to it.

    OK, I need some help on this.

    I’ve adapted it, because it wasn’t doing what I wanted, plus the HTML wasn’t validating.

    What I want is for an image to show on the home page for each category.

    What I’ve got is a bunch of code that can be placed anywhere outside the Loop. It does what I want – mostly.

    If there’s no image for a category, it echoes a default image.

    If there IS an image for a category, it STILL echoes that default image. It’s not meant to. That’s where I’ve got stuck.

    I THINK the line causing the problems is if( file_exists($image_path ."/images/". $image) )

    I’ve checked by using echo $image_path."/images/".$image; and that comes out fine with the url to the image.

    Here’s the code, and below it is the output.

    <?php
    $image_path = get_bloginfo('stylesheet_directory');
    $cats = get_categories();
    $count=1;
    foreach ((array)$cats as $cat) {
    	$catdesc = attribute_escape(strip_tags($cat->category_description));
    	$image = $cat->category_nicename .'.jpg';
    	if( file_exists($image_path ."/images/". $image) )  {
    		$cat_img = '<div class="category-image" id="cat-image-'.$count.'"'.'><a href="' . get_category_link($cat) . '" title="'. $catdesc .'"><img class="image-for-category" src="' . $image_path . '/images/' . $image . '" alt="' . $cat->cat_name . '" /></a></div>'."\n\n";
    	} else {
    		$cat_img = '<div class="category-image" id="cat-image-'.$count.'"'.'><a href="' . get_category_link($cat) . '" title="'. $catdesc .'"><img class="image-for-category" src="' . $image_path . '/images/default-category-image.jpg' .  '" alt="' . $cat->cat_name . '" /></a></div>'."\n\n";		   		/*If no category image, display a default image called  default-category-image.jpg*/
    	}
    	echo  $cat_img ;
    	$count++;
    }
    ?>

    And here’s the output:

    <div class="category-image" id="cat-image-1"><a href="http://www.mysite.com/index.php/category/fish/" title=""><img class="image-for-category" src="http://www.mysite.com/wp-content/themes/whatever/images/default-category-image.jpg" alt="fish" /></a></div>
    
    <div class="category-image" id="cat-image-2"><a href="http://www.incenseheaven.com/there/index.php/category/elephants/" title=""><img class="image-for-category" src="http://www.incenseheaven.com/there/wp-content/themes/whatever/images/default-category-image.jpg" alt="elephant" /></a></div>
    
    etc.

    richarduk, if you scroll up to Otto’s last reply, you’ll see a solution there:

    $image_path = TEMPLATEPATH;

    Most likely file_exists() does not support urls on your server. In that case, you always want to provide the absolute directory path on the server to your theme directory (which the constant TEMPLATEPATH provides), and not the url.

    No, that won’t fix his problem either, because he’s using the $imagepath in the IMG SRC as well.

    What he doesn’t seem to understand is that there’s two paths to the file to be concerned about.

    There’s the actual filepath, which will be TEMPLATEPATH.'/images/whatever.jpg' . This is what will be used with file_exists.

    Then there’s the URL to that image. This will be output by something like this:
    <img src="<?php bloginfo('stylesheet_directory'); ?>/images/whatever.jpg" />

    The two things are different and must be treated as such.

Viewing 15 replies - 1 through 15 (of 24 total)
  • The topic ‘[Resolved] thumbnails with wp_list_categories?’ is closed to new replies.