Hướng dẫn 3 cách thêm Infinite Scroll vào WordPress

Lượt xem
Home

Infinite Scroll là một kỹ thuật được sử dụng phổ biến bởi nhiều trang web bởi nó cho phép load nhiều nội dung liên tục và vô tận khi người dùng cuộn trang. Điều này mang lại sự thuận tiện cho người dùng khi có thể theo dõi các nội dung trên website mà không phải nhấp vào nút tải thêm. Trong bài viết này, Vietnix sẽ hướng dẫn bạn thêm Infinite scroll vào WordPress theo các bước vô cùng đơn giản.

Tại sao nên thêm Infinite Scroll vào WordPress?

Khi người dùng truy cập vào website và lướt đến cuối trang, họ sẽ bắt gặp một tập hợp các link hay button cho phép khám phá nội dung mới hơn hoặc cũ hơn.

Ví dụ về cuối trang web tập hợp link hoặc nút chuyển trang
Ví dụ về cuối trang web tập hợp link hoặc nút chuyển trang

Khi đó, người truy cập phải nhấp vào liên kết và chờ đợi trang kế tiếp đó được tải. Điều này có thể để lại trải nghiệm không tốt cho người dùng khi sử dụng website.

Để hạn chế những điều này, bạn có thể dụng Infinite Scroll. Đây là một xu hướng thiết kế web sử dụng công nghệ AJAX để tự động tải trang tiếp theo của nội dung và hiển thị ở cuối trang hiện tại. Nội dung tải liên tục và vô tận khi người dùng cuộn trang. Infinite Scroll mang lại trải nghiệm duyệt web mượt mà hơn và giúp người truy cập dễ dàng khám phá nội dung trên website. Từ đó giúp tăng số lượt xem trang và giảm tỷ lệ thoát khỏi trang web.

Tuy nhiên, hãy lưu ý rằng một số trang web dễ dàng điều hướng hơn mà không cần Infinite Scroll.

Ví dụ như các trang web danh mục, nơi mỗi trang bắt đầu là một chữ cái khác nhau. Nếu bạn sử dụng Infinite Scroll, bạn cũng không thể hiển thị chân trang trên trang web WordPress.

Infinite Scroll có thể gây áp lực lên máy chủ của bạn. Do đó, bạn nên cẩn thận nhà cung cấp giải pháp lưu trữ số nếu muốn thử nghiệm Infinite Scrolling.

Phương pháp 1: Thêm Infinite Scroll bằng Catch Infinite Scroll 

Cách đơn giản nhất để thêm Infinite scroll vào WordPress của bạn là sử dụng plugin Catch Infinite Scroll. Đầu tiên, bạn cần cài đặt và kích hoạt plugin Catch Infinite Scroll. 

Sau khi kích hoạt, bạn sẽ thấy một mục menu mới được gắn nhãn Catch Infinite Scroll trong WordPress dashboard. Nhấp vào bảng để cấu hình các thiết lập của plugin.

Giao diện Catch Infinite Scroll
Giao diện Catch Infinite Scroll

Bây giờ, việc cần làm là kích hoạt Infinite Scroll khi người dùng cuộn xuống trang. Để thực hiện, hãy mở danh sách thả xuống Load On và chọn Scroll.

Chọn scroll để kích hoạt khi người dùng cuộn xuống trang
Chọn scroll để kích hoạt khi người dùng cuộn xuống trang

Nếu bạn chọn Click thì Catch Infinite Scroll sẽ hiển thị một nút Load More thay thế.

Tiếp theo, bạn có thể tùy chỉnh các mục bên dưới (điều hướng, trang tiếp theo, nội dung và mục). Các thiết lập mặc định hoạt động khá tốt, vì vậy bạn không cần thay đổi gì.

Phần Image hiển thị biểu tượng load nội dung mà Infinite Scroll sẽ hiển thị khi nội dung đang được tải. Mặc định, Infinite Scroll sử dụng một hình ảnh loader GIF, nhưng bạn có thể thay đổi điều này nếu muốn. Chỉ cần nhấp vào Upload và sau đó chọn một hình ảnh từ thư viện hoặc tải lên một file mới.

Tải biểu tượng lên - Chọn Upload
Tải biểu tượng lên – Chọn Upload

Khi bạn hài lòng với các thiết lập Infinite Scroll, hãy nhấp vào nút Save Changes để lưu lại các thay đổi đã thực hiện.

Bây giờ, nếu bạn truy cập vào trang web của mình, bạn sẽ thấy Infinite Scrolling đang hoạt động.

Giao diện sau khi cài thành công Infinite Scroll
Giao diện sau khi cài thành công Infinite Scroll

Phương pháp 2: Thêm Infinite Scroll bằng YITH Infinite Scrolling 

Nếu bạn đang tìm kiếm một giải pháp đơn giản mà không cần cấu hình thì có thể thử dùng plugin YITH Infinite Scrolling. Bạn chỉ cần cài đặt và kích hoạt plugin này để thêm Infinite scroll vào WordPress. Sau đó, bạn có thể truy cập lại vào trang web của mình để xem tính năng Infinite Scroll đang hoạt động không.

Nếu muốn điều chỉnh Infinite Scroll, bạn có thể sử dụng một vài thiết lập đơn giản bằng cách truy cập vào YITH > Infinite Scrolling trong bảng điều khiển WordPress.

Giao diện sau khi chọn Infinite Scroll - Plugin YITH
Giao diện sau khi chọn Infinite Scroll – Plugin YITH

Tại đây, bạn có thể bật hoặc tắt Infinite Scrolling.

Bạn cũng có thể thay đổi hình ảnh hoặc GIF mà YITH hiển thị khi đang tải nội dung đơn giản bằng cách cuộn xuống phần Loading Image và sau đó nhấp vào Upload.

Upload ảnh làm biểu tượng scroll
Upload ảnh làm biểu tượng scroll

Sau đó, bạn có thể chọn một hình ảnh từ thư viện phương tiện WordPress hoặc tải lên một file mới từ máy tính của bạn.

Phương pháp 3: Thêm Infinite Scroll bằng Ajax Load More (nâng cao)

Ajax Load More sở hữu giao diện nâng cao với nhiều tùy chọn khác nhau, bao gồm một repeater template, trình xây dựng shortcode và truy vấn WordPress. Plugin này cũng cung cấp nhiều thiết lập tùy chỉnh hơn, bao gồm nhiều kiểu biểu tượng tải trang và kiểu button.

Do đó, phương pháp này yêu cầu người dùng phải am hiểu nhiều về WordPress và không được khuyến khích cho người mới bắt đầu. Tuy nhiên, nếu người dùng muốn toàn quyền kiểm soát Infinite Scroll trên trang web của họ thì đây là lựa chọn phù hợp.

Giao diện của Ajax Load More
Giao diện của Ajax Load More

Để tối ưu trải nghiệm người dùng trên website, bạn nên lưu ý đến nhiều yếu tố hơn thay vì chỉ tuy chỉnh scrollbar. Một trong những yếu tố đó là việc chọn một hosting tối ưu cho WordPress với tốc độ cao, ổn định và bảo mật. Và Vietnix là một lựa chọn tuyệt vời cho việc lưu trữ website WordPress của bạn.

Lời kết

Với nội dung trên, Vietnix đã chia sẻ cho các bạn 3 cách để thêm Infinite Scroll vào trang WordPress cực kỳ đơn giản và hiệu quả. Hãy áp dụng kỹ thuật này để nâng cao trải nghiệm người dùng khi truy cập vào website của bạn. Đừng quên theo dõi các bài viết khác của Vietnix để cập nhật thêm nhiều thông tin hữu ích nhé.

Chia sẻ lên

Theo dõi trên

Logo Google new

Đánh giá

5/5 - (153 bình chọn)

Hoàng Vui

Kết nối với mình qua

Icon Quote
Icon Quote
Đăng ký nhận tin
Để không bỏ sót bất kỳ tin tức hoặc chương trình khuyến mãi từ Vietnix

Bình luận