Membuat blog dengan hugo 2

cara membuat blog dengan golang hugo part 2

Prima adi

3 minute read

Pengenalan

dalam part dua ini kita melanjutkan dari part 1 dimana kita sudah install hugo pada mesin kita masing masing. lets build a blog.

dalam kasus ini kita tidak akan membahas template . kita akan menggunakan tema yang sudah ada di themes.gohugo

buat site baru

masuk kedalam direktori kerja kita misalnya saya di ~/myhugo

silahkan masukan command

hugo new site test.dev

akan menghasilkan

→ hugo new site test.dev
Congratulations! Your new Hugo site is created in /Users/prima/work/golang/src/github.com/prima101112/myhugo/test.dev.

Just a few more steps and you're ready to go:

1. Download a theme into the same-named folder.
   Choose a theme from https://themes.gohugo.io/, or
   create your own with the "hugo new theme <THEMENAME>" command.
2. Perhaps you want to add some content. You can add single files
   with "hugo new <SECTIONNAME>/<FILENAME>.<FORMAT>".
3. Start the built-in live server via "hugo server".

Visit https://gohugo.io/ for quickstart guide and full documentation.

anda berhasil membuat kerangka blog dengan hugo. akan ada banyak folder dan konfigurasi pada folder test.dev yang sudah digenerate oleh hugo. sekarang saatnya download theme.

download theme

kali ini kita akan menggunakan hugo-nuo sebagai theme yang akan kita pake

  • masuk ke folder themes cd test.dev/themes
  • clone theme git clone https://github.com/laozhu/hugo-nuo

kita sebenarnya bisa langsung baca di readme yang ada di setiap theme dan biasanya theme menyediakan example site. folder exampleSite ini adalah contoh blog yang sudah dibuat oleh si pembuat tema dan kita tinggal copy file file di dalam exampleSite ke test.dev.

apa saja yang perlu di copy ke parrent folder.

  • config.toml
  • content
  • data

kita bisa langsung replace dari folder test.dev

  • cp themes/hugo-nuo/exampleSite/config.toml config.toml
  • cp -R themes/hugo-nuo/exampleSite/content/* content
  • cp -R themes/hugo-nuo/exampleSite/data/* data

sekarang seharusnya folder content dan data sudah ter isi

kegunaan file yang perlu di perhatikan :

  • config.toml : tempat menyimpan general config (settings)
  • content : letak dimana semua pages atau blog post
  • theme : letak menyimpan layout themes
  • data : menyimpan data seperti links atau yang lain seperti daftar peserta yang berbentuk json

run hugo server

hugo mempunyai file listener sekaligus server namanya hugo server. command ini render semua pages dan akan update jika ada perubahan pada file.

→ hugo server
Started building sites ...

Built site for language en:
0 draft content
0 future content
0 expired content
7 regular pages created
24 other pages created
8 non-page files copied
10 paginator pages created
8 tags created
0 categories created
total in 93 ms
Watching for changes in /Users/prima/work/golang/src/github.com/prima101112/myhugo/test.dev/{data,content,layouts,static,themes}
Serving pages from memory
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

sekarang silahkan buka pada localhost:1313 dan walahh . . blog kita sudah jadi.

membuat content blog

sebenarnya ini sangat mudah. kita tinggal membuat file baru di bawah folder content/post.

  • cd content/post
  • cp creating-a-new-theme.md first-blog.md copy dari sample dan sekarang edit file tersebut

folder post tidak wajib . tergantung fasilitas dari theme yang kita pakai

run hugo server lagi

dan walah postingan pertama kita berhasil install hugo

comments powered by Disqus