Nội dung cần ẩn hiện ta cần để trong các thẻ như sau

Lorem Ipsum is simply dummy text of the printing and typesetting industry
<i class="dots">...</i>
<span class="more-content">
Nội dung cần ẩn standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</span>
<button class="read-more">Read More</button>

.more-content{
   display: none;
}

	jQuery(document).ready(function( $ ){
	//$(document).ready(function(){
	   $(".read-more").click(function(){

		   $(this).siblings('.dots').toggle();
		   $(this).siblings('.more-content').toggle();
		   
		  if($(this).text()=='Read More'){
			  
	  		$(this).text('Read Less');
		  }
		  else{
	  		$(this).text('Read More');
		  }
	   });
	});

Để tiện hơn trong khi sử dụng chúng ta sẽ biến các tag html thành shortcode để khi cần ẩn nội dung chúng ta chỉ cần gọi shortcode ra mà thôi, chúng ta tạo shortcode như sau trong function.php

// Codfe.com Tạo hàm nút readmore
function cf_readmore($args, $content){
	return '<i class="dots">...</i><span class="more-content">'.$content.'</span><button class="read-more">Read More</button>';
}
add_shortcode('cf-readmore', 'cf_readmore');

Sử dụng SHORTCODE: Lorem Ipsum is [cf-readmore] Nội dung cần ẩn [/cf-readmore]

Nguồn sưu tầm: codfe.com