Ngày 30 / Tiết 2 / Thời lượng 20 phút. Mục lục khóa 100 ngày làm web [tháng thứ 2].
Các bài viết dài, phức tạp bạn nên tạo mục lục cho nó.
Ví dụ bạn hãy quan sát bài này: website-demo.b-cdn.net/1cot/hanh-phuc-va-cuoc-song-thoa-man/
Nó là một bài rất dài, nhiều phần nội dung khác nhau đã được chia thành các tiêu đề phụ để dễ hiểu hơn, nhưng hiện không có mục lục để bạn biết nội dung tổng quan của nó là gì? Giống như một cuốn sách gồm nhiều chương nhưng không có mục lục sẽ rất tệ, nội dung phức tạp thiếu mục lục gây khó khăn cho người đọc.
–
Bạn quên mất tiêu đề phụ là gì? Nó chính là cái này:

Và trong quá trình soạn thảo, bạn làm như sau để biến một đoạn văn bản thành tiêu đề phụ:
Dùng chuột quét chọn nó, click vào biểu tượng nốt nhạc, và chọn Heading:

–
Mục lục còn có 2 tác dụng đáng kể nữa:
- Giúp người đọc di chuyển đến bất kỳ phần nội dung nào họ quan tâm.
- Nó giúp ích cho SEO (giúp website của bạn hiển thị trên kết quả tìm kiếm thu hút hơn).
Ví dụ, hãy xem một bài dài khác, nhưng có mục lục: https://kiencang.net/cach-chon-ten-mien-hay/
Bạn thấy là bạn có thể click vào bất cứ link nào trong phần mục lục để di chuyển nhanh đến phần bạn quan tâm (thay vì phải đọc cả bài):

Và khi tìm trên máy tìm kiếm, các link mục lục này có thể xuất hiện:

Lợi ích của nó là rõ ràng, bây giờ chúng ta sẽ đi vào phần hướng dẫn tạo mục lục thông qua plugin.
–
Đầu tiên bạn cần cài và kích hoạt plugin miễn phí: Easy Table of Contents.
Giờ hãy vào một bài viết bất kỳ, mà bài đó có các tiêu đề phụ để xem sự thay đổi, bạn sẽ thấy mục lục xuất hiện. Ví dụ:

Chúng ta sẽ điều chỉnh lại một số cái cho phù hợp hơn.
Tại trang quản trị WordPress, bạn vào Settings > Table of Contents:

Chuyển sang tab Settings:

Điều chỉnh những phần sau:
- Kéo xuống phần Header Label và sửa Table of Contents thành chữ Mục lục:

- Chỗ Show when đổi từ 2 thành 3 hoặc 4:

- Show when này có nghĩa là bài của bạn có ít nhất 3 tiêu đề phụ nó mới hiện mục lục, mặc định là 2 thì ít quá, có hai tiêu đề phụ cũng thành mục lục thì khá kỳ.
- Kéo xuống chỗ Counter chuyển từ mặc định Decimal thành None:

- Mặc định của Counter là Decimal sẽ tự động tạo mục lục hiển thị ở dạng đánh số 1, 2, 3, 4 cho tiêu đề phụ. Còn để None, nó chỉ để mục lục là dạng thông thường, không đánh số. Cái này tốt nhất là bạn thử sẽ thấy rõ sự khác biệt khi để None và để Decimal. Cá nhân tôi cho None tốt hơn trên nội dung phức tạp, việc đánh số bạn chủ động khi thấy cần. Còn nếu nội dung của bạn có cấu trúc dài nhưng không quá phức tạp thì để Decimal có thể sẽ phù hợp hơn.
- Kéo xuống cuối và nhấn Save Changes là giờ website của bạn đã có mục lục trông ổn rồi.
Một số tùy chọn nâng cao khác
Easy Table of Contents có mặc định trông OK, nếu bạn muốn tùy chỉnh nâng cao hơn, đặc biệt là phần giao diện thì hãy quan tâm đến khu vực Appearance, ở đây có các tùy chọn:
- Width: nghĩa là chiều rộng của mục lục, tùy chọn mặc định Auto khá tốt, nhưng nó còn các tùy chọn sau.

- Fixed: nghĩa là chiều rộng cố định, với các lựa chọn từ 200 đến 400px, nghĩa là với bất cứ kích cỡ màn hình nào nó cũng sẽ có chiều rộng như thế. Lựa chọn này thường khá tệ, vì nhiều tiêu đề phụ của bài tương đối dài, làm nó hiển thị không được đẹp lắm trên màn hình lớn.
- Relative: nghĩa là có chiều rộng tương đối, thay đổi theo chiều rộng của website (phụ thuộc vào kích cỡ màn hình của thiết bị truy cập web). 25% nghĩa là nó bẳng 1/4 nội dung, cứ thế đến 100% là đúng bằng kích cỡ nội dung. Cái Auto trong nhiều trường hợp tương đương với 100%.
- Custom: nghĩa là bạn tự quyết định con số chính xác bạn muốn cho chiều rộng, có cả lựa chọn px lẫn %.
- Khi bạn để Auto, đôi khi xảy ra hiện tượng là chiều rộng mục lục không ổn định giữa các bài trên website, do vậy phần này bạn nên chỉ định chiều rộng cụ thể bằng cách chọn 100% ở phần Relative sẽ cho kết quả tốt nhất (thống nhất giao diện của mục lục giữa các bài):

—
- Các lựa chọn liên quan đến font chữ nằm ở phần Font Option.

- Title Font Size: nghĩa là cỡ font chữ của tiêu đề Mục lục. Mặc định để 120% cũng ổn, bạn có thể điều chỉnh nó to hoặc nhỏ hơn một chút để xem có thấy hợp hơn không. Tôi thì chuyển nó thành 110% tức là chữ to bằng 1,1 lần cỡ chữ đang dùng trên website.
- Title Font Weight: mức độ đậm nhạt cho tiêu đề Mục lục.

- Font Size: đây mới là phần chỉnh cỡ font cho các ‘tiêu đề phụ’ trong Mục lục.

–
- Theme Options là nơi để bạn điều chỉnh màu nền của mục lục. Tôi thấy khá thích lựa chọn Light Blue để thay thế mặc định Grey, nó làm mục lục nổi bật một cách vừa phải.

Bài tiếp >>> Rà soát các thiết kế trên website để chỉnh lại cho phù hợp.