Cách ẩn widget trên mobile đơn giản, nhanh chóng nhất hiện nay

Lượt xem
Home

Widget là nội dung động thường được hiển thị trong sidebar hoặc footer của trang web. Tuy nhiên, đôi khi một widget có thể không phù hợp trên các thiết bị mobile nhỏ hơn. Trong bài viết này, Vietnix sẽ hướng dẫn bạn cách ẩn widget trên mobile mà không cần viết bất kỳ code nào. Bằng cách làm đó, bạn có thể tinh chỉnh giao diện của trang web một cách linh hoạt và tối ưu hóa trải nghiệm người dùng trên các thiết bị mobile.

Tại sao cần ẩn widget trên mobile?

Dù cho giao diện trang web trông tốt trên màn hình máy tính, điều đó không có nghĩa là chúng sẽ tự động trông tốt trên màn hình nhỏ hơn. Khi xem phiên bản mobile của website WordPress, bạn có thể nhận thấy giao diện trông lộn xộn. Một giải pháp là ẩn widget trên mobile, cụ thể là điện thoại và máy tính bảng.

Tại sao cần ẩn Widget trên mobile
Tại sao cần ẩn Widget trên mobile

Đôi khi, ngay cả khi giao diện không trông lộn xộn, hãy cuộn xuống cuối trang web để kiểm tra trên các thiết bị di động. Trong theme WordPress, các widget thường được di chuyển xuống cuối trang. Hình ảnh dưới đây cho thấy cách trang web trông trên một máy tính để bàn. Như bạn có thể thấy, widget tìm kiếm hiển thị ở đầu sidebar.

Website trên máy tính để bàn
Website trên máy tính để bàn

Tuy nhiên, trên thiết bị mobile, widget trong sidebar sẽ xuất hiện dưới nội dung. Điều này có nghĩa là người truy cập sẽ cần cuộn xuống cuối trang để thực hiện tìm kiếm.

Website trên thiết bị mobile
Website trên thiết bị mobile

Đôi khi, hành vi này có thể dẫn đến việc hai widget giống nhau xuất hiện cạnh nhau trên mobile.

Ví dụ, một số chủ sở hữu blog WordPress đặt cùng một widget “Recent Posts” trong sidebar và footer. Để giải quyết vấn đề này, chúng ta sẽ xem cách ẩn widget trên mobile một cách dễ dàng.

Cách ẩn widget trên mobile chuẩn nhất hiện nay

Giải pháp đơn giản nhất để ẩn các widget trên mobile là sử dụng plugin Widget Options. Với plugin này, bạn có thể hiển thị các widget khác nhau dựa trên ngày, vai trò người dùng, thiết bị và nhiều yếu tố khác. Để bắt đầu, bạn chỉ cần cài đặt và kích hoạt plugin Widget Options. Nếu bạn chưa biết cách cài đặt plugin, hãy xem qua video hướng dẫn sau của Vietnix:

Hướng dẫn cài đặt plugin WordPress

Sau đó, truy cập vào trang Appearance > Widgets trong WordPress dashboard để tùy chỉnh hiển thị các widget.

Lựa chọn Widgets trong mục Appearance
Lựa chọn Widgets trong mục Appearance

Tất cả các widget bạn đã thêm vào website WordPress sẽ xuất hiện. Để chỉnh sửa widget, chỉ cần nhấp vào tên của chúng.

Nhập tên widget để tùy chỉnh
Nhập tên widget để tùy chỉnh

Trong cài đặt widget, một số phần mới sẽ được thêm bởi plugin Widget Options. Hãy nhấp vào biểu tượng di động nhỏ và đảm bảo rằng hộp thả xuống “Hide/Show” hiển thị “Hide on checked devices“.

Thiết lập ẩn widget
Thiết lập ẩn widget

Sau đó, chỉ cần chọn “Tablet” và “Mobile” để ẩn widget khỏi mobile.

Chọn Tablet và Mobile để ẩn widget
Chọn Tablet và Mobile để ẩn widget

Sau đó, nhấp vào button “Save” để lưu các thay đổi và truy cập vào website WordPress bằng mobile. Widget bây giờ sẽ không còn xuất hiện nữa.

Widget sau khi đã ẩn
Widget sau khi đã ẩn

Ngoài các thông tin liên quan đến cách ẩn widget trên mobile, bạn có thể tham khảo:

Cách tạo phiên bản mobile của widget trong WordPress

Đôi khi, bạn muốn hiển thị một phiên bản widget khác nhau cho người dùng mobile và người dùng máy tính. Để làm điều đó, thêm 2 widget “Recent Posts” riêng biệt vào website. Sau đó, cấu hình một widget để hiển thị trên máy tính và widget khác để hiển thị trên mobile.

Điều này có thể được thực hiện bằng cách nhấp vào biểu tượng mobile và chọn “Hide on checked devices” sau đó chọn “Tablet” và “Mobile“.

Chọn hiển thị widget trên mobile
Chọn ẩn widget mobile trong Recent Posts

Bây giờ, widget này chỉ sẽ xuất hiện cho khách truy cập sử dụng máy tính để bàn. Bạn có thể thay đổi widget theo ý muốn. Sau khi hoàn thành, đừng quên nhấn button “Save” để lưu các cài đặt.

Nhấp save để lưu cài đặt
Nhấp save để lưu cài đặt

Tiếp theo, để tạo widget thứ 2 chỉ hiển thị trên mobile, bạn chỉ cần làm lại quy trình như trên, nhưng lần này hãy chọn “Desktop” để ẩn widget trên máy tính.

Ẩn widget trên máy tính
Ẩn widget trên máy tính

Bây giờ, bạn có thể thay đổi widget di động theo ý muốn. Sau đó, nhấp vào “Save” và bạn đã có một phiên bản dành cho máy tính và một phiên bản dành cho mobile của cùng một widget.

Ngoài những nội dung trên, bạn có thể tham khảo:

Vietnix với hơn 11 năm hoạt động đã đồng hành với hơn 50.000 khách hàng cá nhân và doanh nghiệp thông qua hệ sinh thái dịch vụ đa dạng và chất lượng gồm: Hosting, VPS, máy chủ, Firewall, tên miền,… Đến năm 2022 Vietnix vinh dự được nhận giải Thương hiệu Việt Nam xuất sắc. Đồng thời, với tỷ lệ 97% khách hàng sau khi sử dụng dịch vụ tại Vietnix đã giới thiệu đến bạn bè, đồng nghiệp cũng là một minh chứng cho chất lượng dịch vụ luôn đáp ứng được mọi nhu cầu của khách hàng.

Nhanh tay đăng ký Vietnix VPS ngay và trải nghiệm dịch vụ ổn định, tốc độ cao, hỗ trợ nhanh chóng với nhiều ưu đãi hấp dẫn nhất.

  • Địa chỉ: 265 Hồng Lạc, Phường 10, Quận Tân Bình, Thành Phố Hồ Chí Minh.
  • Hotline: 1800 1093.
  • Email: sales@vietnix.com.vn.
branding 2

Lời kết

Vietnix hy vọng qua bài hướng dẫn trên bạn đã nắm được cách ẩn widget trên mobile một cách nhanh chóng. Đồng thời, bạn có thể tham khảo các bài viết khác tại Vietnix như cách vô hiệu hóa widget không cần thiết trong WordPress đơn giản hoặc cách ẩn tiêu đề widget WordPress nhanh chóng, nhằm tối ưu tốt hơn cho website, chúc bạn thành công!

Chia sẻ lên

Theo dõi trên

Logo Google new

Đánh giá

5/5 - (104 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