HTML ↔ Markdown - Chuyển Đổi HTML Markdown Online Converter

Tính năng nổi bật

• Hai chiều chuyển đổi chọn bằng nút, từ HTML sang Markdown và từ Markdown sang HTML
• Chiều HTML sang Markdown nhận tiêu đề từ cấp một tới cấp bốn, đoạn văn, xuống dòng và đường kẻ ngang
• Nhận chữ đậm, chữ nghiêng, mã trong dòng, liên kết, hình ảnh, danh sách và trích dẫn
• Gỡ các thẻ HTML còn lại và giải mã các thực thể thường gặp như dấu và, dấu lớn nhỏ
• Gộp các dòng trống liên tiếp để kết quả Markdown không bị thưa
• Chiều Markdown sang HTML nhận tiêu đề tới cấp ba, chữ đậm, chữ nghiêng, liên kết, ảnh và danh sách gạch đầu dòng
• Ô kết quả có nút sao chép toàn bộ chỉ bằng một cú bấm
• Toàn bộ chuyển đổi chạy trên trình duyệt, nội dung bạn dán vào không gửi lên máy chủ

Khi nào người ta cần đổi giữa hai định dạng này

Có hai hướng và mỗi hướng có bối cảnh riêng. Hướng từ HTML sang Markdown xuất hiện khi bạn di chuyển nội dung ra khỏi một hệ quản trị cũ: bài viết trong cơ sở dữ liệu đang là HTML với đủ loại thẻ định dạng thừa do trình soạn thảo trực quan sinh ra, còn nền tảng mới lại lưu bài dưới dạng Markdown. Cũng hướng này khi bạn muốn đưa nội dung một trang web vào tệp README trên kho mã hoặc vào công cụ ghi chú dùng Markdown. Hướng ngược lại xuất hiện khi bạn viết bằng Markdown cho nhanh rồi cần dán kết quả vào một trình soạn thảo chỉ nhận HTML, chẳng hạn ô nội dung của một hệ quản trị đời cũ, hoặc khi cần một đoạn HTML để nhúng vào thư điện tử. Trong cả hai hướng, làm tay là việc lặp đi lặp lại rất chán: đổi từng thẻ tiêu đề, từng liên kết, từng đoạn đậm nghiêng. Máy làm phần cơ học đó, còn bạn chỉ cần soát lại phần mà máy chuyển không chuẩn.

Lợi ích khi sử dụng

• •Bỏ được phần việc cơ học nhất khi di chuyển nội dung giữa hai nền tảng
• •Xử lý cả bài dài trong một lần thay vì đổi từng thẻ
• •Loại luôn các thẻ trang trí thừa mà trình soạn thảo trực quan hay chèn vào
• •Chuyển được cả hai chiều nên dùng chung cho cả người viết lẫn người dựng trang
• •Nội dung không rời khỏi máy nên dùng được với bài chưa xuất bản

Cách chuyển đổi

1. 1Bấm một trong hai nút ở đầu công cụ để chọn chiều chuyển đổi, nhãn của hai ô sẽ đổi theo.
2. 2Dán nội dung nguồn vào ô bên trái, có thể dán cả bài dài chứ không cần cắt nhỏ.
3. 3Bấm nút Convert, kết quả hiện ở ô bên phải; công cụ không tự chạy khi gõ nên phải bấm lại sau mỗi lần sửa.
4. 4Đọc lướt kết quả và tìm những chỗ hay hỏng nhất: danh sách đánh số, bảng, khối mã và danh sách lồng nhau.
5. 5Bấm nút sao chép để lấy toàn bộ kết quả, rồi sửa tay những chỗ còn lệch trong trình soạn thảo của bạn.

Markdown và HTML khác nhau ở đâu

HTML là ngôn ngữ đánh dấu đầy đủ, mô tả cấu trúc tài liệu bằng các cặp thẻ đóng mở và cho phép gắn thuộc tính, lớp, kiểu dáng lên từng phần tử. Markdown là một lớp cú pháp rút gọn ra đời năm 2004 với mục tiêu rất rõ: văn bản nguồn phải đọc được thoải mái ngay cả khi chưa qua bước hiển thị. Vì vậy Markdown chỉ bao phủ những thứ hay dùng nhất khi viết — tiêu đề, đậm, nghiêng, liên kết, ảnh, danh sách, trích dẫn, mã — chứ không mô tả được mọi thứ HTML mô tả được. Đây là điểm mấu chốt để hiểu vì sao chuyển đổi luôn có mất mát theo một chiều: mọi Markdown đều diễn đạt được bằng HTML, nhưng ngược lại thì không. Một thẻ div có lớp riêng, một bảng có ô gộp, một khung nhúng video, một đoạn có thuộc tính ngôn ngữ đều không có cú pháp Markdown tương ứng. Chính vì hạn chế này mà chuẩn Markdown cho phép viết thẳng HTML xen vào giữa văn bản Markdown, và đó là cách xử lý chính thức cho những thứ Markdown không diễn đạt được.

Công cụ nhận diện chính xác những gì

Ở chiều từ HTML sang Markdown, công cụ xử lý tiêu đề từ cấp một tới cấp bốn, thẻ nhấn mạnh đậm và nghiêng ở cả dạng ngữ nghĩa lẫn dạng cũ, liên kết có thuộc tính href đặt trong dấu ngoặc kép, ảnh có thuộc tính src và alt, mã trong dòng, khối mã, ngắt dòng, đoạn văn, mục danh sách, đường kẻ ngang và trích dẫn. Sau bước đó, mọi thẻ còn lại bị gỡ bỏ và bốn thực thể HTML thông dụng được giải mã. Ở chiều từ Markdown sang HTML, công cụ xử lý tiêu đề tới cấp ba, chữ đậm với hai dấu sao, chữ nghiêng với một dấu sao, ảnh, liên kết, mã trong dòng, mục danh sách bắt đầu bằng dấu gạch ngang, đường kẻ ngang và trích dẫn, rồi bọc các đoạn còn lại trong thẻ đoạn văn. Nắm danh sách này giúp bạn biết trước cần soát chỗ nào: bất cứ thứ gì không nằm trong đây đều hoặc bị bỏ qua, hoặc bị gỡ mất mà không có cảnh báo nào.

Năm chỗ công cụ chuyển không đúng và cách xử lý

Thứ nhất là danh sách đánh số. Ở chiều từ HTML sang Markdown, mọi mục danh sách đều thành gạch đầu dòng, kể cả mục nằm trong danh sách đánh số, nên bạn phải đánh số lại tay. Thứ hai là tiêu đề cấp năm và cấp sáu: chúng không nằm trong danh sách xử lý nên bị gỡ thẻ và tụt xuống thành văn bản thường, hãy hạ chúng thành cấp bốn trước khi chuyển hoặc thêm lại sau. Thứ ba là bảng: cả hai chiều đều không xử lý, nội dung các ô sẽ bị dồn dính vào nhau; hãy tách bảng ra và dựng riêng. Thứ tư là danh sách lồng nhiều cấp: phần thụt đầu dòng biểu thị cấp bị mất, kết quả là mọi mục nằm cùng một cấp. Thứ năm là khối mã ba dấu huyền ở chiều Markdown sang HTML: thứ tự xử lý trong công cụ khiến các khối này không ra đúng thẻ mong đợi, nên với tài liệu kỹ thuật nhiều đoạn mã, hãy chuyển phần văn xuôi trước rồi dán các khối mã vào sau. Ngoài ra, chuỗi ký tự đã được mã hóa như dấu lớn dấu nhỏ sẽ được giải mã ngược lại, nên một ví dụ mã HTML nằm trong bài có thể biến thành thẻ thật.

Quy trình thực tế khi chuyển cả một kho bài viết

Nếu bạn đang di chuyển nội dung từ một hệ quản trị cũ, đừng chuyển thẳng rồi xuất bản. Quy trình đỡ đau nhất gồm bốn bước. Bước một là dọn trước khi chuyển: bỏ các thẻ bao ngoài chỉ dùng để dàn trang, bỏ thuộc tính style và class nội tuyến, bỏ các thẻ span rỗng do trình soạn thảo trực quan sinh ra — làm được bước này thì kết quả Markdown sạch hơn hẳn. Bước hai là chuyển từng bài và soát ngay, tập trung vào năm điểm yếu đã nêu ở phần trên. Bước ba là kiểm tra đường dẫn ảnh và liên kết: sau khi chuyển, đường dẫn tương đối trong bài cũ thường trỏ sai vì cấu trúc thư mục ở nền tảng mới khác đi, nên hãy đổi sang đường dẫn tuyệt đối hoặc sửa lại gốc đường dẫn hàng loạt. Bước bốn là đối chiếu thứ bậc tiêu đề: bài trong hệ quản trị cũ hay dùng tiêu đề cấp một nhiều lần, trong khi mỗi trang chỉ nên có một tiêu đề cấp một, phần còn lại hạ xuống cấp hai. Với số lượng lớn hơn vài chục bài, nên viết một đoạn mã dùng thư viện chuyển đổi chuyên dụng thay vì làm thủ công.

Phương ngữ Markdown và chuyện an toàn khi hiển thị HTML

Markdown không có một chuẩn duy nhất mà tồn tại nhiều phương ngữ. Bản đặc tả CommonMark thống nhất phần lõi, còn phương ngữ dùng trên GitHub bổ sung thêm bảng, danh sách công việc, gạch ngang chữ và tự động nhận diện địa chỉ web. Vì vậy cùng một tệp Markdown có thể hiển thị khác nhau ở hai nơi, và những cú pháp mở rộng như bảng sẽ không hoạt động nếu nền tảng đích chỉ hỗ trợ phần lõi. Trước khi chuyển cả kho tài liệu, hãy kiểm tra nền tảng đích hỗ trợ phương ngữ nào. Điểm thứ hai quan trọng hơn là an toàn: kết quả HTML mà công cụ sinh ra không được lọc, và vì Markdown cho phép nhúng HTML thô nên bất cứ thẻ nào có trong đầu vào cũng đi thẳng ra đầu ra. Với nội dung do chính bạn viết thì không sao. Nhưng nếu bạn định xây một chức năng cho người dùng gửi nội dung Markdown rồi hiển thị lên trang, bắt buộc phải cho HTML sinh ra đi qua một bộ lọc làm sạch trước khi hiển thị, nếu không bạn mở toang một lỗ hổng chèn mã kịch bản.

Câu hỏi thường gặp (FAQ)

Từ khóa liên quan

• chuyển html sang markdown
• chuyển markdown sang html
• html markdown converter
• markdown là gì
• cú pháp markdown cơ bản
• viết readme bằng markdown
• commonmark và github flavored markdown
• chuyển bài viết từ wordpress sang markdown
• markdown table cú pháp
• nhúng html trong markdown
• công cụ chuyển đổi định dạng văn bản
• markdown cho blog tĩnh
• thẻ h1 h2 h3 trong markdown
• markdown code block
• chuyển nội dung cms sang markdown
• làm sạch html trước khi chuyển
• markdown editor online
• html to md online
• md to html online
• công cụ developer online miễn phí