Плавный разворот свернутого контента WordPress. Контент обрезается кнопкой «Читать далее». Клик по кнопке плавно разворачивает обрезанный контет.

content_trim_wp.txt

// Плавный разворот свернутого контента WordPress. Контент обрезается кнопкой «Читать далее». Клик по кнопке плавно разворачивает обрезанный контет.

// JavaScript
window.addEventListener('load', function () {
	const read_more_btns = document.querySelectorAll('.reviews-ac__read-more_js');
	if (read_more_btns.length) {
	    read_more_btns.forEach((item) => {
	        item.addEventListener('click', (e) => {
	            man_account_review_read_more_review_click(e);
	        })
	    });
	}
});

// Клик по кнопке «Читать далее»
function man_account_review_read_more_review_click(e) {
    const read_more_btn = e.currentTarget;
    const full_text_wrap = read_more_btn.nextElementSibling;

    if (read_more_btn.classList.contains('text-is-opened')) {
        read_more_btn.textContent = 'Читать далее';
        full_text_wrap.style.maxHeight = '0';
    } else {
        read_more_btn.textContent = 'Свернуть';
        full_text_wrap.style.maxHeight = full_text_wrap.querySelector('.reviews-ac__content-content-inner').scrollHeight + 'px';
    }

    read_more_btn.classList.toggle('text-is-opened');
}

// PHP Loop WordPress
<?php
$content    = get_the_content();
$my_excerpt = wp_trim_words( $content, 20, '' );
// $content    = str_replace( $my_excerpt, '', $content );  такой вариант не прокатывает, когда в $my_excerpt попадают всякие теги и хрень
$content    = mb_substr( $content, iconv_strlen( $my_excerpt ), null );
$content    = apply_filters( 'the_content', $content );

if ( $my_excerpt ) { ?>
    <div class="reviews-ac__content-excerpt"><?php echo $my_excerpt; ?>…</div>
	<?php
}

if ( $content ) { ?>
    <button type="button" class="read-more reviews-ac__read-more_js">читать дальше</button>
    <div class="reviews-ac__content-content"
         style="overflow: hidden; max-height: 0; transition: .2s; margin-top: 20px;">
        <div class="reviews-ac__content-content-inner"><?php echo $content; ?></div>
    </div>
	<?php
} ?>


// И еще разоврачивающийся при клике пункт родительского меню
parent_menu_item.addEventListener('click', (e) => {
    const parent_element = e.currentTarget;

    if (parent_element.classList.contains('opened')) {
        parent_element.style.maxHeight = parent_element.dataset.minimizedHeight + 'px';
        parent_element.classList.remove('opened');
    } else {
        parent_element.dataset.minimizedHeight = parent_element.clientHeight;
        parent_element.style.maxHeight = parent_element.querySelector('.old-menu__inner').scrollHeight + 'px';
        parent_element.classList.add('opened');
    }
});


<nav class="main-menu">
    <ul class="main-menu__list main-menu__list--first">
        <li class="old-menu">
            <div class="old-menu__inner">
                <span>Название родительского пункта</span>
                <ul class="sub-menu">
                    <li><a href="">Элемент подменю</a></li>
                    <li><a href="">Элемент подменю</a></li>
                    <li><a href="">Элемент подменю</a></li>
                </ul>
            </div>
        </li>
        <li><a href='#'>Отзывы</a></li>
        <li><a href="<?php echo get_permalink( HOW_ORDER_PAGE ); ?>">Как заказать</a></li>
    </ul>
</nav>


//////////
//Еще один вариант, очень простой и хороший
<?php
if ( $content ) { ?>
    <div class="reviews-ac__content-excerpt">
		<?php
		if ( mb_strlen( $content ) > 800 ) {
			$visibleCommentText = mb_substr( strip_tags( $content, '<br>' ), 0, 800 ); //открытое содержимое
			$hiddenCommentText  = mb_substr( strip_tags( $content, '<br>' ), 800, mb_strlen( $content ) ); //скрытое содержимое
			echo '<span>' . $visibleCommentText . '</span><button class="reviews-public__read-more_js" onclick="man_public_review_read_more_review_click(this)">...читать ещё</button><span class="hidden-comment-text">' . $hiddenCommentText . '</span>';
		} else {
			echo $content;
		} ?>
    </div>
	<?php
} ?>

// Клик по кнопке «Читать далее»
function man_public_review_read_more_review_click(read_more_btn) {
    const hidden_element = read_more_btn.nextElementSibling;
    hidden_element.style.display = 'inline';
    read_more_btn.remove();
}