How to Display Product Dimensions on the WooCommerce Shop Page

You can display product dimensions on the WooCommerce shop page by printing each product’s height, width, and length directly in the shop loop, pulled straight from the product’s Shipping tab data. This is especially useful for freight-calculated stores where volume affects shipping cost.

Why Show Dimensions in the Catalog View

• Helps shoppers judge size before clicking into the product
• Useful when shipping cost depends on volume, not just weight
• Reduces returns caused by misjudged product size

Step 1: Add the Dimensions Snippet

/** Print product height, width, and length in the shop loop */
add_action( 'woocommerce_after_shop_loop_item', 'display_dimensions_in_shop_loop', 20 );

function display_dimensions_in_shop_loop() {
    global $product;

    $dimensions = $product->get_dimensions( false );

    if ( empty( $dimensions ) || ( ! $product->get_height() && ! $product->get_width() && ! $product->get_length() ) ) {
        return;
    }

    $unit = get_option( 'woocommerce_dimension_unit' );

    echo '<div class="product-dimensions">';
    echo '<span>H: ' . esc_html( $product->get_height() ) . esc_html( $unit ) . '</span> ';
    echo '<span>W: ' . esc_html( $product->get_width() ) . esc_html( $unit ) . '</span> ';
    echo '<span>L: ' . esc_html( $product->get_length() ) . esc_html( $unit ) . '</span>';
    echo '</div>';
}

Troubleshooting

Dimensions Show as Blank

Check the Shipping tab on the product edit screen — height, width, and length must all be filled in for that specific product; missing values print as empty.

Wrong Unit Displayed

The unit is pulled from WooCommerce → Settings → Products → Measurements, so confirm that setting matches your store’s intended measurement system (cm, in, etc.).

Only Some Products Show Dimensions

Variable products may have per-variation dimensions instead of a single parent value — if you need variation-level dimensions on the loop, adapt the snippet to check a representative variation instead of the parent product.

Frequently Asked Questions

Conclusion

Displaying product dimensions on the WooCommerce shop page is a simple loop snippet that pulls directly from the Shipping tab. It’s particularly useful for stores where shipping costs or product size genuinely influence a shopper’s decision.

See also How to Display Product Categories on the WooCommerce Shop Page. Then read How to Display One Product Per Row on the Shop Page.

Prefer no code? All-in-One Utilities Woo Add-on adds over 50 WooCommerce features, so you can switch them on without code.