wordpress 如何显示Woocommerce产品图库图像在可折叠

xfb7svmp  于 2022-12-03  发布在  WordPress
关注(0)|答案(1)|浏览(170)

我已经建立了woocommerce商店。在我的商店每一个产品都有超过16画廊的形象。
因此,我想显示前8个图库图像,然后在下面显示一个链接“查看更多配置示例”,点击可折叠的事件工作,然后在下面显示另外8个图库图像。
对于这个我的要求,我在谷歌上做研究,但找不到任何解决方案。所以任何一个知道解决方案,然后请帮助我。
谢谢凯坦。

dsf9zpds

dsf9zpds1#

你可以试试这个jquery代码。你需要把这个jQuery添加到你的主题选项中,在footer.php的wp_footer()下面

<script type="application/javascript">
jQuery(document).ready(function () {
    jQuery('.images').append('<div id="loadMore">See more sample configuration</div><div id="showLess">Hide</div>');
    jQuery(".thumbnails a").hide();

    size_li = jQuery(".thumbnails a").size();
    x=3;
    jQuery('.thumbnails a:lt('+x+')').show();
    jQuery('#loadMore').click(function () {
        x= (x+5 <= size_li) ? x+3 : size_li;
        jQuery('.thumbnails a:lt('+x+')').show();
    });
    jQuery('#showLess').click(function () {
        x=(x-5<0) ? 3 : x-3;
        jQuery('.thumbnails a').not(':lt('+x+')').hide();
    });
});
</script>

添加代码后,转到您的产品页面并单击查看更多示例配置。尝试此操作,然后让我知道结果。谢谢

相关问题