Php Woocommerce限制字数产品类别说明文本

我试图限制woocommerce中“产品类别”页面上“产品类别说明”的字数，并添加“阅读更多”链接以扩展文本。我一直在试图编辑一个产品描述字符限制没有运气。任何帮助都将不胜感激。以下是我在functions.php中编辑的代码：

add_action('woocommerce_product_archive_description', 'description_in_shop_loop_item', 3 );
function description_in_shop_loop_item() {
    global $shop_page;

    // HERE define the number of characters
    $limit = 75;

    $description = $shop_page->post_content; // category description

    // Limit the characters length
    if (strlen($description) > $limit) {
        $excerpt = substr($description, 0, $limit) . '...';
    } else {
        $excerpt = $description;
    }

    echo '<p class="description">'.$excerpt.'</p>';
}

add\u action（'woocommerce\u product\u archive\u description'，'description\u in\u shop\u loop\u item'，3）；
功能描述\u在\u车间\u循环\u项目（）中{
全球$shop_页面；
//这里定义字符数
$limit=75；
$description=$shop\u page->post\u content；//类别描述
//限制字符长度
if（strlen（$description）>$limit）{
$EXECRPT=substr（$description，0，$limit）。“…”；
}否则{
$摘录=$说明；
}
echo“
.”节选“
”；
}

您可以使用一些jQuery缩小描述容器的高度，并添加一个“阅读更多”按钮，将容器的大小调整回其原始高度

add_action( 'woocommerce_after_main_content', 'woocommerce_after_main_content', 10 ); 
function woocommerce_after_main_content() {
    if ( !is_product_category() ) return;

    ?>
    <script>
        jQuery( function( $ ) {
            $(document).ready(function() {

                //Get current height of the description container
                let curHeight = $("header .term-description").height();

                //Set heigth of the description container
                $("header .term-description").css({
                    "height": "100px", 
                    "overflow": "hidden",
                });

                //Add 'Read more' button
                $("header .term-description").after( "<button class='read-more' style='margin:15px 0;'>Read more</button>" );

                //Set description container back to its original height
                $( "header .read-more" ).on( "click", function() {
                    $("header .term-description").animate({height: curHeight});
                });
            });
        });
    </script>
    <?php
}

add_action（'woocommerce_在主要内容之后，'woocommerce_在主要内容之后，'woocommerce_'，10）；
主要内容（）之后的功能{
如果（！is_product_category（））返回；
?>
jQuery（函数（$）{
$（文档）.ready（函数（）{
//获取描述容器的当前高度
设curHeight=$（“header.term description”）.height（）；
//设置描述容器的高度
$（“header.term description”）.css({
“高度”：“100px”，
“溢出”：“隐藏”，
});
//添加“阅读更多”按钮
$（“header.term description”）。之后（“阅读更多”）；
//将描述容器设置回其原始高度
$（“header.readmore”）。在（“单击”，函数（）上）{
$（“header.term description”）.animate（{height:curHeight}）；
});
});
});
这就是我在我的网站上实现的方式。谢谢Terminator barbapapa

if($(window).width() <= 480){
            //Get current height of the description container
            let curHeight = $(".my-expender").height();

            //Set heigth of the description container
            $(".my-expender").css({
                "height": "900px", 
                "overflow": "hidden",
            });

            //Add 'Read more' button
            $(".my-expender").after( "<div class='myrd-wrapper'><div class='my-readmore-gradient'></div><button class='read-more'>READ FULL ARTICLE</button></div>" );

            //Set description container back to its original height
            $( ".read-more" ).on( "click", function() {
                $(".my-expender").animate({height: curHeight});
                // hide button after the button click
                $('.read-more').hide();
                $('.my-readmore-gradient').hide();
            });    
    }

if（$（window）.width（）谢谢你的建议我在发布这个问题后就有了这个想法。这绝对是一个更简单的选择。谢谢你的建议和回答。