Woocommerce 显示产品的类别标题和图像

Question

在 Wordpress Woocommerce 中，如何在 Storefront 主题中正确显示产品的类别标题和图像？

Answer 1

您首先需要获取类别 ID：

global $post;    
$terms = get_the_terms( $post->ID, 'product_cat' );
    foreach ($terms as $term) {
        $product_cat_id = $term->term_id;
        break;
    }

接下来，当您拥有它时 - 尝试获取当前类别的缩略图 ID：

// get the thumbnail id user the term_id
        $thumbnail_id = get_woocommerce_term_meta( $product_cat_id, 'thumbnail_id', true ); 

最后 - 获取图像：

// get the image URL
        $image = wp_get_attachment_url( $thumbnail_id ); 
echo '<img src="'.$image.'" alt="" />';

我希望它能帮助你。

Answer 2

这是模板代码：

<div id="primary" class="content-area">
    <main id="main" class="site-main" role="main">

        <?php while ( have_posts() ) : the_post(); ?>

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

            <?php get_template_part( 'content', 'page' ); ?>

            <?php
            /**
             * @hooked storefront_display_comments - 10
             */
            do_action( 'storefront_page_after' );
            ?>

        <?php endwhile; // end of the loop. ?>

    </main><!-- #main -->
</div><!-- #primary -->

Answer 3

感谢您的回复，这里是主题的content-page.php：

<?php
    /**
     * The template used for displaying page content in page.php
     *
     * @package storefront
     */
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    <?php
        /**
         * @hooked storefront_page_header - 10
         * @hooked storefront_page_content - 20
         */
        do_action( 'storefront_page' );
    ?>
</article><!-- #post-## -->

这是 woocommerece 插件的 content-product.php

<?php
if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly
}

global $product, $woocommerce_loop;

// Store loop count we're currently on
if ( empty( $woocommerce_loop['loop'] ) ) {
    $woocommerce_loop['loop'] = 0;
}

// Store column count for displaying the grid
if ( empty( $woocommerce_loop['columns'] ) ) {
    $woocommerce_loop['columns'] = apply_filters( 'loop_shop_columns', 4 );
}

// Ensure visibility
if ( ! $product || ! $product->is_visible() ) {
    return;
}

// Increase loop count
$woocommerce_loop['loop']++;

// Extra post classes
$classes = array();
if ( 0 == ( $woocommerce_loop['loop'] - 1 ) % $woocommerce_loop['columns'] || 1 == $woocommerce_loop['columns'] ) {
    $classes[] = 'first';
}

if ( 0 == $woocommerce_loop['loop'] % $woocommerce_loop['columns'] ) {
    $classes[] = 'last';
}
?>
<li <?php post_class( $classes ); ?>>
    <?php do_action( 'woocommerce_before_shop_loop_item' ); ?>
    <a href="<?php the_permalink(); ?>">
    <?php
        /**
         * woocommerce_before_shop_loop_item_title hook
         *
         * @hooked woocommerce_show_product_loop_sale_flash - 10
         * @hooked woocommerce_template_loop_product_thumbnail - 10
         */
        do_action( 'woocommerce_before_shop_loop_item_title' );

        /**
         * woocommerce_shop_loop_item_title hook
         *
         * @hooked woocommerce_template_loop_product_title - 10
         */
        do_action( 'woocommerce_shop_loop_item_title' );

        /**
         * woocommerce_after_shop_loop_item_title hook
         *
         * @hooked woocommerce_template_loop_rating - 5
         * @hooked woocommerce_template_loop_price - 10
         */
        do_action( 'woocommerce_after_shop_loop_item_title' );
    ?>
   </a>
   <?php
       /**
        * woocommerce_after_shop_loop_item hook
        *
        * @hooked woocommerce_template_loop_add_to_cart - 10
        */
       do_action( 'woocommerce_after_shop_loop_item' );
   ?>
</li>