Với tiện ích Mục lục trong Elementor Pro, bạn có thể tự động tạo danh sách nội dung hiển thị trên mọi bài viết – giúp người dùng dễ điều hướng và tăng hiệu quả SEO. Khi người dùng nhấp vào một mục trong danh sách, họ sẽ được điều hướng ngay đến phần tương ứng trên trang nhờ tính năng điểm seo. Cùng Webo tìm hiểu chi tiết thêm mục lục vào website bằng Elementor qua bài viết này nhé!
Cách thêm mục lục vào website bằng Elementor Pro
Bước 1: Tạo hoặc chỉnh sửa mẫu bài đăng đơn lẻ
Để thêm mục lục vào website bằng elementor, hãy mở Elementor Theme Builder và tạo một mẫu bài đăng đơn mới hoặc chỉnh sửa một mẫu sẵn có mà bạn muốn thêm mục lục. Webo sẽ hướng dẫn bạn cách tối ưu bài viết blog để cải thiện trải nghiệm người đọc và tăng hiệu quả SEO.
Bước 2: Thêm tiện ích mục lục
Sau khi mở mẫu bài đăng đơn, hãy kéo tiện ích Mục lục (Table of Contents) vào vị trí bạn muốn hiển thị trên trang. Tiện ích này nằm trong danh mục Đơn (Single), cùng với các thành phần như Tiêu đề bài đăng và Nội dung bài đăng.
Ngay khi thêm mục lục vào WordPress bằng Elementor, hệ thống sẽ tự động quét và hiển thị danh sách các tiêu đề có trong bài viết. Bước tiếp theo, bạn chỉ cần tùy chỉnh cài đặt để mục lục hoạt động theo ý muốn.
Bước 3: Cấu hình nội dung tiện ích mục lục
Để tùy chỉnh nội dung hiển thị trong mục lục, hãy mở cài đặt tiện ích Mục lục và chuyển đến tab Nội dung (Content). Tại đây, bạn có thể cấu hình các thành phần quan trọng như:
- Tiêu đề mục lục (Specific heading tags): Nhập tiêu đề hiển thị, ví dụ “Mục lục”, để xuất hiện phía trên danh sách liên kết.
- Chọn nội dung hiển thị:
- Thẻ tiêu đề: Chọn thẻ heading cần đưa vào mục lục (ví dụ, chỉ hiển thị H2 & H3).
- Container khác (Other containers): Thêm mục lục từ các phần ngoài nội dung bài viết, như chân trang (tính năng nâng cao).
Ngoài ra, bạn có thể loại trừ tiêu đề không mong muốn trong tab Exclude bằng cách thêm một lớp CSS đặc biệt (ví dụ: “bỏ qua”) vào tiêu đề H2 trong trình chỉnh sửa WordPress. Sau đó, sử dụng Anchors by Selector để ẩn tiêu đề đó khỏi mục lục.
- Bạn có thể tùy chỉnh cách hiển thị mục lục bằng cài đặt Marker View, lựa chọn giữa kiểu đánh số hoặc dấu đầu dòng.
- Nếu chọn dấu đầu dòng, bạn có thể sử dụng các biểu tượng từ Font Awesome để tạo điểm nhấn.
Ngoài ra, phần Tùy chọn bổ sung giúp bạn kiểm soát nhiều cài đặt khác:
- Word Wrap – Cho phép nội dung mục lục hiển thị trên nhiều dòng nếu cần.
- Minimize Box – Người dùng có thể thu gọn hoặc mở rộng mục lục. Bạn cũng có thể thiết lập biểu tượng tùy chỉnh và điều chỉnh hành vi trên thiết bị di động.
- Hierarchical View – Khi bật, các tiêu đề phụ sẽ thụt lề dưới tiêu đề chính. Bạn cũng có thể cài đặt thu gọn các mục con hoặc giữ danh sách hiển thị đầy đủ.
Bước 4: Tùy chỉnh giao diện mục lục
Chuyển sang tab Kiểu (Style) để thiết lập giao diện cho hộp mục lục. Tại đây, bạn có thể thay đổi màu sắc, kiểu chữ và các tùy chọn khác nhằm đảm bảo mục lục hài hòa với thiết kế tổng thể của trang web. Việc tùy chỉnh này giúp mục lục không chỉ thân thiện với người dùng mà còn tạo sự đồng nhất với giao diện của bạn.
Bước 5: Tùy chỉnh Cài đặt Nâng cao
Cuối cùng, truy cập tab Nâng cao (Advanced)để điều chỉnh một số cài đặt bổ sung, giúp mục lục hoạt động linh hoạt hơn. Nếu đặt Chiều rộng (Width) là Tùy chỉnh (Custom) và Vị trí (Position) là Cố định (Fixed) trong phần Định vị (Positioning), mục lục sẽ luôn hiển thị ngay cả khi người dùng cuộn trang.
Khi muốn hiển thị mục lục “trên” một phần tử khác (chẳng hạn như tiêu đề), bạn có thể tăng Z-Index để đảm bảo nó xuất hiện phía trên.
Việc thêm mục lục vào website bằng Elementor không chỉ giúp tối ưu trải nghiệm người dùng mà còn cải thiện SEO hiệu quả. Với các bước hướng dẫn chi tiết trên, bạn có thể dễ dàng tạo mục lục tự động, giúp nội dung trở nên chuyên nghiệp và dễ điều hướng hơn. Hãy áp dụng ngay để nâng cao chất lượng website của bạn!
