Membuat Blog Statis dengan Hugo Pada Windows 10 Untuk Pemula

site hugo

Tutorial ini mengajarkan tentang cara membuat blog statis menggunakan Hugo pada Windows 10. 

Ada banyak pilihan tema open-source untuk membuat blog dengan Hugo. Dalam tutorial ini, kita akan menggunakan tema Hulga.

Ini adalah langkah-langkah menginstall hugo dan menerapkan tema pada blog:

  1. Download installer Hugo extended untuk Windows di: https://github.com/gohugoio/hugo/releases . Pastikan untuk mendownload versi extended karena tema Hulga membutuhkan versi ini.
    download hugo extended di github
  2. Extract file .zip tadi ke C:\Hugo\bin , atau folder apapun yang Anda pilih.

  3. Tambahkan direktori hugo (misalnya C:\Hugo\bin) ke Path (ada di bagian System Environment pada setting Windows).
    menu system environment
  4. Buka command line, dan ketik command hugo version . Jika tidak ada pesan error, maka Anda sudah berhasil menginstall Hugo.
    cek versi hugo pada command line
    Hugo sudah sukses diinstall.
  5. Dalam direktori pilihan Anda, ketik command hugo new site mysite . Command ini akan membuat folder bernama mysite yang akan menjadi source blog Anda.

  6. Download .zip tema: https://github.com/wlh320/hugo-theme-hulga
    download zip
  7. Extract ke folder mysite/themes, dan ganti nama folder hugo-theme-hulga menjadi hulga
  8. Tambahkan theme = "hulga" ke file config.toml yang ada pada direktori mysite. Ini adalah contoh file config.toml sederhana: 
    baseURL = "https://example.com"
    languageCode = "id"
    title = "Site Hugo Baru"
    paginate = 10
    theme = "hulga"

    [params]
    subtitle = "Keterangan website."
    copyright = "Copyright © 2021"

    [menu]
    [[menu.main]]
    identifier = "index"
    name = "index"
    url = "/"
    weight = 1

    [taxonomies]
    category = "categories"
    tag = "tags"
  9. Buat folder bernama post di dalam folder mysite\content
  10. Buat file mypost.md di dalam  mysite\content\post
    Ini adalah contoh konten mypost.md sederhana:
    ---
    title: "Postingan Pertama"
    date: 2021-11-17T14:15:55+07:00
    draft: false
    categories: [development, publishing]
    tags: [hugo, static site generator]
    ---

    Postingan pertama.
  11. Kembali ke command line, masuk ke direktori mysite dengan mengetik cd mysite
  12. Aktifkan server dengan command hugo server.

  13. Buka blog anda di http://localhost:1313/
    site hugo
    Tampilan website.

Referensi:
https://www.freecodecamp.org/news/your-first-hugo-blog-a-practical-guide/
https://gohugo.io/getting-started/quick-start/
https://gohugo.io/getting-started/installing/
https://themes.gohugo.io/themes/hugo-theme-hulga/

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *