Your Ads Here

[Bài 20] Tạo và quản lý menu trên WordPress

Your Ads Here

Bài này chúng ta có 2 nội dung: thứ nhất là tìm hiểu các vị trí đặt menu trên webiste WordPress, thứ hai là đi tạo và quản lý chúng.

Các vị trí đặt menu


Menu có thể đặt nhiều vị trí trên website, có thể là ở phần đầu trang – Header, các Sidebar widget, ở chân trang – Footer. Tùy từng giao diện mà số chỗ đặt menu cũng khác nhau. Có theme hỗ trợ 4 vị trí (vd: theme Smartline) một số theme chỉ có 1 vị trí để đặt.
Nên đặt tối đa 3 menu thôi, các bạn có thể tham khảo cách bố trí các thanh menu tại Blog Hocban.vn để hình dung.
Cac menu tren blog Hocban.vn
Các menu trên Blog Hocban.vn
Đây là bố cục menu của Blog Hocban.vn , như các bạn thấy có 3 khu vực mình tô đỏ tương ứng với 3 vị trí đặt menu trên blog. Vai trò của mỗi thanh menu như sau:
  • (1) Top Navigation – thanh menu ở vị trí trên cùng, ở đây mình đặt các trình đơn như: giới thiệu, liên hệ, điều khoản,…
  • (2) Main Navigation – thanh menu chính, mình đặt các trình đơn tương ứng với các chuyên mục nội dung trên Blog;
  • (3) Social Menu – thanh menu chứa các “nút” liên kết nhanh đến mạng xã hội.

Tạo nội dung demo cho website


Trong bài số 18 mình có nói các bạn tạo một số Post, Category và Page, nếu bạn chưa làm thì bây bạn tạo cũng được. Nên xóa tất cả các post, category, tag nháp mà các bạn đã tạo trong lúc thực hành. Bạn cũng có thể tham khảo cách làm sau:
  • Tạo 1 chuyên mục “Kiến thức chung“, sau đó tạo trong đó có 2 chuyên mục con tên là “Tìm Hiểu Về Tên Miền” và “Tìm Hiểu Về Hosting & Server“;
  • Trong 2 chuyên mục con đã tạo, copy cho mỗi chuyên mục 2 bài viết. Ở chuyên mục “Tìm Hiểu Về Tên Miền” mình copy 2 bài viết Tên miền là gì ? và Phân loại tên miền . Trong chuyên mục “Tìm Hiểu Về Hosting & Server” mình copy 2 bài viết Máy chủ là gì ? và Hosting là gì ?.
  • Các bạn nhớ thêm Tag và ảnh featured image cho bài viết nhé !
Sau khi tạo xong mấy cái trên thì bạn vào website để xem có gì thay đổi không. Còn đây là website của mình – trông nó có vẻ hơi rối mắt rồi đó. Xem ảnh chụp full màn hình tại đây.
Website demo sau khi xoa va tao moi mot so noi dung
Website demo sau khi xóa và tạo mới một số nội dung

Tạo menu


Bước 1: Vào Customize trên thanh Admin bar (giống bài trước), tiếp theo bạn chọn mục Menus >>Add a Menu >> Nhập tên Menu và nhấn Create Menu để hoàn tất.
Them mot thanh menu tren WordPress
Thêm một thanh menu trên WordPress
Bước 2: Lựa chọn vị trí để đặt cái Menu chính vừa tạo, bạn tick vào mục Main Navigation. Các vị trí còn lại của mục Menu Locations được hiểu như sau:
  • Main Navigation – Menu chính;
  • Top Navigation – thanh menu trên cùng;
  • Footer Navigation – menu đặt dưới footer;
  • Social Icons – menu đặt các icon mạng xã hội;
  • Automatically add new top-level pages to this menu – tự động thêm Pages vào thanh menu này mỗi khi nó được tạo.
Bước 3:  Để thêm các trình đơn vào thanh menu chính đã tạo, bạn nhấn vào Add Items >> đến mụcCategories >> chọn các chuyên mục bạn muốn đưa vào menu. Ở đây mình có chọn sẵn 3 mục như trong hình dưới đây:
Them trinh don vao thanh menu chinh
Them trinh don vao thanh menu chinh
Bước 4: Sắp xếp thứ tự các menu bằng cách rê chuột vào các trình đơn đã tạo >> giữ chuột và kéo thả đến một vị trí mà bạn muốn >> nhấn Save & Publish để lưu lại. Lưu ý: những trình đơn tương ứng với các chuyên mục con thì kéo nó thụt lùi về sau như hình bên dưới nhé !
Sap xep cac trinh don tren thanh menu
Sap xep cac trinh don tren thanh menu
Bước 5: Thêm thanh menu top – đặt tên là “menu trên cùng“, thanh menu này dùng để gắng trình đơn là các trang như: liên hệ, giới thiệu. Cái này các bạn làm tương tự như đối với menu chính ở trên nhé !
  • Mục Menu Locations bạn chọn Top Navigation;
  • Trong mục lựa chọn trình đơn (Add Items) các bạn thay vì chọn mục Categories thì các bạn chọn mục Pages >> chọn các trang mà bạn muốn.
Phần thêm menu mạng xã hội – tức là thêm mấy cái Icon Facebook, Google+, YouTube mình sẽ hướng dẫn trong phần Theme Option nhé !
Bước 6: Nếu bạn muốn xóa một thanh menu thì bỏ tick ở tất cả các mục ở phần Menu Locations thì chức năng xóa thanh menu (Delete Menu) sẽ xuất hiện. Còn xóa một trình đơn trên menu thì bạn click vào trình đơn >> tìm đến nút Remove ở dưới cùng để xóa.
Your Ads Here

Your Ads Here

Your Ads Here

Your Ads Here

Bài đăng cũ hơn Bài đăng cũ hơn

Related Posts

Your Ads Here

2 nhận xét

Loading comments...

Popular Tags

Labels Cloud

Bài đăng phổ biến