Pelajar TKJ Pengguna Linux

Belajar Jaringan Sambil Sharing Informasi Seputar Teknologi

Cara Buat Blog dengan Hugo

Riyan Firmansyah |

Cara Buat Blog dengan Hugo

Hai Sobat Inseptek, kali ini saya akan mengajarkan Cara Buat Blog Statis dengan Menggunakan SSG Hugo mulai dari Installasi, Konfigurasi, Menulis Artikel sampai Deploy ke GitHub. Kalian pasti sudah tau kan apa itu Blog ?

Blog pada dasarnya merupakan bagian dari situs wpebsite yang dapat diakses secara online yang memiliki fungsi utama memuat tulisan-tulisan dan gambar (dimuat dalam posting) pada setiap halaman web. Perlu diketahui Hugo merupakan SSG (Static Site Generator) yang sangat mudah dipahami dan Hugo dibuat menggunakan Bahasa GoLang.

Pastikan kalian memasang Hugo terlebih dahulu kalian dapat memasang Hugo pada Linux, Windows, dan Mac OS. Untuk proses Installasi kalian dapat menggunakan cara di bawah ini.

Linux

  • Snap Package
snap install hugo
  • Debian and Ubuntu
sudo apt-get install hugo
  • Arch Linux
sudo pacman -Sy hugo

Windows

  • Chocolatey
    Jika kalian pakai windows silahkan gunakan Chocolatey untuk manajemen paket dan jalankan perintah berikut.
choco install hugo -confirm

Mac OS

Jika kalian di MacOS dan menggunakan manajemen paket Homebrew jalankan perintah berikut.

brew install hugo

Setelah proses installasi selesai buat satu blog menggunakan Hugo dengan perintah berikut ini.

hugo new site <nama web>

Contoh saya akan membuat satu blog dengan nama imajinasi dengan menggunakan perintah ini.

hugo new site imajinasi

nah kalian akan menjumpai sebuah folder yang ada di lokasi perintah tadi dijalankan.

Lalu selanjutnya tentukan tema yang akan kita pakai. Kalian dapat mengunduh tema secara gratis di themes.gohugo.io atau kalian dapat membuatnya sendiri.

Ingat Kata Petani Kode. > “Baca dulu dokumentasi tema-nya, karena di sana ada konfigurasi yang harus diikuti agar temanya bisa digunakan sesuai harapan”

Contoh kita akan menggunakan tema Hugo Octopress.

Setelah itu kita masukkan folder Hugo-Octopress kedalam folder imajinasi/themes

lalu kembali ke folder awal imajinasi dan ubah isi file config.toml dengan config di bawah ini.

baseURL = "https://www.imajinasi.com/"
languageCode = "id-id"
title = "Imajinasi"
disablePathToLower = false

#themesDir = "themes"
theme = "Hugo-Octopress"


# Disqus shortcode
# Nonaktifkan komentar untuk beberapa halaman individu dengan menambahkan "comments: false" ke dalam frontmatternya
disqusShortname = "imajinasi"



# Banyaknya postingan yang ditampilkan di halaman paginasi paginate = 6

[permalinks]

# Konfigurasi URL Postingan 
post = "/:slug/"

# Buat tag dan kategori bekerja
[indexes]
    tag = "tags"
    category = "categories"

[params]

    # Jika salah, semua postingan blog akan muncul dalam halaman depan (dan di halaman paginasi) 
    truncate = true

    # Nama Penulis (muncul dalam meta tag dan di bawah postingan)
    author = "Riyan Firmansyah"

    # Tekd ini muncul di header situs di bawah judul website
    subtitle = "Blog Imajinasi Pelajar TKJ"

    # URL Mesin Pencari
    searchEngineURL = "https://www.google.com/search"

    # Teks dari label "Continue Reading" (dalam bahasa inggris), tapi itu akan kacau di dalam string sehingga ditambahkan ke index.html secara manual
    continueReadingText = "Baca selengkapnya..."

    # Google analytics code - hapus jika kalian tidak memiliki/menginginkannya - Google analitics butuh Javascript untuk berjalan 
    googleAnalytics = "UA-XXXXX-X"

  # Ganti ke true untuk mengaktifkan link RSS icon
    rss = true

  # Rubah ke true untuk menggunakan sebuah label teks untuk RSS bukan ikon
  # Ini ditimpa oleh settingan "rss"
  textrss = false

    # Deskripsi tetap Website
    defaultDescription = "Blog Imajinasi"

    # Isi ini dengan kata kunci yang anda tentukan - ini juga akan muncul dalam tag meta
    # defaultKeywords = ["keyword1" , "keyword2" , "keyword3" , "keyword4"]

  # Rubah ke true untuk menyembunyikan informasi tentang waktu membaca dalam postingan
  disableReadingTime = false

  # Rubah ke true untuk menonaktifkan proses download ke Google fonts
  disableGoogleFonts = false

Setelah itu coba jalankan server Hugo dengan menggunakan perintah berikut.

hugo server

Maka Hugo akan membuat suatu server baru yang beralamatkan di http://localhost:1313/ dan buka alamat tersebut!

Floooo!!!!
Berhasil….!

Kalian dapat menambah artikel dalam Hugo. Untuk Tutorial Menulis Artikel di Hugo kalian dapat Melihat di artikel selanjutnya.

Sekian Artikel kali ini semoga bermanfaat bagi kalian semua.