Xem Nội Dung Ngay

Cách sử dụng Markdown trong Ghost - Kinh nghiệm thực tế

Hướng dẫn cách dùng Markdown để soạn thảo bài viết nhanh hơn trong Ghost.

Cường Trần
Cường Trần
5 phút đọc
Cách sử dụng Markdown trong Ghost - Kinh nghiệm thực tế

Markdown đang là xu hướng hiện nay cho mọi phần mềm, dù muốn hay không bạn cũng nên biết và học Markdown thuần thục.

Ghost dùng trình soạn thảo Koenig Editor có thể nhận diện markdown tự động và không những thế Ghost còn gia cường thêm sức mạnh với Ghost Markdown block 😋.

Tôi sẽ chia sẻ một số kinh nghiệm thực tế và mẹo sử dụng Markdown trên Ghost mà tôi dùng hàng ngày trong bài viết này.

Định dạng nhanh đề mục (cơ bản cần nắm bắt)

Cực kỳ nhanh và hữu dụng, bạn sẽ lặp đi lặp lại định dạng này mỗi khi viết bài, là cơ bản của cơ bản khi dùng Markdown.

Với đề mục heading bạn chỉ cần nắm:

## Đề mục 2 (h2)
### Đề mục 3 (h3)

Chỉ cần nhiêu đây coi như bạn đã tiết kiệm thời gian viết bài 50% Markdown rồi 😂.

Chèn ảnh từ nguồn bên ngoài

Ghost Image block sẽ không cho bạn chèn ảnh từ nguồn bên ngoài, bạn chỉ có 2 lựa chọn là: tải ảnh lên và Unplash.

Với Markdown, bạn chèn ảnh bên ngoài dễ dàng.

![image](https://image.com)

Ghost sẽ tự động nhúng ảnh ngay lập tức cho bạn. Bạn sẽ chỉ cần thêm Alt tag và Caption nếu cần để SEO tốt hơn thôi.

Ảnh định dạng WebP load từ Bunny
Ảnh định dạng WebP load từ Bunny.net (đã hotlink protect)
Hướng dẫn dùng ảnh webp để tối ưu website Ghost
Hướng dẫn cách dùng ảnh webp khi viết bài trên Ghost để tối ưu tốc độ trang.

Cách này sẽ không tận dụng được nén ảnh 80% của Ghost và resize ảnh nhưng đổi lại bạn yên tâm hơn về sao lưu vì ảnh không nằm trong thư mục của Ghost.

Tôi thích cách này và thường dùng Bunny vì tính năng cache ảnh, hotlink và giá thành siêu rẻ.

Highlight câu trong bài viết

Bạn không cần phải custom CSS thêm hay dùng tới HTML block vì bạn có thể dễ dàng tạo highlight câu chữ bất kỳ khi cần với Markdown.

Bạn dùng Markdown block và dùng == để tạo highlight.

Hãy xem ví dụ dưới đây.

==Đây là highlight==

Đây là highlight

Nhớ là bạn phải dùng ==Markdown block== thì mới được, Koenig editor không hỗ trợ.

Code block với ngôn ngữ chỉ định

Đừng ngạc nhiên khi bạn không hề thấy code block trong Ghost, vì Ghost dùng Markdown để tạo code block thay vào đó.

Thông thường theme Ghost sẽ tích hợp sẵn highlight code block dành cho các blog chuyên về code lập trình.

Nếu không, mặc định các theme sẽ xem các ngôn ngữ lập trình như nhau và render như nhau.

Hãy xem ví dụ dưới đây

<script>
var x, y;
x = 5;
y = 6;
document.getElementById("demo").innerHTML = x + y;
</script>
Code block với ngôn ngữ Javascript đã được highlight

Bạn dùng Koenig, không dùng markdown block.

Tạo inline code trong văn bản bất kỳ

Tương tự code block, Ghost không có định dạng inline code cho bạn lựa chọn khi bạn muốn biến chữ bất kỳ thành inline code.

Bạn phải dùng markdown để định dạng.

Bạn chỉ cần bao văn bản với ` để biến thành inline code (giống vầy).

inline code

Bạn dùng Koenig editor, tuy là thủ thuật nhỏ nhưng cực kỳ cần thiết. Không biết sẽ rất khó chịu đấy.

Tạo bảng với markdown

Cột 1 Cột 2 Cột 3
Như Thế Này
Đây X Y

Chính xác là bạn luôn thấy theme ghost có giới thiệu tạo bảng table, nhưng hầu hết không ai biết cách tạo như thế nào. 😅

Ghost không có table block để tạo bảng. Bạn phải dùng Markdown để tạo bảng.

Nếu không quen dùng bạn có thể dùng công cụ tạo bảng Markdown để lấy mã Markdown, sau đó copy và dán vào ghost để có bản như ý nhanh chóng, không cần suy nghĩ nhiều.

| Cột  1| Cột 2| Cột 3
| - 	| -    | -   
| Như   | Thế  | Này
| Đây   | X    | Y
Markdown sẽ hiển thị kết quả như trên

Nếu thành thạo bạn cũng có thể tạo bảng Markdown, thực tế cho thấy là không khó lắm.

Tạo footnote cho bài viết

Nếu bạn dùng các nền tảng khác như WordPress, việc tạo footnote cực kỳ phức tạp và phải dùng plugin để tạo.

Ghost thì tích hợp sẵn với markdown, bạn có thể tạo footnote cho bài viết bằng Markdown block.


→ Ví dụ đơn giản cho footnote[^1], và đây là footnote 2[^2] và footnote 3[^3].

[^1]: Diễn giả cho footnote 1.

[^2]: Diễn giả cho footnote 2.

[^3]: Diễn giả cho footnote 3.

→ Ví dụ đơn giản cho footnote[1], và đây là footnote 2[2] và footnote 3[3].


  1. Diễn giả cho footnote 1. ↩︎

  2. Diễn giả cho footnote 2. ↩︎

  3. Diễn giả cho footnote 3. ↩︎


Khuyết điểm của cách này là bạn phải viết cả bài bằng Markdown block chứ không phải MỘT ĐOẠN.

Như vậy sẽ hơi bất tiện khi bạn muốn dùng các Ghost block tiện dụng như Image block.

Lời kết...

Markdown là ngôn ngữ chính trong thế giới web ngày nay, là một ngôn ngữ siêu đơn giản nhưng kết quả là trên cả tuyệt vời.

Tôi biết dùng markdown từ ngày đầu Trello ra mắt lần đầu tiên và dùng nó hàng ngày.

Sau này, có nhiều biến thể hơn để mở rộng markdown phục vụ cho một số nền tảng mới, nhưng cách dùng vẫn không bao giờ thay đổi.

Nếu bạn thấy khó chịu khi lần đầu sử dụng, tin tôi đi, chắc chắn bạn sẽ chuyển sang yêu nó luôn sau khi biết dùng SƠ SƠ 😙.

Nếu bạn có thắc mắc khác hãy để lại bình luận bên dưới nhé!

Hướng Dẫn

Bạn có thể quan tâm

Tự tạo thông báo email khi có thành viên mới đăng ký bằng IFTTT

Hướng dẫn tự tạo thông báo email thời gian thực khi có thành viên mới đăng ký bằng IFTTT miễn phí.

Tự tạo thông báo email khi có thành viên mới đăng ký bằng IFTTT

Thủ thuật chuyển đổi "đồng loạt" mọi định dạng ảnh sang WebP

Hướng dẫn chuyển đổi "all-in-one" đồng loạt mọi định dạng ảnh cho bài viết sang webp với một lệnh đơn giản.

Thủ thuật chuyển đổi đồng loạt mọi định dạng ảnh sang WebP

Mẹo tạo popup thông báo đơn giản cho website Ghost

Hướng dẫn cách tạo Popup thông báo cho Ghost siêu nhanh và đơn giản.

Mẹo tạo popup thông báo đơn giản cho website Ghost
Cường Trần

Cường Trần

Cường chuyên viết về giải pháp liên quan đến WordPress và Ghost, là một How-to blogger thực chiến.