woocommerce display categories with thumbnails

3 Views

my task

What exactly i want to know is how do i get my categories like in the picture. (The food types thumbnails.) I have a WordPress site with the Maya Shop theme which is based on Woo Commerce. I tried every which way i could from the menu and i hadn’t managed to do it.
Also tried to fiddle a little bit with the Short code to no avail. I am new to this an i want to keep it as simple as possible. Do i have to write php code for some files or can i do it simpler than that?

Post Views: 3

Related posts

Leave a Reply

2 comments

  1. That’s not good answer. get_category_link() is not appropriate function to use for custom taxonomy. Function get_term_link() is what we need here.

    <?php
    $prod_categories = get_terms( 'product_cat', array(
        'orderby'    => 'name',
        'order'      => 'ASC',
        'hide_empty' => 1
    ));
    foreach( $prod_categories as $prod_cat ) :
        $cat_thumb_id = get_woocommerce_term_meta( $prod_cat->term_id, 'thumbnail_id', true );
        $cat_thumb_url = wp_get_attachment_thumb_url( $cat_thumb_id );
        $term_link = get_term_link( $prod_cat, 'product_cat' );
?>
<a href="<?php echo $term_link; ?>"><img src="<?php echo $cat_thumb_url; ?>" alt="<?php echo $prod_cat->name; ?>" /></a>
<?php endforeach; wp_reset_query(); ?>

  2. I assuming that your theme doesn’t have the code in place already to show the categories and their thumbnails on the homepage? If that is the case you will need to determine what template is being used and then most likely use some variation of the following code to build the display. Note: you will need to style and build any additional components to match your display exactly.

    <ul>
<?php
    $prod_categories = get_terms( 'product_cat', array(
        'orderby'    => 'name',
        'order'      => 'ASC',
        'hide_empty' => 1
    ));
    foreach( $prod_categories as $prod_cat ) :
        $cat_thumb_id = get_woocommerce_term_meta( $prod_cat->term_id, 'thumbnail_id', true );
        $cat_thumb_url = wp_get_attachment_thumb_url( $cat_thumb_id );
?>
    <li><a href="<?php echo get_category_link( $prod_cat->term_id ); ?>"><img src="<?php echo $cat_thumb_url; ?>" alt="<?php echo $prod_cat->name; ?>" /></a></li>
<?php endforeach; wp_reset_query(); ?></ul>