[Tips] - Nút button Open/Close mở đóng & ẩn hiện nội dung cho Blogspot Blogger

Khi người dùng muốn xem nội dung, họ sẽ click vào Nút Open/Close để xem, không xem thì nó ẩn lại!

Có nhiều bạn thắc mắc và hỏi Terocket rằng làm sao để ẩn nội dung và hiện nội dung khi cần thiết. Có nghĩa là, khi bạn đọc xem một nội dung, nhưng ban quản trị chưa muốn hiển thị ngay hoặc để rút ngắn nội dung cho gọn, và lúc nào bạn đọc muốn xem thì click vào xem, không muốn xem nữa thì click vào ẩn đi....thì hôm nay Terocket đáp ứng yêu cầu đó của các bạn, và ra thủ thuật [Tips] - Nút button Open/Close mở đóng & ẩn hiện nội dung cho Blogspot Blogger này. 

Live Demo

Trước đây Terocket đã có hướng dẫn một thủ thuật cũng khá giống với thủ thuật này, đó là khi người dùng vào website, muốn xem nội dung, họ phải like hoặc + nội dung mới xem được, đã có rất nhiều blog và website đã thực hiện thủ thuật này. Để thực hiện bạn vào bài viết: Hiện nội dung được ẩn khi like mạng xã hội cho blogspot nhé!

Với thủ thuật blog [Tips] - Nút button Open/Close mở đóng & ẩn hiện nội dung cho Blogspot Blogger này, thì việc thực hiện nó vô cùng đơn giản, được tích hợp bởi một đoạn code ngắn, sau đó chèn vào HTML của nội dung thế là xong. Điểm lợi thế của thủ thuật blog này đó là nó ngắn, dễ dàng, không sử dụng nhiều Javascript, tốc độ nhanh, bằng CSS chuẩn SEO, tương thích mọi trình duyệt...rất tuyệt vời...Giờ thì cùng Terocket thực hiện thủ thuật [Tips] - Nút button Open/Close mở đóng & ẩn hiện nội dung cho Blogspot Blogger này nha.

Các bạn chỉ cần chèn đoạn mã code sau vào HTML nội dung, nơi các bạn muốn nó hiển thị

Ví dụ bạn muốn chèn nó vào bài viết của Blogspot Blogger, các bạn chỉ cần vào phần Bài đăng mới -> Qua phần HTML -> Chèn đoạn Code tương ứng vào là xong!

<div id="spoiler" style="display: none;">
Nội dung của bạn ở đây, có thể chèn mã HTML vào trong này nhé!
</div>
<button onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}" title="Click to show/hide" type="button">Open/Close</button>

Vậy là đã xong thủ thuật rồi, điều các bạn cần đó là thay đoạn chữ Màu Xanh trên đoạn code ở trên thành nội dung bạn muốn hiển thị hoặc ẩn nhé! Chúc thành công với thủ thuật blog [Tips] - Nút button Open/Close mở đóng & ẩn hiện nội dung cho Blogspot Blogger này.

Nếu bạn nào đã thực hiện được thủ thuật blog này rồi, hãy share và giới thiệu đến bạn bè ở dưới comment, nếu ai chưa hiểu hoặc chưa làm được, hãy gửi comment hỏi đáp sau, Terocket sẽ giải đáp các bạn!

Trứng Vịt - Terocket