产品说明在 Woocommerce 中阅读更多 [英] Product description read more in Woocommerce

问题描述

我需要在我的 Woocommerce 商店中阅读 50 个字后的产品说明中的更多按钮.可以用一些代码吗?谢谢

解决方案

打开 yourwoocommerce/content-single-product.php 文件并导入全局变量 $more，然后将其设置为 false 以获取标签之前的部分:

<?php全球$更多；$temp = $more;$更多=假；$short_description = get_the_content( '' );回声 $short_description;$more = $temp;?>

可以通过调用 the_content() 函数来显示完整的描述文本.在您的简短描述下方创建一个新的

并在那里回应您的完整描述:

<?php$full_description = the_content();?>

接下来你要做的是改变这个

的CSS，这样它就不会在我们需要之前显示出来:

.full-content {显示:无；}

接下来，设置您的 jQuery 函数以在点击阅读更多.."链接时切换这些

.

jQuery(function($) {$(document).ready(function() {$("#readMore, #readLess").click(function(){$(".collapsed-content").toggle('slow', 'swing');$(".full-content").toggle('slow', 'swing');$("#readMore").toggle();//"阅读更多链接 id"返回假；});});});

所以，默认情况下，在 < 之前只有一个简短的描述.– – MORE – – > 显示标签.当用户点击链接时，它只是用完整的描述替换它.如果需要，添加一些动画.完美.

i need to have read more button in product description after 50 words in my Woocommerce store. It is possible with some code? Thanks

解决方案

open yourwoocommerce/content-single-product.php file and import global variable $more, then set it to false to get the part before the tag:

<div class="collapsed-content">
        <?php
            global $more;
            $temp = $more;
            $more = false;
            $short_description = get_the_content( '' );
            echo $short_description;
            $more = $temp;
        ?>
</div>

The full description text can be displayed by calling the_content() function. Create a new <div> below your short description and echo your full description there:

<div class="full-content">
    <?php
        $full_description = the_content();
    ?>
</div>

The next thing you want to do is to change CSS of this <div>, so it wouldn’t be displayed before we need it:

.full-content {
    display: none;
}

Next, set your jQuery function to toggle these <div>s, upon clicking on "Read more.." link.

jQuery(function($) {
    $(document).ready(function() {
        $("#readMore, #readLess").click(function(){
            $(".collapsed-content").toggle('slow', 'swing');
            $(".full-content").toggle('slow', 'swing');
            $("#readMore").toggle();// "read more link id"
            return false;
        });
    });
});

So, by default only a short description before the < – – MORE – – > tag is shown. When user clicks on the link it just replaces it with the full description. Add some animations if you want. Perfect.

这篇关于产品说明在 Woocommerce 中阅读更多的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！