如何在woocommerce产品详情页的描述里自动调用产品图,包括主图和缩略图

可以在functions里添加如下代码:

// Display description tab when empty
add_filter( 'woocommerce_product_tabs', 'display_description_product_tabs' );
    function display_description_product_tabs( $tabs ) {

    $tabs['description'] = array(
        'title'    => __( 'Description', 'woocommerce' ),
        'priority' => 10,
        'callback' => 'woocommerce_product_description_tab',
    );

    return $tabs;
}

// Add image to description
add_filter( 'the_content', 'add_product_image_woocommerce_description' );
function add_product_image_woocommerce_description( $content ) {
    global $product;

    // Single product pages (woocommerce)
    if ( is_product() ) {

        ob_start(); // Start buffering

        // HERE your main image
        echo $product->get_image( array('700', '600'), array( "class" => "img-responsive" ), '' );

        $image_content = "";

        // Loop through gallery Image Ids
        foreach( $product->get_gallery_image_ids() as $image_id ) {

            echo '<img src="'. wp_get_attachment_image_url($image_id, 'full') . '" alt="image_content" width="500" height="600">';
        }

        echo '<p> TEST Image content </p>'; // Testing text

        // Inserting the buffered content after
        $content .= ob_get_clean();
    }

    return $content;
}

如果每张产品图要换行显示,则修改下面这行代码:

 echo '<img src="'. wp_get_attachment_image_url($image_id, 'full') . '" alt="image_content" width="500" height="600">';

在<img> 前后加上<br>:

 echo '<br><img src="'. wp_get_attachment_image_url($image_id, 'full') . '" alt="image_content" width="500" height="600"><br>';

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值