Question

我需要的是单击与之相关的图像时，必须对所选产品进行更改。与显示的图像相同，从下拉菜单中更改点击变化（反之亦然）。我花了几天时间寻找解决方案，那一定很简单。编写一些代码可以解决吗？我不要色板之类的插件。我不是天生会说英语的人，所以希望它可以理解。感谢您的任何帮助。

此处： http://obrazyzedreva.cekuj.net/produkt/svata-rodina/

Wordpress，Woocommerce，自定义模板

Answer 1

这是我解决的方法：

product-image.php的一部分

<div>
    <div>
        <?php 
        if( $product->is_type( 'variable' ) ){
            ?>
            <div>
            <div>
                <strong>Vyberte si variantu:</strong>
            </div>
                <?php 
                $variations = $product->get_available_variations();
                foreach ( $variations as $variation ) {                 
                    echo '<div style="display:inline-block">';
                        echo '<img class="selector_'. $variation['variation_id'] .'" width="80" height="80" src=' . $variation['image']['url'] . ' style="margin-right:7px;">';                 
                    echo '</div>';
                }
                ?>  
            </div>
            <script type="text/javascript"> 
                jQuery(function($){
                    <?php foreach ( $variations as $variation ) {
                        foreach($variation['attributes'] as $attributes) {
                            ?>                  
                            $('.selector_<?php echo $variation['variation_id'] ?>').click(function(){
                                $('select[name="attribute_model-vyrobni-cislo"] option[value="<?php echo $attributes ?>"]').attr("selected","selected").trigger('change');
                            });
                        <?php
                        }
                    }
                    ?>
                });
            </script>
            <?php
        }
        ?>  
    </div>  
</div>

Wordpress Woocommerce：单一产品页面库的变化

1 个答案: