Thêm nút xem thêm rút gọn nội dung là điều mà mình đã mất đến 2 ngày để tìm hiểu khi thấy những website khác đều có. Nhưng mình tìm thì chỉ có thu gọn cho danh mục sản phẩm hoặc chi tiết sản phẩm mà thôi.
Vấn đề mình cần ở đây thu gọn cho một nội dung bất kì nào đó ngay trên trang chủ, và không có ai hướng dẫn mình đã tự mày mò và đã thêm được thành công. ở bài viết này mình xin chia sẻ đến bạn cách làm nhanh chóng và thành công này.
1. Vì sao cần thu gọn nội dung text bất kì ?
Hiện nay việc SEO là cực kì quan trọng và không thể thiếu trong việc phát triển, vận hành website. Vì vậy mục đích chính của tất cả cũng chính là đưa web của bạn lên top cao khi có khách hàng tìm kiếm từ khóa nhất định trên google.
Để việc SEO được tốt nhất thì bạn sẽ thường thêm text văn bản vào trang chủ để tối ưu từ khóa hiệu quả. Nhưng như vậy sẽ làm cho website của bạn bị dài hơn rất nhiều gây khó chịu cho người dùng, thì khi này việc thu gọn nội dung có nút xem thêm chính là giải pháp cho bạn.
code nút xem thêm rút gọn nội dung |
2. Cách thêm nút xem thêm rút gọn nội dung
Việc này mình có hỏi trên các diễn đàn nhưng chưa được hỗ trợ nên mình đã tự mày mò mọi thứ và đã thêm thành công đoạn code này website, hãy theo các bước dưới đây nhé.
Bước 1: Đăng nhập vào admin quản trị website bạn, nếu dùng flatsome thì vào global setting và thêm vào phần body bottom. Nếu bạn đang dùng 1 theme bất kì thì thêm nó vào funtinon.php của giao diện bạn đang dùng nhé.
Nút xem thêm thu gọn nội dung |
Bước 2: Tại menu đó vào phần custom css hoặc với những theme khác thì vào giao diện => tùy biến => tùy chỉnh css dán đoạn code sau vào:
<div id=”hiddenContent” class=”hidden-content”> <p> Đây là đoạn nội dung mà bạn cần xem thêm và rút gọn </p> </div> <span id=”showMoreLink” class=”show-more” onclick=”toggleContent()”>Xem thêm</span>