Init TOC Generator 3.0

Tạo mục lục tự động từ nội dung có định dạng HTML như h1, h2, h3… bằng Init TOC Generator 2.0. Hỗ trợ xuất dạng danh sách (UL/OL), Markdown hoặc văn bản thuần (outline đánh số). Tự tạo id duy nhất cho tiêu đề, slug hoá tiếng Việt có dấu, không cần plugin, không cần cài đặt.

Giới thiệu

Init TOC Generator là công cụ trực tuyến giúp bạn tạo mục lục tự động (Table of Contents) từ nội dung HTML sử dụng các thẻ <h1> đến <h6>. Công cụ đặc biệt phù hợp với bài viết dài, tài liệu kỹ thuật hoặc blog cần điều hướng rõ ràng – toàn bộ xử lý diễn ra trên trình duyệt, không làm thay đổi bố cục gốc.

Công cụ này đặc biệt hữu ích cho:

• Người viết nội dung kỹ thuật, tài liệu hướng dẫn
• Blog dài cần mục lục để điều hướng nhanh
• Người dùng Notion, Docs, GitHub cần copy TOC dạng Markdown

Tính năng chính

• Tự động phát hiện heading từ h1 tới h6, hỗ trợ nhảy cấp (H2 → H4 vẫn build đúng cấu trúc lồng nhau)
• Chuẩn hoá cấp độ để mục lục luôn thẳng hàng, dễ đọc (căn theo cấp nhỏ nhất trong nội dung)
• Xuất nhiều định dạng: HTML <ul>/<ol>, Markdown hoặc Plain (outline 1., 1.1., 1.1.1.)
• Slug hoá tiếng Việt (bỏ dấu, chuyển “đ” → “d”), tránh trùng bằng cách tự tăng hậu tố -2, -3…
• Tự gắn id vào heading nếu thiếu (an toàn, không phá style); giữ nguyên id sẵn có
• Bỏ qua linh hoạt: thêm class .no-toc hoặc data-toc="false" để loại tiêu đề khỏi TOC
• Đổi nhãn trong TOC bằng data-toc-title="Tiêu đề rút gọn" (không ảnh hưởng nội dung hiển thị)
• Hỗ trợ đa ngôn ngữ, tối ưu cho nội dung tiếng Việt có dấu
• Không làm mất định dạng: chỉ đọc thẻ tiêu đề, giữ nguyên HTML còn lại
• Hỗ trợ chế độ sáng/tối đồng bộ với UI
• Xử lý hoàn toàn trên trình duyệt, không gửi dữ liệu ra ngoài

Cách sử dụng

1. Mở công cụ trên Init HTML
2. Dán hoặc soạn nội dung có các thẻ h1–h6 vào vùng soạn thảo
3. Chọn định dạng xuất mong muốn: HTML UL/OL, Markdown hoặc Plain (outline)
4. Nhấn “Generate TOC” để tạo mục lục
5. Sao chép kết quả và sử dụng tuỳ ý; có thể chỉnh sửa heading rồi tạo lại TOC ngay

Mẹo nhanh: cần rút gọn nhãn chỉ riêng trong mục lục? Thêm thuộc tính data-toc-title vào heading. Muốn loại trừ một tiêu đề? Thêm class no-toc hoặc data-toc="false".

Tối ưu cho hiệu suất và SEO

Init TOC Generator dùng trình soạn thảo Trumbowyg và UIkit để đem lại trải nghiệm nhẹ, mượt kể cả trên thiết bị cấu hình thấp. TOC được trích xuất chính xác theo nội dung, không chèn script hoặc style thừa – giữ HTML sạch, thân thiện SEO và nhanh tải trang.

Mọi thao tác diễn ra phía người dùng, không có dữ liệu nào được gửi về server – đảm bảo riêng tư tuyệt đối.

Tại sao nên dùng Init TOC Generator?

So với plugin TOC nặng nề hoặc script khó kiểm soát, công cụ này:

• Hoạt động tức thì, không phụ thuộc nền tảng
• Tuân thủ chặt chẽ cấu trúc tiêu đề và tạo danh sách lồng nhau chuẩn
• Hỗ trợ đầy đủ Markdown & outline đánh số – lý tưởng cho tài liệu kỹ thuật

Init TOC Generator là giải pháp đơn giản nhưng mạnh mẽ, tạo mục lục rõ ràng, đúng cấp độ và dễ dùng cho mọi loại nội dung.