Bahasan kita hari ini masih berkaitan dengan bahasan kemarin. Kita akan sedikit mengulik cara menyisipkan tag / syntax html secara mudah pada editor teks VIM. Jika kemarin kita masih perlu menulis satu huruf lalu diubah menjadi tag html, sekarang kita bisa menyisipkan tag html secara langsung tergantung tag yang kita butuhkan.
Apa yang kita perlukan sebelumnya ?
Beberapa hal yang kita butuhkan di antaranya yaitu :
- Konfigurasi vim / nvim (vimrc / init.vim).
- Tag html yang kita perlukan.
Tag apa yang akan kita masukkan ?
Berikut ini adalah beberapa tag yang akan kita masukkan dalam konfigurasi VIM / Nvim. Bisa ditambahkan / dikembangkan sesuai kebutuhan masing-masing ya ?
- Paragraf beserta teks rata kanan dan kiri / justify.
- Teks tebal / bold.
- Teks miring / italic.
- Tautan / hyperlink.
- Jeda baris line break.
Konfigurasi VIM / Neovim.
Berikut ini adalah contoh konfigurasi VIM / Neovim yang saya gunakan.
Paragraf dengan teks rata kanan dan kiri.
inoremap <M-p> <div style="text-align:justify"><cr><p><cr></p><cr></div>Code language: HTML, XML (xml)Setelah konfigurasi ditambahkan, ketika kita menekan pintasan / shortcut Alt+p saat mode insert, rangka tag paragraf akan terbentuk beserta alignment rata kanan-kiri.
Teks tebal / bold.
inoremap <M-b> <b></b>Code language: HTML, XML (xml)Setelah konfigurasi ditambahkan, ketika kita menekan pintasan / shortcut Alt+b saat mode insert, rangka tag teks tebal / bold akan terbentuk.
Teks miring / italic.
inoremap <M-i> <i></i>Code language: HTML, XML (xml)Setelah konfigurasi ditambahkan, ketika kita menekan pintasan / shortcut Alt+i saat mode insert, rangka tag teks miring / italic akan terbentuk.
Tautan / hyperlink.
inoremap <M-u> <a href=""></a>Code language: HTML, XML (xml)Setelah konfigurasi ditambahkan, ketika kita menekan pintasan / shortcut Alt+u saat mode insert, rangka tag tautan / hyperlink akan terbentuk.
Jeda baris / line break.
inoremap <M-t> <br></br>Code language: HTML, XML (xml)Setelah konfigurasi ditambahkan, ketika kita menekan pintasan / shortcut Alt+t saat mode insert, tag jeda baris / line break akan terbentuk.
Demo penggunaan.
Berikut adalah demonstrasi sederhana penggunaan dari penyisipan / insert tag html pada teks editor VIM/Neovim. Pada demonstrasi kali ini, saya menggunakan Neovim pada distro slackware. Untuk distro lain bisa menyesuaikan.
Referensi dan kredit.
Berikut ini adalah referensi dan kredit untuk bahasan kita kali ini.
- Post pada laman superuser, tentang penyisipan atau insert beberapa teks secara otomatis pada VIM.
- Jawaban barlop tentang cara penyisipan atau insert beberapa teks secara otomatis pada VIM.
Penutup.
Demikian tadi cara menyisipkan beberapa tag html secara otomatis. Semoga bisa bermanfaat untuk teman-teman (utamanya untuk diri saya pribadi) yang sedang belajar menulis dengan html menggunakan VIM. Terima kasih dan sampai berjumpa pada bahasan selanjutnya !
Leave a Reply