This code display all your brand thumbnails on the product page. The thumbnails are added on the Products > Brands edit screen and selected on the single product edit page in WooCommerce.
add_action( 'woocommerce_single_product_summary', 'display_all_brand_thumbnails_on_product_page', 25 );
function display_all_brand_thumbnails_on_product_page() {
global $post;
$brands = wp_get_post_terms( $post->ID, 'product_brand' );
if ( ! empty( $brands ) && ! is_wp_error( $brands ) ) {
// Output container for brand logos
echo '<div class="product-brand-thumbnails">';
foreach ( $brands as $brand ) {
$thumbnail_id = get_term_meta( $brand->term_id, 'thumbnail_id', true );
if ( $thumbnail_id ) {
$image_url = wp_get_attachment_image_url( $thumbnail_id, 'full' );
if ( $image_url ) {
echo '<img class="brand-logo" src="' . esc_url( $image_url ) . '" alt="' . esc_attr( $brand->name ) . '" />';
}
}
}
echo '</div>';
}
}
You can also added some inline styling like this :
add_action( 'wp_enqueue_scripts', 'add_brand_logo_inline_styles' );
function add_brand_logo_inline_styles() {
$custom_css = "
.woocommerce .product-brand-thumbnails {
display: flex;
gap: 10px;
align-items: center;
margin-top: 15px;
}
.woocommerce .product-brand-thumbnails img.brand-logo {
height: 30px !important;
width: auto !important;
max-width: none !important;
}
";
wp_add_inline_style( 'woocommerce-inline', $custom_css );
}
If you prefer a more flexible solution using a plugin, check this plugin out.






Leave a Reply