Question

我正在为WooCommerce使用自定义模板，以便我们可以更改页面的布局。效果很好，但是产品形象不会随产品的变化而改变。即如果他们选择“红色”，则主图像不会改变。取而代之的是，只有位置＃1中的缩略图起作用。我知道它与布局有关，因为如果我恢复到旧的布局，它将可以正常工作。有谁知道为什么会这样吗？我搜索了整个内容，但无法解决。这是我的新布局中的编码，尽管我不认为这是罪魁祸首（尽管也许有些缺失）。我在控制台中也没有收到任何错误：

<div class="product-container">
<div class="product-main">
<div class="row content-row mb-0">

    <div class="product-gallery large-<?php echo flatsome_option('product_image_width'); ?> col">
    <?php
        /**
         * woocommerce_before_single_product_summary hook
         *
         * @hooked woocommerce_show_product_sale_flash - 10
         * @hooked woocommerce_show_product_images - 20
         */
        do_action( 'woocommerce_before_single_product_summary' );
    ?>
    </div>

    <div class="producttext">
        <?php
$content = get_the_content('Read more');
print $content;
        ?>
    </div>


    <div class="product-info summary col-fit col entry-summary <?php flatsome_product_summary_classes();?>">

        <?php
            /**
             * woocommerce_single_product_summary hook
             *
             * @hooked woocommerce_template_single_title - 5
             * @hooked woocommerce_template_single_rating - 10
             * @hooked woocommerce_template_single_price - 10
             * @hooked woocommerce_template_single_excerpt - 20
             * @hooked woocommerce_template_single_add_to_cart - 30
             * @hooked woocommerce_template_single_meta - 40
             * @hooked woocommerce_template_single_sharing - 50
             */
            do_action( 'woocommerce_single_product_summary' );
        ?>

    </div><!-- .summary -->

    <div id="product-sidebar" class="mfp-hide">
        <div class="sidebar-inner">
            <?php
                do_action('flatsome_before_product_sidebar');
                /**
                 * woocommerce_sidebar hook
                 *
                 * @hooked woocommerce_get_sidebar - 10
                 */
                if (is_active_sidebar( 'product-sidebar' ) ) {
                    dynamic_sidebar('product-sidebar');
                } else if(is_active_sidebar( 'shop-sidebar' )) {
                    dynamic_sidebar('shop-sidebar');
                }
            ?>
        </div><!-- .sidebar-inner -->
    </div>

</div><!-- .row -->
</div><!-- .product-main -->

<div class="product-footer">
    <div class="container">
        <?php
            /**
             * woocommerce_after_single_product_summary hook
             *
             * @hooked woocommerce_output_product_data_tabs - 10
             * @hooked woocommerce_upsell_display - 15
             * @hooked woocommerce_output_related_products - 20
             */
            do_action( 'woocommerce_after_single_product_summary' );
        ?>

        <hr>

    </div><!-- container -->

</div><!-- product-footer -->
</div><!-- .product-container -->

编辑：

我从开发者控制台拆开了图像的HTML，但缺少以下项：

data-o_data-thumb =“”

来自：

 <div data-thumb="https://mywebsite.com/wp-content/uploads/2018/09/slim-
 bifold-minimal-extra_013_0087_OPTIONS-600x400.jpg" class="woocommerce-      
 product-gallery__image slide first is-selected is-ready" 
 style="position: absolute; left: 0%;" aria-selected="true" data-o_data-
 thumb="https://mywebsite.com/wp-content/uploads/2015/10/mens-leather-
 walletslim-bifold-minimal-extra_013_0087-386x258.jpg">

我的代码基本上在“ aria-selected =” true“之后完成，并且没有结尾。知道在哪里调用它以及放置代码以使其正常工作吗？

自定义WooCommerce模板-产品变体主图像不变

0 个答案: