Menggunakan Markdown di Azure DevOps
Layanan Azure DevOps | Azure DevOps Server 2022 - Azure DevOps Server 2019
Penting
Pilih versi artikel ini yang sesuai dengan platform dan versi Anda. Pemilih versi berada di atas daftar isi. Cari platform dan versi Azure DevOps Anda.
Dalam artikel ini, temukan panduan sintaks dasar untuk menggunakan Markdown di fitur Azure DevOps dan wiki Markdown. Anda dapat menggunakan konvensi Markdown umum dan ekstensi rasa GitHub.
Gunakan Markdown untuk menambahkan pemformatan, tabel, gambar, dan lainnya ke halaman proyek Anda, file README, dasbor, permintaan pull, wiki, dan sebagainya.
Tidak semua sintaks Markdown didukung di semua fitur di Azure DevOps. Tabel berikut ini menautkan ke setiap bagian sintaks dasar dalam artikel ini dan menyoroti fitur mana yang mendukungnya.
Untuk informasi selengkapnya, lihat Definisi Selesai (papan), widget Markdown, permintaan pull, file README, dan wiki.
Header
Menyusun konten Anda menggunakan header. Header mensegmentasi konten yang lebih panjang, sehingga lebih mudah dibaca.
Untuk mengatur judul, mulai baris dengan karakter #
hash . Atur komentar Anda dengan subjudul dengan memulai baris dengan lebih banyak karakter hash, misalnya, ####
. Anda dapat menggunakan hingga enam tingkat judul.
Contoh:
# This is a H1 header
## This is a H2 header
### This is a H3 header
#### This is a H4 header
##### This is a H5 header
Hasil:
Paragraf dan hentian baris
Didukung dalam: Definisi Selesai | Widget markdown | Permintaan Pull | File README | Wiki
Jadikan teks Anda lebih mudah dibaca dengan memecahnya menjadi paragraf atau pemisah baris.
Permintaan pull
Di komentar permintaan pull, pilih Enter untuk menyisipkan pemisah baris, dan mulai teks pada baris baru.
Contoh - komentar permintaan pull:
Add lines between your text with the **Enter** key. Your text gets better spaced and makes it easier to read.
Hasil:
Tambahkan baris di antara teks Anda dengan tombol Enter .
Teks Anda mendapat spasi yang lebih baik dan membuatnya lebih mudah dibaca.
File markdown atau widget
Dalam file markdown atau widget, masukkan dua spasi sebelum pemisah baris, lalu pilih Enter untuk memulai paragraf baru.
Contoh - File markdown atau widget:
Add two spaces before the end of the line, and then select **Enter**.(space, space, Enter) A space gets added in between paragraphs.
Hasil:
Tambahkan dua spasi sebelum akhir baris, lalu pilih Enter.
Spasi ditambahkan di antara paragraf.
Blockquotes
Kutip komentar atau teks sebelumnya untuk mengatur konteks komentar atau teks Anda. Kutip satu baris teks dengan >
sebelum teks. Gunakan banyak >
karakter untuk menumpuk teks yang dikutip. Blok kutipan baris teks dengan menggunakan tingkat yang sama di >
banyak baris.
Contoh:
> Single line quote >> Nested quote >> multiple line >> quote
Hasil:
Aturan horizontal
Untuk menambahkan aturan horizontal, tambahkan garis yang merupakan serangkaian tanda hubung ---
. Baris di atas baris yang ---
berisi harus kosong.
Contoh:
above ---- below
Hasil:
atas
di bawah
Penekanan (tebal, miring, coretan)
Didukung dalam: Definisi Selesai | Widget markdown | Permintaan Pull | File README | Wiki
Anda dapat menekankan teks dengan menerapkan tebal, miring, atau coretan ke karakter:
- Untuk menerapkan miring: kelilingi teks dengan tanda bintang
*
atau garis bawah_
- Untuk menerapkan tebal: kelilingi teks dengan tanda bintang
**
ganda . - Untuk menerapkan coretan: kelilingi teks dengan karakter
~~
tilde ganda .
Gabungkan elemen-elemen ini untuk menerapkan penekanan pada teks.
Catatan
Tidak ada sintaks Markdown yang mendukung teks garis bawah. Dalam halaman wiki, Anda dapat menggunakan tag HTML <u>
untuk menghasilkan teks bergaris bawah. Misalnya, <u>underlined text</u>
menghasilkan teks bergaris bawah.
Contoh:
Use _emphasis_ in comments to express **strong** opinions and point out ~~corrections~~ **_Bold, italicized text_** **~~Bold, strike-through text~~**
Hasil:
Gunakan penekanan dalam komentar untuk mengekspresikan pendapat yang kuat dan menunjukkan koreksi
Teks tebal dan miringTebal, teks coretan
Penyorotan kode
Sorot segmen kode yang disarankan menggunakan blok sorotan kode.
Untuk menunjukkan rentang kode, bungkus dengan tiga tanda kutip backtick (```
) pada baris baru di awal dan akhir blok. Untuk menunjukkan kode sebaris, bungkus dengan satu kutipan backtick (`
).
Penyorotan kode yang dimasukkan dalam widget Markdown merender kode sebagai teks yang telah diformat sebelumnya.
Contoh:
``` sudo npm install vsoagent-installer -g ```
Hasil:
sudo npm install vsoagent-installer -g
Contoh:
```To install the Microsoft Cross Platform Build & Release Agent, run the following: `$ sudo npm install vsoagent-installer -g`.```
Hasil:
To install the Microsoft Cross Platform Build & Release Agent, run the following command: `$ sudo npm install vsoagent-installer -g`.
Dalam file Markdown, teks dengan empat spasi di awal baris secara otomatis dikonversi ke blok kode.
Atur pengidentifikasi bahasa untuk blok kode untuk mengaktifkan penyorotan sintaks untuk salah satu bahasa yang didukung dalam highlightjs.
``` language code ```
Contoh lainnya:
``` js const count = records.length; ```
const count = records.length;
``` csharp Console.WriteLine("Hello, World!"); ```
Console.WriteLine("Hello, World!");
Sarankan perubahan
Dalam permintaan pull, Anda dapat menggunakan komentar untuk menyarankan teks pengganti untuk satu atau beberapa baris dalam file. Pengguna dapat dengan mudah menerapkan perubahan yang disarankan dengan memilih Terapkan Perubahan. Tindakan ini menghasilkan penerapan perubahan pada permintaan pull.
Penyorotan kode yang dimasukkan dalam widget Markdown merender kode dalam format berbeda dengan baris yang diawali oleh '-' dan '+'.
Contoh:
```suggestion for i in range(A, B+100, C): ```
Untuk informasi selengkapnya, lihat Menyarankan perubahan dalam komentar.
Tabel
Menata data terstruktur dengan tabel. Tabel sangat berguna untuk menjelaskan parameter fungsi, metode objek, dan data lainnya dengan nama yang jelas untuk pemetaan deskripsi.
- Tempatkan setiap baris tabel pada barisnya sendiri.
- Pisahkan sel tabel menggunakan karakter
|
pipa . - Untuk menggunakan karakter pipa dalam tabel, Anda harus melarikan diri dengan garis miring terbelakang
\|
. - Dua baris pertama tabel mengatur header kolom dan perataan elemen dalam tabel.
- Gunakan titik dua (
:
) saat memba merupakan header dan isi tabel untuk menentukan perataan kolom (kiri, tengah, kanan). - Untuk memulai baris baru, gunakan tag pemisah HTML () (
<br/>
berfungsi dalam Wiki tetapi tidak di tempat lain). - Pastikan untuk mengakhiri setiap baris dengan pengembalian gerbong (CR) atau umpan baris (LF).
- Anda harus memasukkan spasi kosong sebelum dan sesudah item kerja atau permintaan pull (PR) yang disebutkan di dalam sel tabel.
Contoh:
| Heading 1 | Heading 2 | Heading 3 |
|-----------|:-----------:|-----------:|
| Cell A1 | Cell A2 | Cell A3 |
| Cell B1 | Cell B2 | Cell B3<br/>second line of text |
Hasil:
Judul 1 | Judul 2 | Judul 3 |
---|---|---|
Sel A1 | Sel A2 | Sel A3 |
Sel B1 | Sel B2 | Sel B3 baris kedua teks |
Daftar
Gunakan daftar untuk menata item terkait. Anda dapat menambahkan daftar berurutan dengan angka atau daftar yang tidak diurutkan hanya dengan poin. Daftar berurutan dimulai dengan angka diikuti dengan titik untuk setiap item daftar. Daftar yang tidak diurutkan dimulai dengan -
.
Mulai setiap item daftar pada baris baru. Dalam file markdown atau widget, masukkan dua spasi sebelum hentian baris untuk memulai paragraf baru atau masukkan dua hentian baris secara berturut-turut untuk memulai paragraf baru.
Daftar berurutan atau bernomor
Contoh:
1. First item.
1. Second item.
1. Third item.
Hasil:
- Item pertama.
- Item kedua.
- Item ketiga.
Daftar berpoin
Contoh:
- Item 1
- Item 2
- Item 3
Hasil:
- Item 1
- Item 2
- Item 3
Daftar bertumpuk
Contoh:
1. First item.
- Item 1
- Item 2
- Item 3
1. Second item.
- Nested item 1
- Further nested item 1
- Further nested item 2
- Further nested item 3
- Nested item 2
- Nested item 3
Hasil:
- Item pertama.
- Item 1
- Item 2
- Item 3
- Item kedua.
- Item berlapis 1
- Item berlapis lebih lanjut 1
- Item berlapis lebih lanjut 2
- Item berlapis lebih lanjut 3
- Item berlapis 2
- Item berlapis 3
- Item berlapis 1
Tautan
Dalam komentar permintaan pull dan wiki, URL HTTP dan HTTPS secara otomatis diformat sebagai tautan. Anda dapat menautkan ke item kerja dengan memasukkan #
kunci dan ID item kerja lalu memilih item kerja dari daftar.
Hindari saran otomatis untuk item kerja dengan awalan #
dengan garis miring terbalik (\
). Tindakan ini dapat berguna jika Anda ingin menggunakan #
untuk kode heksa warna.
Di File markdown dan widget, Anda dapat mengatur hyperlink teks untuk URL Anda menggunakan sintaks tautan Markdown standar:
[Link Text](Link URL)
Saat Anda menautkan ke halaman Markdown lain di repositori Git atau Team Foundation Version Control (TFVC) yang sama, target tautan dapat menjadi jalur relatif atau jalur absolut di repositori.
Tautan yang didukung untuk halaman Selamat Datang:
- Jalur relatif:
[text to display](target.md)
- Jalur absolut di Git:
[text to display](/folder/target.md)
- Jalur absolut di TFVC:
[text to display]($/project/folder/target.md)
- URL:
[text to display](http://address.com)
Tautan yang didukung untuk widget Markdown:
- URL:
[text to display](http://address.com)
Tautan yang didukung untuk Wiki:
- Jalur absolut halaman Wiki:
[text to display](/parent-page/child-page)
- URL:
[text to display](http://address.com)
Catatan
- Tautan ke dokumen pada berbagi file menggunakan
file://
tidak didukung untuk tujuan keamanan. - Untuk informasi tentang cara menentukan tautan relatif dari halaman Selamat Datang atau widget Markdown, lihat Tautan relatif kontrol sumber.
Contoh:
[C# language reference](/dotnet/csharp/language-reference/)
Hasil:
Tautan relatif kontrol sumber
Tautan ke file kontrol sumber ditafsirkan secara berbeda tergantung pada apakah Anda menentukannya di halaman Selamat Datang atau widget Markdown. Sistem menafsirkan tautan relatif sebagai berikut:
- Halaman selamat datang: Relatif terhadap akar repositori kontrol sumber tempat halaman selamat datang ada
- Widget markdown: Relatif terhadap basis URL pengumpulan proyek tim
Contohnya:
Halaman selamat datang | Widget markdown setara |
---|---|
/BuildTemplates/AzureContinuousDeploy.11.xaml | /DefaultCollection/Fabrikam Fiber/_versionControl#path=$/Tfvc Welcome/BuildTemplates/AzureContinuousDeploy.11.xaml |
./page-2.md | /DefaultCollection/Fabrikam Fiber/_versionControl#path=$/Tfvc Welcome/page-2.md |
Tautan jangkar
Dalam file Markdown, ID jangkar ditetapkan ke semua judul saat dirender sebagai HTML. Tautan jangkar juga mendukung karakter khusus. ID adalah teks judul, dengan spasi digantikan oleh tanda hubung (-) dan semua huruf kecil. Konvensi berikut berlaku untuk tautan jangkar:
- Tanda baca dan spasi putih di depan dalam nama file diabaikan
- Huruf besar dikonversi ke huruf kecil
- Spasi antar huruf dikonversi menjadi tanda hulu (-)
Contoh:
###Link to a heading in the page
Hasil:
Sintaks untuk tautan jangkar ke bagian...
[Link to a heading in the page](#link-to-a-heading-in-the-page)
ID semuanya huruf kecil, dan tautan peka huruf besar/kecil, jadi pastikan untuk menggunakan huruf kecil, meskipun judul menggunakan huruf besar.
Anda juga dapat mereferensikan judul dalam file Markdown lain:
[text to display](./target.md#heading-id)
Di wiki, Anda juga dapat mereferensikan judul di halaman lain:
[text to display](/page-name#section-name)
Gambar
Untuk menyoroti masalah atau membuat hal-hal lebih menarik, Anda dapat menambahkan gambar dan GIF animasi ke aspek permintaan pull berikut.
- Komentar
- File markdown
- Halaman Wiki
Gunakan sintaks berikut untuk menambahkan gambar:
![Text](URL)
Contoh:
![Illustration to use for new users](https://azurecomcdn.azureedge.net/cvt-779fa2985e70b1ef1c34d319b505f7b4417add09948df4c5b81db2a9bad966e5/images/page/services/devops/hero-images/index-hero.jpg)
Hasil:
Jalur ke file gambar dapat menjadi jalur relatif atau jalur absolut di Git atau TFVC, sama seperti jalur ke file Markdown lain dalam tautan.
- Jalur relatif:
![Image alt text](./image.png)
- Jalur absolut di Git:
![Image alt text](/media/markdown-guidance/image.png)
- Jalur absolut di TFVC:
![Image alt text]($/project/folder/media/markdown-guidance/image.png)
- Mengubah ukuran gambar:
IMAGE_URL =WIDTHxHEIGHT
Catatan
Pastikan untuk menyertakan spasi sebelum tanda sama dengan.
- Contoh:
![Image alt text]($/project/folder/media/markdown-guidance/image.png =500x250)
- Dimungkinkan juga untuk menentukan hanya LEBAR dengan meninggalkan nilai TINGGI:
IMAGE_URL =WIDTHx
- Contoh:
Daftar periksa atau daftar tugas
Daftar tugas ringan adalah cara yang bagus untuk melacak kemajuan pada tugas Anda sebagai pembuat permintaan pull atau peninjau di deskripsi PR atau di halaman wiki. Pilih toolbar Markdown untuk memulai atau menerapkan format ke teks yang dipilih.
Gunakan [ ]
atau [x]
untuk mendukung daftar periksa. Awali daftar periksa dengan atau -<space>
1.<space>
(angka apa pun).
Contoh - Terapkan daftar tugas Markdown ke daftar yang disorot
Untuk menandai item sebagai selesai dengan mencentang kotak, Anda perlu mengedit markdown secara manual dan mengubah sintaks setelah menambahkan daftar tugas.
Contoh - Memformat daftar sebagai daftar tugas
- [ ] A - [ ] B - [ ] C - [x] A - [x] B - [x] C
Hasil:
Catatan
Daftar periksa dalam sel tabel tidak didukung.
Emoji
Di komentar permintaan pull dan halaman wiki, Anda dapat menggunakan emoji untuk menambahkan karakter dan bereaksi terhadap komentar dalam permintaan. Masukkan apa yang Anda rasakan dikelilingi oleh :
karakter untuk mendapatkan emoji yang cocok dalam teks Anda. Kami mendukung sebagian besar emoji.
Contoh:
:smile: :angry:
Hasil:
Untuk menghindari emoji, sertakan menggunakan karakter '.
Contoh:
`:smile:` `:)` `:angry:`
Hasil:
:smile:
:)
:angry:
Mengabaikan atau menghindari sintaks Markdown untuk memasukkan karakter tertentu atau harfiah
Sintaksis
Contoh/catatan
Untuk menyisipkan salah satu karakter berikut, awalan dengan \
(garis miring terbalik).
\
Backslash
`
, backtick
_
Menekankan
{}
, kurung kurawal
[]
, tanda kurung siku
()
Tanda kurung
#
, tanda hash
+
, plus tanda -
, tanda minus (tanda hubung) .
, titik
!
, tanda *
seru , tanda bintang
Beberapa contoh tentang menyisipkan karakter khusus:
Masukkan \\
untuk mendapatkan \
Masukkan \_
untuk mendapatkan _
Masukkan \#
untuk mendapatkan #
Masukkan \(
untuk mendapatkan ( Enter \.
untuk mendapatkan .
Masukkan \!
untuk mendapatkan!
Masukkan \*
untuk mendapatkan *
Lampiran
Dalam komentar permintaan pull dan halaman wiki, Anda dapat melampirkan file untuk mengilustrasikan poin Anda atau untuk memberikan penalaran yang lebih rinci di balik saran Anda. Untuk melampirkan file, seret dan letakkan ke bidang komentar, atau pengalaman edit halaman wiki. Anda juga dapat memilih penjepit kertas di kanan atas kotak komentar atau dari panel format di halaman wiki Anda.
Jika Anda memiliki gambar di clipboard, Anda dapat menempelkannya ke dalam kotak komentar atau halaman wiki, dan gambar tersebut dirender langsung ke halaman komentar atau wiki Anda.
Melampirkan file nonimage membuat tautan ke file di komentar Anda. Untuk mengubah teks yang ditampilkan di tautan, perbarui teks deskripsi di antara tanda kurung siku. File gambar terlampir dirender langsung ke halaman komentar atau wiki Anda. Simpan atau perbarui halaman komentar atau wiki Anda dengan lampiran. Kemudian, Anda dapat melihat gambar terlampir dan memilih tautan untuk mengunduh file terlampir.
Lampiran mendukung format file berikut:
Jenis | Format file |
---|---|
Kode | CS (.cs), Extensible Markup Language (.xml), JavaScript Object Notation (.json), Hypertext Markup Language(.html, .htm), Layer (.lyr), Windows PowerShell script (.ps1), Roshal Archive (.rar), Remote Desktop Connection (.rdp), Bahasa Permintaan Terstruktur (.sql) - Catatan: Lampiran kode tidak diizinkan dalam komentar PR |
File terkompresi | ZIP (.zip) dan GZIP (.gz) |
Dokumen | Markdown (.md), Pesan Microsoft Office (.msg), Microsoft Project (.mpp), Word (.doc dan .docx), Excel (.xls, .xlsx dan .csv), dan Powerpoint (.ppt dan .pptx), file teks (.txt), dan PDF (.pdf) |
Gambar | PNG (.png), GIF (.gif), JPEG (baik .jpeg maupun .jpg), Ikon (.ico) |
Visio | VSD (.vsd dan .vsdx) |
Video | MOV (.mov), MP4 (.mp4) |
Catatan
Tidak semua format file didukung dalam permintaan pull, seperti file Pesan Microsoft Office (.msg).
Notasi dan karakter matematika
Kami mendukung notasi KaTeX sebaris dan blokir di halaman wiki dan permintaan pull. Lihat elemen yang didukung berikut ini:
- Simbol
- Huruf Yunani
- Operator matematika
- Kekuatan dan indeks
- Pecahan dan binomial
- Elemen lain yang didukung KaTeX
Untuk menyertakan notasi matematika mengelilingi notasi matematika dengan $
tanda untuk sebaris dan $$
untuk blok, seperti yang ditunjukkan dalam contoh berikut:
Contoh: Karakter Yunani
$
\alpha, \beta, \gamma, \delta, \epsilon, \zeta, \eta, \theta, \kappa, \lambda, \mu, \nu, \omicron, \pi, \rho, \sigma, \tau, \upsilon, \phi, ...
$
$\Gamma, \Delta, \Theta, \Lambda, \Xi, \Pi, \Sigma, \Upsilon, \Phi, \Psi, \Omega$
Hasil:
Contoh: Notasi aljabar
Area of a circle is $\pi r^2$
And, the area of a triangle is:
$$
A_{triangle}=\frac{1}{2}({b}\cdot{h})
$$
Hasil:
Contoh: Jumlah dan Integral
$$
\sum_{i=1}^{10} t_i
$$
$$
\int_0^\infty \mathrm{e}^{-x}\,\mathrm{d}x
$$
Hasil:
Menggunakan Markdown di wiki
Panduan berikut menunjukkan sintaks Markdown untuk digunakan di wiki Azure DevOps.
Menambahkan diagram Mermaid ke halaman wiki
Mermaid memungkinkan Anda membuat diagram dan visualisasi menggunakan teks dan kode.
Catatan
- Tidak semua sintaks dalam konten tertaut berikut untuk jenis diagram berfungsi di Azure DevOps. Misalnya, kami tidak mendukung sebagian besar tag HTML, Font Awesome,
flowchart
sintaks (graph
digunakan sebagai gantinya), atau LongArrow---->
. - Mermaid tidak didukung di browser Internet Explorer.
- Jika Anda mengalami "Jenis diagram yang tidak didukung", fungsionalitas mungkin belum tersedia di organisasi Anda karena skema penyebaran biasa.
Wiki mendukung jenis diagram Mermaid berikut:
- Diagram urutan
- Bagan Gantt
- Diagram alur
- Diagram kelas
- Diagram status
- Perjalanan Pengguna
- Bagan pai
- Diagram persyaratan
Untuk informasi selengkapnya, lihat catatan rilis Mermaid dan permintaan aktif di Komunitas Pengembang.
Untuk menambahkan diagram Mermaid ke halaman wiki, gunakan sintaks berikut:
::: mermaid
<mermaid diagram syntax>
:::
Contoh diagram urutan
Diagram urutan adalah diagram interaksi yang menunjukkan bagaimana proses beroperasi satu sama lain dan dalam urutan mana.
::: mermaid
sequenceDiagram
Christie->>Josh: Hello Josh, how are you?
Josh-->>Christie: Great!
Christie->>Josh: See you later!
:::
Contoh bagan Gantt
Bagan Gantt merekam setiap tugas terjadwal sebagai satu bilah berkelanjutan yang meluas dari kiri ke kanan. Sumbu x
mewakili waktu dan y
merekam tugas yang berbeda dan urutan penyelesaiannya.
Saat Anda mengecualikan tanggal, hari, atau kumpulan tanggal khusus untuk tugas, bagan Gantt mengakomodasi perubahan tersebut dengan memperpanjang jumlah hari yang sama ke kanan, bukan dengan membuat celah di dalam tugas.
::: mermaid
gantt
title A Gantt chart
dateFormat YYYY-MM-DD
excludes 2022-03-16,2022-03-18,2022-03-19
section Section
A task :a1, 2022-03-07, 7d
Another task :after a1 , 5d
:::
Contoh diagram alur
Diagram alur terdiri dari simpul, bentuk dan tepi geometris, serta panah atau garis.
Contoh berikut menunjukkan diagram alur menggunakan graph
daripada flowchart
.
Catatan
Kami tidak mendukung ---->
atau flowchart
sintaksis, atau tautan ke dan dari subgraph
.
:::mermaid
graph LR;
A[Hard edge] -->|Link text| B(Round edge) --> C{Decision}
C -->|One| D[Result one]
C -->|Two| E[Result two]
:::
Contoh diagram kelas
Diagram kelas adalah bagian utama dari pemodelan berorientasi objek. Diagram ini menjelaskan objek, atribut, metode, dan warisan di antara mereka.
:::mermaid
classDiagram
Creature <|-- Superman
Creature <|-- Vampire
Creature <|-- Diavolo
Creature: +int size
Creature: +int weight
Creature: +isBenign()
Creature: +power()
class Superman{
+String currentName
+fly()
+heal()
}
class Vampire{
-int age
-canBite()
}
class Diavolo{
+bool is_serving
+heat()
}
:::
Contoh diagram status
Diagram status digunakan untuk menjelaskan bagaimana status sistem dapat berubah dari satu ke yang lain.
:::mermaid
stateDiagram-v2
[*] --> Active
state Active {
[*] --> NumLockOff
NumLockOff --> NumLockOn : EvNumLockPressed
NumLockOn --> NumLockOff : EvNumLockPressed
--
[*] --> CapsLockOff
CapsLockOff --> CapsLockOn : EvCapsLockPressed
CapsLockOn --> CapsLockOff : EvCapsLockPressed
--
[*] --> ScrollLockOff
ScrollLockOff --> ScrollLockOn : EvScrollLockPressed
ScrollLockOn --> ScrollLockOff : EvScrollLockPressed
}
:::
Contoh perjalanan pengguna
Diagram perjalanan pengguna menjelaskan langkah-langkah apa yang diperlukan untuk menyelesaikan tindakan atau tugas tingkat tertentu yang lebih tinggi.
:::mermaid
journey
title Home office day
section Go to work
Wake up: 1: Me, Dog
Take shower: 2: Me
Go downstairs: 3: Me, Dog
Make coffee: 4: Me
Have a breakfast: 5: Me, Dog
Go upstairs: 3: Me, Dog
Do work: 1: Me, Dog
section Go home
Go downstairs: 3: Me, Dog
Sit down: 5: Me
:::
Contoh bagan pai
Diagram bagan pai digunakan untuk memvisualisasikan persentase dalam grafik yang dilingkari.
:::mermaid
pie title Fishermans in countries
"Norway" : 684
"Sweeden" : 234
"Switzerland" : 10
:::
Contoh diagram persyaratan
Diagram persyaratan memvisualisasikan persyaratan dan koneksinya.
:::mermaid
requirementDiagram
requirement development_req {
id: 1
text: requirements spec.
risk: medium
verifymethod: test
}
element test_suite {
type: manual test
}
test_suite - verifies -> development_req
:::
Membuat daftar isi (TOC) untuk halaman wiki
Untuk membuat daftar isi, tambahkan [[_TOC_]]. TOC dihasilkan ketika tag ditambahkan dan setidaknya ada satu judul di halaman.
[[_TOC_]] dapat ditempatkan di mana saja di halaman untuk merender daftar isi. Hanya judul Markdown yang dipertimbangkan untuk TOC (tag judul HTML tidak dipertimbangkan).
Semua tag HTML dan Markdown dilucuti dari judul sambil menambahkannya di dalam blok TOC. Lihat contoh berikut tentang bagaimana TOC dirender saat Anda menambahkan tebal dan miring ke judul.
Konsistensi dipertahankan dalam pemformatan TOC.
Catatan
Tag [[_TOC_]] peka huruf besar/kecil. Misalnya, [[_toc_]] mungkin tidak merender TOC. Selain itu, hanya instans pertama [[_TOC_]] yang dirender dan sisanya diabaikan.
Menambahkan tabel sub-halaman
Tambahkan daftar isi untuk sub-halaman (TOSP) ke halaman wiki Anda. Tabel ini memiliki tautan ke semua sub-halaman yang terletak di bawah halaman tempat tabel sub halaman ditampilkan.
Anda dapat menambahkan tabel sub-halaman baik dengan menyisipkan tag [[_TOSP_]]
khusus secara manual atau dengan memilih dari menu Opsi lainnya. Hanya tag pertama [[_TOSP_]]
yang digunakan untuk membuat tabel sub-halaman.
Menambahkan bagian yang dapat diciutkan
Untuk menambahkan bagian yang dapat diciutkan di halaman wiki, gunakan sintaks berikut:
# A collapsible section with markdown
<details>
<summary>Click to expand!</summary>
## Heading
1. A numbered
2. list
* With some
* Sub bullets
</details>
Pastikan untuk menambahkan baris kosong di area berikut:
- Setelah tag penutup
</summary>
, jika tidak, blok markdown/kode tidak ditampilkan dengan benar - Setelah tag penutup
</details>
jika Anda memiliki beberapa bagian yang dapat diciutkan
Menyematkan video di halaman wiki
Untuk menyematkan video dari YouTube dan Microsoft Streams di halaman wiki, gunakan sintaks berikut:
::: video
<iframe width="640" height="360" src="https://www.youtube.com/embed/OtqFyBA6Dbk" allowfullscreen style="border:none"><iframe>
:::
Iframe sesuai dengan blok iframe penyematan video YouTube atau Microsoft Streams.
Akhiran ":::" diperlukan untuk mencegah jeda di halaman.
Menyematkan hasil kueri Azure Boards di wiki
Untuk menyematkan hasil kueri Azure Boards di halaman wiki sebagai tabel, gunakan sintaks berikut:
::: query-table <queryid>
:::
Contohnya:
::: query-table 6ff7777e-8ca5-4f04-a7f6-9e63737dddf7 :::
Anda juga bisa menggunakan toolbar dan pemilih kueri untuk menyematkan hasil kueri di halaman wiki.
Untuk informasi selengkapnya tentang cara menyalin URL kueri, yang menyediakan GUID untuk kueri, lihat Mengirim email item kueri atau berbagi URL kueri.
@mention pengguna dan g
Untuk @mention pengguna atau grup di wiki, kunci di "@" di editor wiki. Ini @mention membuka autosuggest tempat Anda dapat menyebutkan pengguna atau grup untuk mendapatkan pemberitahuan melalui email.
Anda juga dapat memilih @mention dari toolbar edit.
Saat Anda mengedit halaman langsung dalam kode, gunakan pola berikut, @<{identity-guid}>
.
Lihat kunjungan halaman untuk halaman wiki
Secara otomatis, Anda melihat jumlah agregat kunjungan halaman selama 30 hari terakhir di setiap halaman. Kami mendefinisikan kunjungan halaman sebagai tampilan halaman oleh pengguna tertentu dalam interval 15 menit.
Gunakan API pagesBatch
batch untuk melihat jumlah kunjungan harian ke semua halaman dengan cara yang dipaginasi. Namun, mereka tidak diurutkan berdasarkan jumlah kunjungan. Untuk data yang berusia lebih dari 30 hari, Anda bisa mendapatkan semua kunjungan halaman menggunakan REST API. Urutkan halaman ini berdasarkan jumlah kunjungan untuk mendapatkan 100 teratas. Anda dapat menyimpan kunjungan ini di dasbor atau database.
Menautkan ke item kerja dari halaman wiki
Masukkan tanda pound (#
), lalu masukkan ID item kerja.
Menggunakan tag HTML di halaman wiki
Di halaman wiki, Anda juga dapat membuat konten kaya menggunakan tag HTML.
Tip
Anda dapat menumpuk Markdown dalam HTML, tetapi Anda harus menyertakan baris kosong antara elemen HTML dan markdown.
<p>
[A Markdown link](https://microsoft.com)
</p>
Catatan
Menempelkan konten kaya karena HTML didukung di Azure DevOps Server 2019.1 dan versi yang lebih baru.
Contoh - Video yang disematkan
<video src="path of the video file" width=400 controls>
</video>
<video src="https://sec.ch9.ms/ch9/7247/7c8ddc1a-348b-4ba9-ab61-51fded6e7247/vstswiki_high.mp4" width=400 controls>
</video>
Contoh - Format teks kaya
<p>This text needs to <del>strikethrough</del> <ins>since it is redundant</ins>!</p>
<p><tt>This text is teletype text.</tt></p>
<font color="blue">Colored text</font>
<center>This text is center-aligned.</center>
<p>This text contains <sup>superscript</sup> text.</p>
<p>This text contains <sub>subscript</sub> text.</p>
<p>The project status is <span style="color:green;font-weight:bold">GREEN</span> even though the bug count / developer may be in <span style="color:red;font-weight:bold">red.</span> - Capability of span
<p><small>Disclaimer: Wiki also supports showing small text</small></p>
<p><big>Bigger text</big></p>
Hasil: