自定义WooCommerce迷你cart-ajax.php模板

时间:2016-08-10 11:29:29

标签: php wordpress woocommerce cart product

screenshot

我的PHP代码是:

<ul class="minicart-content">
<?php foreach($woocommerce->cart->cart_contents as $cart_item_key => $cart_item): ?>
    <li>
        <a href="<?php echo get_permalink($cart_item['product_id']); ?>" class="product-image">
            <?php $thumbnail_id = ($cart_item['variation_id']) ? $cart_item['variation_id'] : $cart_item['product_id']; ?>
            <?php echo get_the_post_thumbnail($thumbnail_id, 'shop_thumbnail'); ?>
        </a>

        <div class="detail-item">
            <div class="product-details"> 
            <?php echo apply_filters( 'woocommerce_cart_item_remove_link', sprintf( '<a href="%s" class="btn-remove" title="%s"><span></span></a>', esc_url( $woocommerce->cart->get_remove_url( $cart_item_key ) ), __( 'Remove this item', 'shoppystore' ) ), $cart_item_key ); ?>           
                <a class="btn-edit" href="<?php echo $woocommerce->cart->get_cart_url(); ?>" title="<?php esc_attr_e('View your shopping cart', 'shoppystore'); ?>"><span></span></a>    
                <p class="product-name">
                    <a href="<?php echo get_permalink($cart_item['product_id']); ?>"><?php echo esc_html( $cart_item['data']->post->post_title ); ?></a>
                </p>
                <div class="qty-number"><span><?php esc_html_e('Quantity: ', 'shoppystore'); ?> </span><?php echo esc_html( $cart_item['quantity'] ); ?></div>

            </div>

            <div class="product-details-bottom">
                <span class="price"><?php echo $woocommerce->cart->get_product_subtotal($cart_item['data'], 1); ?></span>
            </div>
        </div>
    </li>

<?php endforeach; ?>

</ul>

我正在使用该代码:

<img height="50px" width="50px" src="<?php  
echo $cart_item['product_id']; $feat_image = wp_get_attachment_url( get_post_thumbnail_id($cart_item['product_id']) );
echo $feat_image;
?>">

我也尝试用硬编码img进行测试

<img height="50px" width="50px" src="http://www.toys4all.pk/wp-content/uploads/2016/07/ttoys498_01_1600x1200QecQ.jpg" alt="message">

但它没有显示img或alt字符串。

1 个答案:

答案 0 :(得分:1)

你可以试试这个。我已经更改了一些代码(详见下文):

<ul class="minicart-content">
<?php 
    foreach( WC()->cart->cart_contents as $cart_item_key => $cart_item ):
        $item = $cart_item['data']; 
        $item_id = $item->id;
        $qty = $cart_item['quantity'];

        /* // Optional (uncomment if needed, see below)
        if(!empty($item)){
            $product = new WC_product($item->id);
        } */
?>
    <li>
        <div class="detail-item">
            <div class="product-details"> 
            <?php echo apply_filters( 'woocommerce_cart_item_remove_link', sprintf( '<a href="%s" class="btn-remove" title="%s"><span></span></a>', esc_url( WC()->cart->get_remove_url( $cart_item_key ) ), __( 'Remove this item', 'shoppystore' ) ), $cart_item_key ); ?>           
                <a class="btn-edit" href="<?php echo WC()->cart->get_cart_url(); ?>" title="<?php esc_attr_e('View your shopping cart', 'shoppystore'); ?>"><span></span></a>    
                <p class="product-name">

                    <a href="<?php echo get_permalink($item_id); ?>">
                        <span class="product-image">
                        <?php 
                        if ( has_post_thumbnail( $item_id ) ) {
                            echo get_the_post_thumbnail($item_id, 'shop_thumbnail');

                            // OR you could try optionally (uncommenting here and above)
                            // echo $product->get_image();
                        } else {

                            // set correct dimensions for placeholder
                            echo '<img src="' . woocommerce_placeholder_img_src() . '" alt="Placeholder" width="25px" height="25px" />';
                        }
                        ?>
                        </span>
                        <span class="product-title"><?php echo esc_html( $item->post->post_title ); ?></span>
                    </a>
                </p>
                <div class="qty-number"><span><?php esc_html_e('Quantity: ', 'shoppystore'); ?> </span><?php echo esc_html( $qty ); ?></div>

            </div>

            <div class="product-details-bottom">
                <span class="price"><?php echo WC()->cart->get_product_subtotal($item, 1); ?></span>
            </div>
        </div>
    </li>

<?php endforeach; ?>

</ul>
  

重要提示:
  移动产品缩略图只是标题
  我更喜欢使用 $item = $cart_item['data']; $item_id = $item->id; 获取产品ID

  嵌入式产品缩略图&amp; <span>标记内的<a>标记中的产品标题:
  我已将产品缩略图和产品标题嵌入 <span> 标记,每个使用不同的类,以用于样式目的。

  标题后的缩略图:
  您还可以在标题后面的 <p class="product-name"><a> 标记内移动缩略图块。

我更喜欢使用 WC()->cart 语法而不是$woocommerce->cart (这是可选的)

我还在开头使用变量缩短了一些重复的参数(这是可选的)

  

备选方案(以防万一)是替代此代码的替代方法:

   if(!empty($item)){
        $product = new WC_product($item->id);
    }

然后使用 $product 代替get_image() function

echo $product->get_image();

参考文献: