Trang chủ » Cách tạo Menu thanh bên có thể thu gọn trong WordPress

Cách tạo Menu thanh bên có thể thu gọn trong WordPress

bởi Phạm Đại Nghĩa
0 bình luận
How to Create a Collapsible Sidebar Menu in WordPress (The Easy Way)


Bạn có muốn tạo menu thanh bên có thể thu gọn trong WordPress không?

Menu có thể thu gọn có thể cung cấp cho khách truy cập trang web của bạn một cách dễ dàng để truy cập vào nhiều liên kết mà không làm lộn xộn thanh bên của bạn. Nó hoàn hảo cho các trang web lớn, cửa hàng Thương mại điện tử hoặc bất kỳ trang web nào có bố cục phức tạp hơn.

Trong bài viết này, chúng tôi sẽ hướng dẫn bạn cách dễ dàng tạo một menu sidebar có thể thu gọn trong WordPress.

Cách tạo Menu Sidebar có thể thu gọn trong WordPress (Cách dễ dàng)

Menu thanh bên có thể thu gọn là gì (Và khi nào thì sử dụng)

Các menu thân thiện với người dùng nhất cung cấp khả năng truy cập dễ dàng vào tất cả các liên kết mà khách truy cập cần. Tuy nhiên, điều này có thể phức tạp đối với các trang web có nhiều trang hoặc bố cục phức tạp hơn.

Hãy nghĩ về một cửa hàng Thương mại điện tử lớn có rất nhiều danh mục sản phẩm và danh mục phụ, chẳng hạn như Amazon.

Hiển thị mọi danh mục sản phẩm trong một menu tiêu chuẩn sẽ không phải là một ý tưởng hay. Người mua hàng có thể cần phải cuộn qua menu để tìm danh mục mà họ quan tâm.

Đây là nơi xuất hiện các menu có thể thu gọn. Các menu này sắp xếp nội dung của chúng theo mối quan hệ cha-con. Nếu khách truy cập nhấp vào một mục chính trong menu có thể thu gọn, thì nó sẽ mở rộng để hiển thị tất cả nội dung con của mục gốc đó.

Tờ báo Guardian sử dụng menu có thể thu gọn cho trang web dành cho thiết bị di động của mình.

Ví dụ về menu có thể thu gọn.

Menu có thể thu gọn đôi khi được gọi là menu có thể mở rộng. Điều này là do các phần khác nhau của chúng mở rộng khi khách truy cập nhấp vào chúng.

Theo mặc định, các menu có thể thu gọn ẩn rất nhiều nội dung và độ phức tạp đối với khách truy cập. Điều này thân thiện với người dùng hơn nhiều so với việc cuộn qua một danh sách dài các danh mục và danh mục phụ.

Điều đó nói rằng, chúng ta hãy xem cách bạn có thể dễ dàng tạo menu thanh bên có thể thu gọn trên trang web WordPress của mình.

Cách tạo Menu thanh bên có thể thu gọn trong WordPress

Bạn có thể tạo menu thanh bên có thể thu gọn trong WordPress bằng cách sử dụng Plugin Bellows Accordion Menu.

Bellows Accordion Menu cung cấp một mã ngắn tiện dụng để bạn có thể đặt menu thu gọn của mình trên bất kỳ trang, bài đăng hoặc khu vực tiện ích nào, bao gồm cả thanh bên của bạn.

Menu thanh bên có thể thu gọn trong WordPress.

Đầu tiên, bạn cần cài đặt và kích hoạt plugin. Nếu bạn cần trợ giúp, vui lòng xem hướng dẫn của chúng tôi về cách cài đặt plugin WordPress.

Sau khi kích hoạt, hãy chuyển đến Hình thức »Menu trong bảng điều khiển WordPress của bạn.

Tạo menu trong bảng điều khiển WordPress.

Để bắt đầu, hãy nhập tên cho menu của bạn vào trường ‘Tên menu’. Khách truy cập trang web của bạn sẽ không nhìn thấy tên vì nó chỉ để bạn tham khảo. Sau đó, bạn có thể nhấp vào nút Tạo Menu.

Tiếp theo, bạn có thể chọn các trang bạn muốn thêm vào menu thu gọn. Theo mặc định, WordPress chỉ hiển thị các trang gần đây nhất của bạn. Nếu bạn muốn xem danh sách tất cả các trang trên trang web của mình, hãy nhấp vào tab Xem tất cả.

Thêm trang vào menu WordPress của bạn.

Ngoài ra, bạn có thể nhấp vào Chọn tất cả. Thao tác này sẽ thêm tất cả các trang của bạn vào menu có thể thu gọn.

Khi bạn hài lòng với lựa chọn của mình, hãy nhấp vào nút ‘Thêm vào Trình đơn’. Bạn cũng có thể chọn bài đăng, danh mục blog hoặc thêm liên kết tùy chỉnh. Để biết thêm chi tiết, vui lòng xem hướng dẫn của chúng tôi về cách thêm menu điều hướng trong WordPress.

Sau khi thêm tất cả các trang web khác nhau của bạn vào menu, bạn có thể di chuyển chúng xung quanh bằng cách kéo và thả chúng. Điều này sẽ thay đổi thứ tự các trang này xuất hiện trong menu có thể thu gọn của bạn.

Menu có thể thu gọn là tất cả về mối quan hệ cha mẹ – con cái.

Khi khách truy cập nhấp vào một mục chính trong menu có thể thu gọn của bạn, nó sẽ mở rộng để hiển thị tất cả nội dung con.

Để tạo mối quan hệ này, chỉ cần sử dụng kéo và thả để sắp xếp tất cả các trang con của bạn bên dưới trang mẹ của chúng.

Tiếp theo, nắm lấy từng con và kéo sang phải một chút. Sau đó, bạn có thể phát hành trang này. Thao tác này sẽ thụt lề mục và biến nó thành một trang con.

Thêm bài đăng vào menu WordPress.

Đừng quên nhấp vào nút Lưu thay đổi khi bạn hoàn tất.

Bây giờ chúng ta muốn thêm menu có thể thu gọn này vào thanh bên của WordPress. Để làm điều này, chúng tôi sẽ sử dụng một số shortcode mà Bellows Accordion tạo tự động.

Để lấy mã ngắn, hãy truy cập Giao diện »Menu Bellows. Nếu nó chưa được chọn, hãy đảm bảo rằng bạn chọn tab Hiển thị tất cả.

Shortcode menu có thể thu gọn trong bảng điều khiển WordPress.

Bây giờ bạn có thể nhấp vào hộp Mã ngắn, hộp này sẽ đánh dấu tất cả mã. Bây giờ, sao chép mã này bằng phím tắt Command + c hoặc Ctrl + c.

Bước tiếp theo là dán mã ngắn này vào một tiện ích, vì vậy hãy chuyển đến Giao diện »Tiện ích. Điều này sẽ hiển thị tất cả các khu vực được mở rộng trong chủ đề hiện tại của bạn. Các tùy chọn bạn thấy có thể khác nhau, nhưng hầu hết các chủ đề WordPress hiện đại đều có thanh bên.

Định cấu hình menu thanh bên có thể thu gọn.

Khi bạn đã tìm thấy khu vực thanh bên, hãy nhấp vào nó. Phần này bây giờ sẽ mở rộng.

Để thêm một khối, hãy nhấp vào biểu tượng + và bắt đầu nhập Mã ngắn. Khi nó xuất hiện, hãy chọn khối Mã ngắn.

Cách thêm tiện ích vào thanh bên WordPress.

Bây giờ, chỉ cần dán shortcode menu có thể thu gọn của bạn vào khối này. Để xuất bản menu của bạn, bạn cần nhấp vào nút Cập nhật ở đầu màn hình.

Bây giờ, khi bạn truy cập trang web của mình, bạn sẽ thấy một menu thanh bên có thể thu gọn mới.

Ví dụ về menu có thể thu gọn đang hoạt động

Plugin Bellows Accordion giúp bạn dễ dàng tùy chỉnh menu mặc định này. Ví dụ: bạn có thể thay đổi bảng màu của nó để phản ánh tốt hơn thương hiệu trang web của bạn.

Nếu bạn muốn chỉnh sửa menu mặc định, chỉ cần vào Hình thức »Ống thổi Thực đơn trong bảng điều khiển WordPress của bạn.

Menu này có tất cả các cài đặt bạn cần để tùy chỉnh menu có thể thu gọn của mình. Có rất nhiều cài đặt để khám phá. Tuy nhiên, bạn có thể muốn bắt đầu bằng cách đi tới Cấu hình chính »Cấu hình cơ bản.

Định cấu hình giao diện của menu thanh bên có thể thu gọn trong WordPress của bạn.

Tại đây, bạn có thể chuyển đổi giữa một số màu menu khác nhau. Bạn cũng có thể chọn xem khách truy cập có thể mở rộng nhiều menu con cùng một lúc hay không bằng cách sử dụng cài đặt Gấp Accordion.

Để thay đổi căn chỉnh và chiều rộng của menu, hãy nhấp vào tab ‘Bố cục & Vị trí’.

Đặt menu thu gọn trên trang web WordPress.

Nếu bạn muốn xem trước các thay đổi của mình trong thời gian thực, thì bạn có thể chỉnh sửa menu thanh bên có thể thu gọn trong WordPress Customizer. Để làm điều này, hãy đi đến Giao diện »Tùy chỉnh.

Trong thanh bên trái, chọn Chuông.

Định cấu hình menu có thể thu gọn của bạn trong WordPress Customizer.

Tại đây, bạn sẽ tìm thấy nhiều cài đặt khác nhau cho thanh bên có thể thu gọn của mình. Điều này bao gồm việc thay đổi chiều rộng, căn chỉnh và màu sắc của menu thanh bên của bạn.

Chúng tôi hy vọng bài viết này đã giúp bạn tìm hiểu cách tạo menu thanh bên có thể thu gọn trong WordPress. Bạn cũng có thể xem qua hướng dẫn của chúng tôi về cách theo dõi khách truy cập trang web của bạn và phần mềm thông báo đẩy tốt nhất để tăng lưu lượng truy cập của bạn.

Nếu bạn thích bài viết này, thì hãy đăng ký của chúng tôi Kênh Youtube cho các video hướng dẫn WordPress. Bạn cũng có thể tìm thấy chúng tôi trên TwitterFacebook.

.



Nguồn: www.wpbeginner.com | Dịch bởi: Kênh Viễn Thông

Có thể bạn thích

Để lại một bình luận