Penggunaan Gambar dan Link dalam Artikel

Gambar dan link atau hyperlink dalam sebuah postingan blog atau artikel adalah hal yang paling umum kita jumpai. Dan kali ini kita akan membahas hal tersebut, terutama terkait dengan cara penulisannya pada dokumen markdown yang akan kita gunakan seterusnya setiap penulisan artikel dan posting blog.

Sebuah link dalam suatu website setidaknya memiliki dua komponen, yaitu caption yang berupa teks yang terbaca dan ditampilkan secara langsung dalam dokumen, serta anchor yang merupakan alamat atau URL yang merujuk ke suatu resource di internet. Bisa berupa halaman lain, gambar, file atau apapun yang bisa diakses melalui internet. Misalnya :

Jika anda klik link ini, maka akan menuju ke alamat website Sourabaya In Frame.

Pada tulisan link diatas jika di klik, maka akan menuju ke alamat website https://sif.my.id. Dan cara penulisannya dalam dokumen markdown adalah seperti berikut :

[link](https://sif.my.id)

Nah, itu tadi adalah cara penulisan link dalam sebuah dokumen markdown, mudah sekali bukan?.. bukan!!

Baiklah, sekarang kita beralih membahas tentang cara mencantumkan gambar. Kali ini agak sedikit berbeda, karena fungsi yang kita gunakan ini merupakan sebuah macro yang dimiliki oleh Zola, Static Site Genarator yang kita gunakan ini.

Untuk mencantumkan sebuah gambar, gunakan kode macro img(). Lebih jelasnya perhatikan contoh berikut :

Keterangan : Foto diatas adalah sejenis kadal, atau lebih tepatnya biasa disebut dengan skink. spesies ini terkenal dengan keahliannya ber-kamuflase dan menyembunyikan dirinya dari incaran pemangsa atau predator.

Nah, dibawah ini adalah screen capture source code dari dokumen ini yang menghasilkan tampilan gambar dan caption seperti diatas. Terdapat beberapa parameter yang bisa kita cantumkan ketika ingin menampilkan gambar menggunakan macro img(). Yang pertama dan wajib ada yaitu parameter path=“lokasi/nama file”. Sedangkan parameter kedua yaitu caption=“”, merupakan teks yang akan ditampilkan dibagian bawah gambar, parameter ini bisa ada atau tidak. Begitu juga dengan parameter ketiga yaitu alt=“”

Semoga cukup mudah dipahami ya.. karena memang memahami itu terkadang sulit.

by: @adymulianto