Apa itu Front Matter di Hugo

Front Matter adalah data-data yang tersimpan untuk konten kita yang berisi informasi meta dari file tersebut. Isinya bisa apa saja, sebagai contoh unt...

cover Apa itu Front Matter di Hugo

Front Matter adalah data-data yang tersimpan untuk konten kita yang berisi informasi meta dari file tersebut. Isinya bisa apa saja, sebagai contoh untuk memberi judul, tanggal dan apakah postingannya ingin dalam draft atau dipublish langsung. Tapi tidak terbatas di ketiga hal tersebut saja.

Contoh Front Matter di Hugo

Kalau kamu sudah pernah membuat postingan di Hugo, berarti kamu sudah pernah melihat front matter ini

---
title: "Post Pertama"
date: 2020-08-15T09:44:10+08:00
draft: false
---

Front matter berisi pasangan key dan value untuk nilai yang kita deklarasikan.

Format Front Matter

Ada 3 pilhan dalam penulisan front matter, TOML, YAML dan JSON.

TOML

ditandai dengan pembuka dan penutup +++

YAML

ditandai dengan pembuka dan penutup ---

*contoh di atas adalah contoh YAML

JSON

dibungkus dengan kurung pembuka dan penutup { .. }

Meskipun mungkin JSON lebih akrab kita temukan, namun dalam pembuatan konten penggunaan TOML atau YAML lebih nyaman untuk dilihat.

Apa saja isi Front Matter

Pada dasarnya kita bisa memasukkan apa saja yang kita inginkan di front matter, seperti memasang kategori atau mau ada thumbnail gambar dan informasi lainnya.

Tapi, ada beberapa "key" atau variable yang sudah di"booking" sebelumnya oleh Hugo. seperti

aliases

Link url alias / lain untuk konten yang sama

date

untuk informasi waktu

description

meta description pada SEO

draft

Apakah ingin dipublish atau tidak

dan masih banyak lagi, bisa kamu lihat di dokumentasi front matter Hugo

Custom key di front matter

Untuk menggunakan salah satu custom variable yang kita buat sendiri, bisa menggunakan .Params.namaKeynya

sebagai contoh kalau kita punya thumbnail atau featured image,

featured_image : "linkgambar.png"

cara mengeluarkannya nanti

{{.Params.featured_image }}

Untuk melakukan logika apakah kontent tersebut punya atau tidak featured imagenya

{{if isset .Params "featured_image"}} {{.Params.featured_image }} {{end}}

Cara membuat default Front Matter

Kita pernah belajar dengan menggunakan hugo new blog/namakonten.md kita akan membuat file dengan beberapa info meta di front matternya. Bagaimana cara mengganti isi front matter default ini?

Kamu bisa mengganti isi folder /archetypes/default.md dan memasukkan default front-matter yang kamu mau.

Atau kalau kamu menggunakan "tema", makan masukkan di dalam tema tersebut, dan hapus file default archetypes yang ada di root.

meta: cara menambahkan featured image di Hugo, memberi custom variable di Hugo dan mengeluarkannya



avatar hilmanski
@hilmanski

2670 Kontribusi 2132 Poin

Diperbarui 3 tahun yang lalu

Bagian dari artikel seri

Belum ada Jawaban. Jadi yang pertama Jawaban

Login untuk ikut Jawaban