11 Responses

  1. keith

    Excellent…keep this WooCommerce info coming!

  2. James Koster

    You could also just hook into which may be less disruptive?


    // Add the img wrap
    add_action( 'woocommerce_before_shop_loop_item_title', create_function('', 'echo "";'), 5, 2);
    add_action( 'woocommerce_before_shop_loop_item_title',create_function('', 'echo "";'), 12, 2);

    1. James Koster

      D’oh that should have been;


      // Add the img wrap
      add_action( 'woocommerce_before_shop_loop_item_title', create_function('', 'echo "<div class=\"img-wrap\">";'), 5, 2);
      add_action( 'woocommerce_before_shop_loop_item_title',create_function('', 'echo "</div>";'), 12, 2);

  3. Marek

    How to wrap product categories images?

  4. Sunil

    I’m really dissapointed that woocommerce makes developers do things like this.

    I’ve long grown used to mixed html and php. But having to make simple changes in html by over-riding functions just makes no sense. Especially given the already existing absence of seperation of concern in the design of wordpress.

    It’d be so much simpler and make so much more sense if wordpress plugin developers stuck to simple editable php templates.

  5. Juliane

    hello, this is a good snippet. i was looking something like this but what i want to do is to change the product image onmouseover.

    i’m created a custom field for the hover image and i’m trying to insert this code but is not working. on line 46:


    $output .= '<img src="'. woocommerce_placeholder_img_src() .'" alt="Placeholder" width="' . $placeholder_width . '" height="' . $placeholder_height . '" onmouseover="" />';

    can you help please?

  6. John Kim

    Yes, It works great. I’m also looking to do this for product categories catalog. How can I accomplish this? Thanks.

  7. Salman Ahmed

    Thanks for the snippet…it works great!

Leave a Reply