Skip to content
21
11/20

Biên soạn file markdown tại github với prose.io

Biên soạn file markdown tại github với prose.io

JNkUDjB.jpeg (35 KB)

Ngôn ngữ trình bày văn bản markdown chỉ quen thuộc với lập trình viên và system admin nên khi biên soạn file trên github.com thường gây khó chịu với người dùng mới. Prose.io là 1 công cụ miễn phí cho phép kết nối trực tiếp đến các kho lưu trữ trên github.com và trực quan hơn.

Ủy quyền chỉnh sửa nội dung trên github cho prose.io

Ngay khi truy cập prose.io bạn sẽ được yêu cầu hỏi thông tin đăng nhập của tài khoản github để bắt đầu sử dụng được prose.io

L7OjWoL.jpeg (21 KB)

JNkUDjB.jpeg (35 KB)

Tiếp đến,  Github sẽ hỏi các repositories trong tài khoản GitHub của bạn để có thể chỉnh sửa nội dung trên GitHub

i5yiAFN.jpeg (20 KB)

Biên soạn file markdown trực quan bằng prose.io

Bạn hoàn toàn có thể biên soạn file markdown trên github nhưng kém trực quan hơn, prose.io chỉ là 1 tool miễn phí trong số nhiều tool biên tập hỗ trợ markdown. Tại thanh toolbar của prose.io có những chức năng cơ bản để có thể click chọn và định dạng, trên thực tế khi bạn thành các ký hiệu của ngôn ngữ markdown thì hoàn toàn có thể biên soạn trực tiếp từ github và dùng tính năng preview để xem trước khi lưu.

Một số định dạng markdown thường sử dụng:

Thẻ đề mục

Markdown sử dụng kí tự # để bắt đầu cho các thẻ đề mục, có thể dùng từ cấp 1 đến 6 ký tự thăng (#) liên tiếp

# Đề mục cấp 01 (heading 1, h1)
## Đề mục cấp 02 (heading 2, h2)
### Đề mục cấp 03 (heading 3, h3)
#### Đề mục cấp 04 (heading 4, h4)
##### Đề mục cấp 05 (heading 5, h5)
##### Đề mục cấp 06 (heading 6, h6)

Chèn liên kết

Cách thực hiện đơn giản là chọn đoạn văn bản (bôi đen) và chọn Insert Link

prose-3.jpg (12 KB)

Tại Insert Link, dán liên kết tại Link URL và chọn Insert

prose-4.jpg (18 KB)

Kết quả được hiển thị như sau:

prose-5.jpg (16 KB)

Chèn hình ảnh vào bài viết

Để chèn hình ảnh vào bài viết, bạn chọn Insert Image => selecting one để upload ảnh từ máy tính lên prose.io hoặc chèn theo cú pháp bên dưới

![prose.jpg]({{site.baseurl}}/tutorial---basics/prose.jpg)

Định dạng in đậm

Để tạo đoạn văn bản dạng in đậm, chọn Bold hoặc đặt trong cặp 2-dấu sao (**)

**Tính năng Markdown định dạng đậm**

Định dạng in nghiêng

Để tạo đoạn văn bản dạng in nghiêng, chọn italic hoặc đặt trong cặp dấu gạch dưới (_)

_Tính năng Markdown_

Tạo đoạn văn bản dạng trích dẫn

Để tạo đoạn văn bản dạng trích dẫn, chọn Blockquote hoặc bắt đầu bằng dấu >

> demo đoạn văn bản trích dẫn Tính năng Markdown

Định dạng danh sách không có thứ tự (bullet list)

Để tạo đoạn văn bản dạng gạch đầu dòng, chọn List hoặc bắt đầu mỗi mục bằng dấu trừ (-)

- Tính năng Markdown
- Đây là item trong bullet list
- ...

Định dạng danh sách số

Để tạo đoạn văn bản định dạng số, chọn Numbered List

1. Tính năng markdown
2. Đây là item trong numbered list

Bảng biểu

| Cột 1 | Cột 2 | Cột 3| Cột 4 |
|--------------|-------|------|-------|
| Hàng 2 | 2 x 1 | 2 x 2 | 2 x 3 | 2 x 4 |
| Hàng 3 | 3 x 1 | 3 x 2 | 3 x 3 | 3 x 4 |
| Hàng 4 | 4 x 1 | 4 x 2 | 4 x 3 | 4 x 4 |

Có thể bạn sử dụng trang http://markdownlivepreview.com/ paste vào đó đoạn markdown bạn viết và xem trước để chỉnh sửa cho phù hợp.

Bonus: 1 số định dạng đặc biệt

Nội dung định dạng nguy hiểm

:::danger
Nội dung cần cảnh báo
:::

Nội dung định dạng cảnh báo

:::caution
Nội dung cần cảnh báo
:::

Series bài viết Triển khai website Tài liệu sử dụng bằng Docusaurus

1) Cài đặt và triển khai Docusaurus trên Cloudflare Pages (doing)
2) Biên soạn trực tiếp file markdown tại github với prose.io < you are here
3) Hướng dẫn tổ chức lại bố cục trang chủ, file tài liệu chi tiết của Docusaurus
4) Hướng dẫn tùy biến và cài đặt 1 số plugin cần thiết cho Docusaurus  (todo)
5/5 (1 bầu chọn)