WooCommerce - 如何阻止小产品图像在产品循环中使较大的产品图像相形见绌?

时间:2013-03-18 16:35:07

标签: image loops override product woocommerce

目前,我的精选图片正在产品循环中使用(默认情况下)。

问题在于,因为所有产品图像都被调整为固定尺寸(为了更好的布局),较小产品的图像实际上使较大产品的图像相形见绌。

除非有人有更好的建议,否则我决定解决这个问题的一种方法是让我在产品循环中使用不同的产品图片。这样,我可以在较小的产品图像上方添加一个空白区域,以便在调整大小时不会使其他产品相形见绌。 (注意 - 我不能将此编辑的图像设置为特色图像,因为我不希望在灯箱中显示此空白区域。)

那么,首先,这是解决我问题的最佳方法吗?如果是这样,那么指定在产品循环中使用的自定义图像的最佳方法是什么?

提前致谢。

1 个答案:

答案 0 :(得分:2)

这是我想出来解决这个问题的功能。它需要放在functions.php文件中。有关用法,请参阅功能注释...

/**
 * This function is used to display a custom image in the shop page if a custom
 * image exists for the product. This may be required, for example, to prevent
 * images of small products dwarfing images of larger products on the shop page.
 * 
 * To set a custom image for a product, create a custom field for it (in the
 * Edit Product page) called custom_product_thumbnail_url . (The image that you
 * specify can contain additional white space to prevent it being enlarged.)
 * 
 * This function overrides the function of the same name in WooCommerce's
 * woocommerce-template.php file.
 *
 * @access public
 * @subpackage  Loop
 * @param string $size (default: 'shop_catalog')
 * @param int $placeholder_width (default: 0)
 * @param int $placeholder_height (default: 0)
 * @return string
 */
function woocommerce_get_product_thumbnail( $size = 'shop_catalog', $placeholder_width = 0, $placeholder_height = 0  ) {

    global $post, $woocommerce;

    if ( ! $placeholder_width )
            $placeholder_width = $woocommerce->get_image_size( 'shop_catalog_image_width' );
    if ( ! $placeholder_height )
            $placeholder_height = $woocommerce->get_image_size( 'shop_catalog_image_height' );

    $imgSrc = get_post_meta($post->ID, 'custom_product_thumbnail_url', true);
    if ($imgSrc)
            return '<img src="'. $imgSrc .'" alt="' . get_the_title($post->ID) . '" width="' . $placeholder_width . '" height="' . $placeholder_height . '" />';
    if ( has_post_thumbnail() )
            return get_the_post_thumbnail( $post->ID, $size );
    elseif ( woocommerce_placeholder_img_src() )
            return '<img src="'. woocommerce_placeholder_img_src() .'" alt="Placeholder" width="' . $placeholder_width . '" height="' . $placeholder_height . '" />';

}