Menu trong wordpress (Bài 6)

Menu trong wordpress

menu trong wordpress

Menu với tiếng Việt gọi là thanh trình đơn dùng để hiển thị các liên kết trong website. Tùy vào mỗi theme mà chúng ta sẽ có bao nhiêu menu, hiển thị ở trên hay ở dưới, bên trái hay bên phải.

Một số dạng menu trong wordpress thường gặp

  • Menu dọc: Menu được hiển thị theo chiều dọc

menu-trong-wordpress-7

  • Menu ngang: Menu được hiển thị theo chiều ngang

menu-trong-wordpress-5

  • Menu có nhiều cấp

menu-trong-wordpress-6

Tạo menu trong wordpress

Bước 1: Đăng nhập vào trang quản trị http://localhost/wordpress/wp-admin

Bước 2: Chọn Appearance -> chọn Menu -> nhập tên menu tại Menu Name main-> chọn Create Menu

menu-trong-wordpress-1

Bước 3: Tạo danh sách menu

  • Trong wordpress, chúng ta có thể tạo danh sách menu sử dụng trang (Pages), sử dụng bài viết (Posts), sử dụng liên kết (Custom Links) hoặc chuyên mục (Categories).
  • Tuỳ theo yêu cầu, chúng ta có thể sử dụng 1 trong các nguồn trên hoặc tất cả.

menu-trong-wordpress-2

Ví dụ mẫu về cách tạo menu trong wordpress

menu-trong-wordpress-7

Phân tích yêu cầu

  • Liên kết “Trang chủ”: khi người dùng chọn vào liên kết này, trình duyệt sẽ hiển thị trang chủ của website (liên kết đến địa chỉ http://localhost/wordpress)
  • Liên kết “Bài giảng”: khi người dùng chọn vào liên kết này, trình duyệt không chuyển liên kết (liên kết rỗng #)
  • Liên kết “Hệ quản trị nội dung web”: khi người dùng chọn vào liên kết này, trình duyệt sẽ hiển thị tất cả những bài viết thuộc chuyên mục (category) “Hệ quản trị nội dung web”
  • Liên kết “Thiết kế web”: khi người dùng chọn vào liên kết này, trình duyệt sẽ hiển thị tất cả những bài viết thuộc chuyên mục (category) “Thiết kế web”

Thực hiện
Tạo liên kết “Trang chủ“: chọn Custom Links -> nhập liên kết tại URL, nhập chuỗi hiển thị của menu tại Link Text -> chọn Add to Menu
custom-links-trong-wordpress Tạo liên kết “Bài giảng“: chọn Custom Links -> nhập # tại URL, nhập Bài giảng tại Link Text -> chọn Add to Menu
custom-links-trong-wordpress-2

Tạo liên kết “Hệ quản trị nội dung web”

Bước 1: Tạo chuyên mục trong wordpress

  • Tạo 2 chuyên mục “Hệ quản trị nội dung web” và “Thiết kế web
  • Cách tạo: chọn Post -> chọn Categories

chuyen-muc-trong-wordpress

  • Nhập tên chuyên mục tại Name -> chọn Add New Category

chuyen-muc-trong-wordpress-2

  • Kết quả sau khi tạo 2 category

chuyen-muc-trong-wordpress-3

Bước 2: Thêm chuyên mục vào menu

  • Tại thẻ “Categories-> chọn View All -> chọn “Hệ quản trị nội dung web” và “Thiết kế web-> chọn Add to Menu

chuyen-muc-vao-menu-wordpress-1

  • Kết quả sau khi thêm 2 chuyên mục “Hệ quản trị nội dung web” và “Thiết kế web” vào menu

them-chuyen-muc-vao-menu-wordpress-2

Bước 3: Thêm menu vào Widgets

  • Chọn Appearance -> chọn Widgets -> chọn Custom Menu -> tại Select Menu, chọn main -> chọn Save

custom-menu-trong-wordpress

  • Kết quả hiển thị trong trình duyệt

menu-trong-wordpress-7

Tạo bài viết trong wordpress

Bài viết là nội dung muốn hiển thị trên website. Bài viết có thể thuộc một hoặc nhiều chuyên mục

Giả sử tạo bài viết với yêu cầu như sau

  • Tiêu đề bài viết

Hệ quản trị nội dung web với wordpress

  • Nội dung bài viết

Giới thiệu tổng quan về hệ quản trị nội dung web – CMS

CMS là gì?

Hệ quản trị nội dung, hay còn gọi là hệ thống quản lý nội dung hoặc CMS (Content Management System) là phần mềm cho phép xây dựng một hệ thống tài liệu và các loại nội dung khác một cách thống nhất.

  • Thuộc chuyên mục: Hệ quản trị nội dung web

Cách thực hiện

  • Bước 1: chọn Add New tại mục Posts

tao-bai-viet-trong-wordpress-1

  • Bước 2: nhập tiêu đề bài viết, nội dung bài viết, chọn chuyên mục và hoàn tất

tao-bai-viet-trong-wordpress-2

Chỉnh sửa, xem hoặc xoá bài viết trong wordpress

  • Chọn All Post -> chọn Edit hoặc Trash hoặc View

chinh-sua-bai-viet-trong-wordpress

Bài tập thực hành: Xây dựng website bán hàng

Yêu cầu:

  • Website có 3 chuyên mục Giới thiệu, Tin tứcHỗ trợ
  • Trong chuyên mục Giới thiệu có các bài viết:
    • Giới thiệu website
    • Hướng dẫn mua hàng
    • Phương thức thanh toán
  • Trong chuyên mục Tin tức có các bài viết:
    • Tin tức mới nhất
    • Hàng mới về
    • Hàng giảm giá
    • Khuyến mãi
  • Trong chuyên mục Hỗ trợ có các bài viết:
    • Hỗ trợ khách hàng qua điện thoại
    • Hỗ trợ khách hàng trực tuyến

Xem giáo trình thiết kế web

Trả lời