Pemformatan kode adalah salah satu fitur terkuat Markdown. Apakah Anda mendokumentasikan fungsi, menunjukkan perintah terminal, atau menulis tutorial, sintaks kode Markdown menjaga kode secara visual berbeda, diformat dengan benar, dan (di sebagian besar platform) disorot sintaks. Panduan ini mencakup semua tentang Markdown blok kode.
Kode Inline
Bungkus cuplikan pendek atau ekspresi tunggal dalam backtick tunggal:
Use `console.log()` to print output.
Set the variable with `const x = 42;`.
The file is saved as `README.md`.
Kode inline render dalam font monospace, secara visual berbeda dari teks sekitarnya. Gunakan untuk:
- Nama fungsi dan metode:
addEventListener() - Nama variabel:
isLoading - Nama file:
package.json - Argumen perintah:
--verbose - Ekspresi kode pendek
Jika kode inline Anda berisi backtick, gunakan backtick ganda untuk membungkusnya:
`` `backtick inside` ``
Blok Kode yang Terbengkalai
Untuk kode multi-baris, gunakan backtick triple (`) untuk membuka dan menutup blok:
```
This is a code block.
It preserves all whitespace and line breaks.
No formatting is applied inside.
```
Indentasi, jarak, dan garis baru semuanya terpelihara dengan tepat.
Penekanan sintaksis
Tambahkan pengidentifikasi bahasa setelah membuka tiga backtick untuk mengaktifkan penekanan sintaksis:
```python
def greet(name: str) -> str:
return f"Hello, {name}!"
print(greet("World"))
```
```javascript
const greet = (name) => `Hello, ${name}!`;
console.log(greet("World"));
```
```bash
#!/bin/bash
echo "Hello, World!"
ls -la ~/Documents
```
Identifier Bahasa Umum
| Bahasa | Identifier (pengidentifikasi) |
|---|---|
| Python | python |
| JavaScript | javascript or js |
| TypeScript | typescript or ts |
| HTML | html |
| CSS | css |
| JSON | json |
| YAML | yaml or yml |
| Bash / Shell | bash or sh |
| SQL | sql |
| Markdown | markdown or md |
| Jawa | java |
| C | c |
| C++ | cpp |
| C# | csharp |
| Pergilah. | go |
| Tembaga | rust |
| Ruby | ruby |
| PHP | php |
| Swift | swift |
| Kotlin | kotlin |
| R | r |
| PowerShell | powershell |
| Dockerfile | dockerfile |
| XML | xml |
| TOML | toml |
| HTTP | http |
| Diff | diff |
Blok Kode yang Termasuk
Sintaksis Markdown yang lebih tua menggunakan indentasi 4-ruang untuk blok kode:
function oldStyle() {
return "This is a code block";
}
Ini CommonMark-kompatibel tetapi kurang dapat dibaca dan tidak mendukung pengidentifikasi bahasa. Sebaliknya, gunakan blok-blok yang terbengkalai (backtick tiga).
Konversi Kode dari Word Dokumen
Teks monospace di Word (Courier New, Consolas, dll.) dikonversi menjadi kode inline saat Anda menggunakan WordToMD. Multi-line code in Word converts depending on how it was formatted:
- Paragraf font monospace → Mungkin menjadi beberapa snippet kode inline
- Word Code gaya → Mengkonversi ke blok kode
- Blok teks secara harfiah → Mungkin perlu pagar manual
Setelah konversi, periksa bagian kode dan tambahkan pagar yang tepat jika diperlukan:
- Temukan kode yang seharusnya menjadi blok
- Membungkusnya dengan backticks tiga
- Tambahkan pengidentifikasi bahasa yang sesuai
Contoh-Contoh Khusus Bahasa
Permintaan HTTP
```http
POST /api/users HTTP/1.1
Host: api.example.com
Content-Type: application/json
Authorization: Bearer TOKEN
{
"name": "Alice",
"email": "alice@example.com"
}
```
Terminal Komando
```bash
npm install
npm run build
npm run dev
```
Output Diff
```diff
- const oldValue = "hello";
+ const newValue = "world";
console.log(newValue);
```
Konfigurasi YAML
```yaml
server:
host: localhost
port: 8080
debug: true
database:
url: postgresql://localhost:5432/mydb
```
Blok Kode Tertanam (Untuk Dokumentasi)
Saat mendokumentasikan Markdown itu sendiri, gunakan 4 backtick untuk membungkus blok yang berisi 3 backtick:
````markdown
```python
# This is a code block inside documentation
```
````
Dukungan Platform
| Platform | Kode Inline | Blok-Blok yang Dibentengi | Penekanan sintaksis |
|---|---|---|---|
| GitHub | ✅ | ✅ | ✅ |
| GitLab | ✅ | ✅ | ✅ |
| Obsidian | ✅ | ✅ | ✅ |
| GitBook | ✅ | ✅ | ✅ |
| Notion | ✅ | ✅ | ✅ |
| Confluence (Markdown) | ✅ | ✅ | ✅ |
| Kode VS | ✅ | ✅ | ✅ |
Angka Baris
Standar Markdown tidak mendukung nomor baris dalam blok kode. Beberapa platform dan generator situs statis menambahkan ini melalui plugin:
- Prism.js (digunakan oleh banyak SSG) add
{numberLines: true}di pagar kode - GitHub tidak ada nomor baris asli dalam render Markdown (gunakan tampilan GitHub Blame sebagai gantinya)
- GitBook nomor baris melalui pengaturan blok kode
Menyalin Kode dari Blok
GitHub dan banyak platform menambahkan tombol Copy ke blok kode secara otomatis. Ini adalah peningkatan rendering itu tidak memerlukan apa-apa yang khusus dalam Markdown Anda.
FAQ
Mengapa sintaks blok kode saya tidak disorot? Baik pengidentifikasi bahasa hilang atau salah eja, atau platform tidak mendukung bahasa tertentu. Periksa daftar identifier di atas.
Bagaimana saya menunjukkan backticks di dalam blok kode? Di dalam blok kode yang tertutup, backtick diperlakukan sebagai karakter harfiah. Hanya pagar tiga-backtick membutuhkan penanganan khusus.
Dokumen Word saya memiliki kode sintaksis yang disorot dengan warna-warni. Akan WordToMD melestarikan warna? Tidak Markdown blok kode tidak mempertahankan pemformatan warna. WordToMD mengubah teks menjadi blok kode; penandai sintaksis kemudian diterapkan oleh Markdown renderer berdasarkan pengidentifikasi bahasa.
Bisakah saya menonjolkan garis tertentu dalam blok kode?
Standar Markdown tidak mendukung ini. Beberapa platform (seperti Astro dengan Shiki, atau Hugo) mendukung garis yang menyoroti melalui komentar: {1,3-5} setelah identifikasi bahasa.
Panduan terkait
- Markdown Sintaksis panduan ringkas Referensi lengkap
- Word sampai API Dokumentasi Dokumentasi yang berat kode
- Word sampai GitHub Markdown GitHub-spesifik pemformatan kode
Kesimpulan
Blok kode markdown sederhana: backtick untuk kode inline, triple backtick dengan pengidentifikasi bahasa untuk blok. Setelah mengkonversi dokumen Word dengan WordToMD, memeriksa bahwa teks monospace telah dibungkus dengan benar dalam sintaksis kode, dan menambahkan pengidentifikasi bahasa untuk penekanan sintaksis yang tepat pada platform target Anda.