# Category Image Banner Above Products

> Displays the image you set on a product category as a wide banner at the top of that category's page, which many themes do not show.

- Type: PHP
- Runs: Wc before products list
- Category: [WooCommerce](https://wpide.com/library/category/woocommerce/)
- Requires: WooCommerce
- Tags: woocommerce, categories, images, shop
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/woo-category-banner-image/

## Code

```php
if ( is_product_category() ) {
    $term     = get_queried_object();
    $image_id = (int) get_term_meta( $term->term_id, 'thumbnail_id', true );

    if ( $image_id ) {
        echo '<div class="wpide-category-banner" style="margin:0 0 24px;border-radius:8px;overflow:hidden;">';
        echo wp_get_attachment_image( $image_id, 'full', false, array(
            'style'   => 'display:block;width:100%;height:auto;max-height:320px;object-fit:cover;',
            'alt'     => $term->name,
            'loading' => 'eager',
        ) );
        echo '</div>';
    }
}
```

## Notes

Set the image in Products > Categories > Edit category > Thumbnail. Categories without an image show nothing.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Category Image Banner Above Products" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/
