Question

我从这个帖子Woocommerce: Featured image different than product image中获取灵感，并在Woocommerce主题网站的产品页面上将其中一个图库页面作为特色图片/大图片。

然而，由于它正在从缩略图库中拾取小图像，因此尺寸不会改变，因此图像变得模糊。其中的HTML限制了它。如何在产品单页面上增加主图像/大图像的宽度和高度。

供参考，您可以访问此链接http://fliptales2.davcommdev.com/product/aaron-camel/。您可以发现图像模糊，此大图像的HTML为200x159。

Answer 1

无论如何我完成了它。以下是代码..（使用ref：to Woocommerce: Featured image different than product image）

<div class="images">

<?php

    $attachment_ids = $product->get_gallery_attachment_ids();
    isset ($placeholder_width)? : $placeholder_width=0;
    isset ($placeholder_height)? : $placeholder_height=0;

    if ( $attachment_ids ) {
        $attachment_id = $attachment_ids[0];

    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' );

        $output = '<div class="imagewrapper">';

        //$classes = array( 'imagewrapper' );
        $classes = array();
        $image_link = wp_get_attachment_url( $attachment_id );

        if ( $image_link ) {

        $image       = wp_get_attachment_image( $attachment_id, apply_filters( 'single_product_large_thumbnail_size', 'shop_single' ) );
        $image_class = esc_attr( implode( ' ', $classes ) );
        $image_title = esc_attr( get_the_title( $attachment_id ) );

        echo apply_filters( 'woocommerce_single_product_image_html', sprintf( '<a href="%s" itemprop="image" class="woocommerce-main-image zoom" title="%s"  rel="prettyPhoto[product-gallery]">%s</a>', $image_link, $image_title, $image ), $post->ID );

        } else {

            echo apply_filters( 'woocommerce_single_product_image_html', sprintf( '<img src="%s" alt="Placeholder" />', woocommerce_placeholder_img_src() ), $post->ID );

        }

    }
?>

<?php do_action( 'woocommerce_product_thumbnails' ); ?>

更改woocommerce产品页面上的图像尺寸

1 个答案: