Khi người dùng cuộn trang web của bạn, phần sidebar thường sẽ bị trôi đi mất, kéo theo những nội dung quan trọng như quảng cáo, form đăng ký, hay các bài viết nổi bật. Điều này có thể làm giảm tương tác và tỷ lệ chuyển đổi. May mắn thay, với theme Astra, bạn có thể dễ dàng khắc phục vấn đề này bằng tính năng sticky sidebar (sidebar cố định).
Trong bài viết này, chúng tôi sẽ hướng dẫn bạn từng bước để kích hoạt thanh bên cố định một cách đơn giản, giúp giữ chân người dùng và tối ưu hóa hiệu quả cho website WordPress của bạn.
Hướng Dẫn Bật Sticky Sidebar Cho Theme Astra (Chi Tiết & Dễ Hiểu)
1. Giới thiệu tổng quan về Theme Astra
Nếu bạn là người dùng WordPress, chắc hẳn bạn đã từng nghe qua Astra – một trong những theme phổ biến, nhẹ và có tốc độ tải trang nhanh nhất hiện nay. Astra được phát triển bởi Brainstorm Force với mục tiêu mang lại hiệu suất vượt trội và khả năng tùy biến không giới hạn.
Những điểm nổi bật của Theme Astra:
- Siêu nhẹ & Tốc độ cao: Astra có dung lượng dưới 50KB, không sử dụng jQuery và được tối ưu hóa để đạt tốc độ tải trang nhanh nhất, giúp cải thiện điểm số trên các công cụ đo lường như Google PageSpeed Insights.
- Tùy biến dễ dàng: Mọi tùy chỉnh đều được thực hiện trực quan thông qua trình Tùy biến (Customizer) của WordPress, bạn có thể thấy thay đổi ngay lập tức mà không cần biết code.
- Tương thích hoàn hảo: Astra hoạt động mượt mà với hầu hết các page builder phổ biến như Elementor, Beaver Builder, Brizy, và đặc biệt là trình soạn thảo khối Gutenberg.
- Kho giao diện mẫu khổng lồ: Với thư viện Starter Templates, bạn có thể nhập các trang web được thiết kế sẵn chỉ bằng vài cú nhấp chuột, tiết kiệm rất nhiều thời gian xây dựng website.
2. Lợi ích của việc bật Sticky Sidebar là gì?
Sticky sidebar không chỉ là một hiệu ứng “cho đẹp”. Nó mang lại nhiều lợi ích thực tế cho website của bạn:
- Tăng trải nghiệm người dùng (UX): Các thông tin quan trọng như menu điều hướng, bài viết liên quan, hoặc thông tin liên hệ sẽ luôn nằm trong tầm mắt của người đọc, giúp họ dễ dàng truy cập mà không cần cuộn lên đầu trang.
- Tối ưu hóa chuyển đổi (Conversion Rate): Giữ cho các nút kêu gọi hành động (Call-to-Action), form đăng ký email, hoặc banner quảng cáo luôn hiển thị sẽ làm tăng cơ hội người dùng tương tác và thực hiện chuyển đổi.
- Giảm tỷ lệ thoát trang (Bounce Rate): Khi người dùng đọc xong một bài viết, một sidebar cố định hiển thị các bài viết phổ biến hoặc mới nhất sẽ khuyến khích họ tiếp tục khám phá các nội dung khác trên trang của bạn.
3. Hướng dẫn bật Sticky Sidebar cho Theme Astra
Tính năng Sticky Sidebar là một phần của gói Astra Pro Addon. Vì vậy, trước tiên bạn cần đảm bảo rằng mình đã cài đặt và kích hoạt plugin này.
Bước 1: Kích hoạt Astra Pro Addon
- Tại trang quản trị WordPress, đi tới Plugins -> Add New.
- Tải lên và cài đặt plugin Astra Pro Addon mà bạn đã mua.
- Sau khi cài đặt, nhấn Activate (Kích hoạt).
Bước 2: Truy cập vào trình Tùy biến (Customizer)
Từ thanh menu bên trái của trang quản trị, bạn điều hướng đến: Giao diện (Appearance) -> Tùy biến (Customize).
Bước 3: Tìm đến cài đặt Sidebar
Trong giao diện Tùy biến, bạn nhấp vào mục Sidebar.
Bước 4: Kích hoạt Sticky Sidebar
Tại đây, bạn sẽ thấy một tùy chọn là Enable Sticky Sidebar. Chỉ cần gạt nút hoặc đánh dấu tick vào ô để bật tính năng này lên.
Bước 5: Lưu thay đổi và kiểm tra
Sau khi đã bật tính năng, nhấn nút Đăng (Publish) ở phía trên cùng để lưu lại tất cả các thay đổi.
Bây giờ, hãy truy cập vào một trang bất kỳ trên website của bạn có hiển thị sidebar. Cuộn trang xuống và bạn sẽ thấy phần sidebar được giữ cố định một cách mượt mà.
Cách CSS Sticky Sidebar cho Theme Astra
Những bạn sử dụng theme Astra sẽ không cần phải cài plugin sticky sidebar nữa, chỉ cần đưa đoạn css sau vào style.css của theme, là có ngay sticky sidebar rồi.
div#secondary{position:-webkit-sticky;position:sticky;top:100px;padding-bottom:55px;}
4. Kết luận
Chỉ với vài bước đơn giản, bạn đã có thể kích hoạt thành công tính năng sticky sidebar cho theme Astra, một cải tiến nhỏ nhưng mang lại hiệu quả lớn cho cả trải nghiệm người dùng và mục tiêu kinh doanh của bạn. Việc giữ cho các nội dung quan trọng luôn trong tầm mắt của độc giả là một chiến lược thông minh để tăng tương tác và giữ chân họ ở lại trang web lâu hơn.
Hy vọng bài viết này đã giúp bạn tùy chỉnh website của mình một cách hiệu quả. Chúc bạn thành công!
