- \n
- Sistem yang menjalankan sistem Ubuntu 18.04.<\/li>\n
- Memiliki IP yang menunjuk ke server<\/li>\n
- Masuk sebagai user non-root dengan hak sudo.<\/a><\/li>\n<\/ul>\n
Sebelum Mulai<\/h2>\n
Perbarui paket sistem operasi Anda (software). Ini adalah langkah pertama yang penting karena memastikan Anda memiliki pembaruan terbaru dan perbaikan keamanan untuk paket perangkat lunak default sistem operasi Anda:<\/p>\n
sudo apt update && sudo apt upgrade -y<\/pre>\n
Setelah server diperbarui, restart sistem Anda untuk menerapkan semua perubahan<\/p>\n
Install Hugo<\/h2>\n
Secara default, versi terbaru Hugo tidak tersedia di repositori default Ubuntu 18.04. Jadi, Anda perlu mengunduhnya dari repositori Git. Anda dapat mengunduhnya dengan perintah
wget<\/code> <\/a>seperti berikut:<\/p>\nwget https:\/\/github.com\/gohugoio\/hugo\/releases\/download\/v0.58.2\/hugo_0.58.2_Linux-64bit.deb<\/code><\/pre>\nSetelah download selesai, install Hugo dengan perintah
dpkg<\/code> <\/a>berikut:<\/p>\ndpkg -i hugo_0.58.2_Linux-64bit.deb<\/code><\/pre>\nJika Anda mendapatkan dependency error<\/em> maka jalankan perintah berikut untuk menyelesaikan dependensi:<\/p>\n
apt-get install -f<\/code><\/pre>\nSelanjutnya, Anda dapat memeriksa versi Hugo dengan perintah berikut:<\/p>\n
hugo version<\/code><\/pre>\nAnda akan mendapatkan output kurang lebih seperti :<\/p>\n
Hugo Static Site Generator v0.58.2-253E5FDC linux\/amd64 BuildDate: 2019-09-13T08:05:59Z \n<\/pre>\n
Anda juga dapat melihat daftar opsi yang tersedia dengan Hugo dengan menjalankan perintah berikut:<\/p>\n
hugo --help<\/code><\/pre>\noutput :<\/p>\n
hugo is the main command, used to build your Hugo site. \n \nHugo is a Fast and Flexible Static Site Generator \nbuilt with love by spf13 and friends in Go. \n \nComplete documentation is available at http:\/\/gohugo.io\/. \n \nUsage: \n hugo [flags] \n hugo [command] \n \nAvailable Commands: \n config Print the site configuration \n convert Convert your content to different formats \n deploy Deploy your site to a Cloud provider. \n env Print Hugo version and environment info \n gen A collection of several useful generators. \n help Help about any command \n import Import your site from others. \n list Listing out various types of content \n mod Various Hugo Modules helpers. \n new Create new content for your site \n server A high performance webserver \n version Print the version number of Hugo \n \nFlags: \n -b, --baseURL string hostname (and path) to the root, e.g. http:\/\/spf13.com\/ \n -D, --buildDrafts include content marked as draft \n -E, --buildExpiredinclude expired content \n -F, --buildFuture include content with publishdate in the future \n --cacheDir string filesystem path to cache directory. Defaults: $TMPDIR\/hugo_cache\/ \n --cleanDestinationDir remove files from destination not found in static directories \n --config string config file (default is path\/config.yaml|json|toml) \n --configDir string config dir (default \"config\") \n -c, --contentDir string filesystem path to content directory \n --debug debug output \n -d, --destination string filesystem path to write files to \n --disableKinds strings disable different kind of pages (home, RSS etc.) \n --enableGitInfo add Git revision, date and author info to the pages \n -e, --environment string build environment \n --forceSyncStatic copy all files when static is changed. \n --gc enable to run some cleanup tasks (remove unused cache files) after the build \n -h, --help help for hugo \n --i18n-warnings print missing translations \n --ignoreCache ignores the cache directory \n --ignoreVendorignores any _vendor directory \n -l, --layoutDir string filesystem path to layout directory \n --log enable Logging \n --logFile string log File path (if set, logging enabled automatically) \n --minify minify any supported output format (HTML, XML etc.) \n --noChmod don't sync permission mode of files \n --noTimes don't sync modification time of files \n --path-warnings print warnings on duplicate target paths etc. \n --quiet build in quiet mode \n --renderToMemory render to memory (only useful for benchmark testing) \n -s, --source string filesystem path to read files relative from \n --templateMetrics display metrics about template executions \n --templateMetricsHints calculate some improvement hints when combined with --templateMetrics \n -t, --theme strings themes to use (located in \/themes\/THEMENAME\/) \n --themesDir string filesystem path to themes directory \n --trace file write trace to file (not useful in general) \n -v, --verbose verbose output \n --verboseLog verbose logging \n -w, --watch watch filesystem for changes and recreate as needed \n \n<\/pre>\n
Setelah selesai, Anda dapat melanjutkan ke langkah berikutnya.<\/p>\n
Membuat Website dengan Hugo<\/h2>\n
Hugo sekarang terinstal, saatnya untuk membuat situs web dan konten dengan Hugo.<\/p>\n
Anda dapat membuat situs web baru bernama
test.example.com<\/code> dengan menjalankan perintah berikut:<\/p>\nhugo new site test.example.com<\/code><\/pre>\nSetelah situs web berhasil dibuat, Anda akan mendapatkan hasil berikut:<\/p>\n
Congratulations! Your new Hugo site is created in \/root\/test.example.com. \n \nJust a few more steps and you're ready to go: \n \n1. Download a theme into the same-named folder. \n Choose a theme from https:\/\/themes.gohugo.io\/, or \n create your own with the \"hugo new theme \" command. \n2. Perhaps you want to add some content. You can add single files \n with \"hugo new \/.\". \n3. Start the built-in live server via \"hugo server\". \n \nVisit https:\/\/gohugo.io\/ for quickstart guide and full documentation. \n<\/pre>\n
Anda juga dapat membuat daftar semua file yang dibuat di bawah situs web Anda dengan perintah berikut:<\/p>\n
ls test.example.com\/<\/code><\/pre>\nAnda akan melihat output berikut:<\/p>\n
archetypes config.toml content data layouts static themes \n<\/pre>\n
Buat halaman About dan Postingan<\/h2>\n
Sekarang, ubah direktori<\/a> ke situs web Anda dan buat halaman
about.md<\/code> dengan perintah berikut:<\/p>\ncd test.example.com \n hugo new about.md<\/code><\/pre>\nAnda akan melihat output berikut:<\/p>\n
\/root\/test.example.com\/content\/about.md created \n<\/pre>\n
Selanjutnya, buka file
about.md<\/code> dan tambahkan beberapa konten:<\/p>\nnano content\/about.md<\/code><\/pre>\nBuat perubahan berikut:<\/p>\n
--- \ntitle: \"About\" \ndate: 2019-09-10T06:57:08Z \ndraft: false \n--- \n \nHalo, selamat datang di blog ini. \n<\/pre>\n
hugo new post\/first.md<\/code><\/pre>\nAnda akan melihat output berikut:<\/p>\n
\/root\/test.example.com\/content\/post\/first.md created \n<\/pre>\n
Kemudian, buat posting pertama Anda dengan perintah berikut:<\/p>\n
nano content\/post\/first.md<\/code><\/pre>\nAnda akan melihat output berikut:<\/p>\n
--- \ntitle: \"First\" \ndate: 2019-09-10T06:58:51Z \ndraft: false \n--- \n \n## Ini adalah postingan pertama \n \nPostingan pertama \n<\/pre>\n
Siapkan Tema Pertama Anda<\/h2>\n
Halaman About dan posting blog sekarang sudah dibuat, saatnya untuk mengatur tema pertama Anda.<\/p>\n
Pertama, ubah direktori menjadi
themes<\/code> dan unduh hugo-strata-theme dengan perintah berikut:<\/p>\ncd themes \n wget https:\/\/github.com\/digitalcraftsman\/hugo-strata-theme\/archive\/master.zip<\/code><\/pre>\nSetelah diunduh, ekstrak tema<\/a> yang diunduh dengan perintah berikut:<\/p>\n
unzip master.zip<\/code><\/pre>\nSelanjutnya, ganti nama tema yang diekstraksi dengan perintah
mv<\/code> <\/a>seperti yang ditunjukkan di bawah ini:<\/p>\nmv hugo-strata-theme-master hugo-strata-theme<\/code><\/pre>\nSelanjutnya, Anda perlu menyalin isi contoh file config.toml dari themes\/hugo-strata-theme ke file config.toml situs Anda yang terletak di \/root\/test.example.com\/config.toml.<\/p>\n
Anda dapat melakukannya dengan perintah berikut:<\/p>\n
cat hugo-strata-theme\/exampleSite\/config.toml > ..\/config.toml<\/code><\/pre>\nSelanjutnya, perbarui variabel
baseurl<\/code> dan sertakan halaman baru Anda ke dalam navigasi tema ini di fileconfig.toml<\/code> seperti yang ditunjukkan di bawah ini:<\/p>\nnano ..\/config.toml<\/code><\/pre>\nPerbarui base URL seperti yang ditunjukkan di bawah ini:<\/p>\n
baseurl = \"\/\" \n<\/pre>\n
Tambahkan juga baris berikut untuk memasukkan halaman baru tentang Anda:<\/p>\n
[[menu.main]] \n name = \"About\" \n url = \"about\" \n weight = 5 \n<\/pre>\n
Simpan dan tutup file setelah Anda selesai.<\/p>\n
Selanjutnya, Anda juga perlu memperbarui tata letak halaman arahan Anda dengan tata letak template tema yang terletak di themes\/hugo-strata-theme\/layouts\/index.html<\/strong> menjadi test.example.com\/layouts\/index.html<\/strong>:<\/p>\n
nano \/root\/test.example.com\/layouts\/index.html<\/code><\/pre>\nTambahkan konten berikut:<\/p>\n
{{ define \"main\" }} \n {{ if not .Site.Params.about.hide }} \n {{ partial \"about\" . }} \n {{ end }} \n \n {{ if not .Site.Params.portfolio.hide }} \n {{ partial \"portfolio\" . }} \n {{ end }} \n \n {{ if not .Site.Params.recentposts.hide }} \n {{ partial \"recent-posts\" . }} \n {{ end }} \n \n {{ if not .Site.Params.contact.hide }} \n {{ partial \"contact\" . }} \n {{ end }} \n{{ end }} \n<\/pre>\nSimpan dan tutup file setelah Anda selesai.<\/p>\n
Setelah selesai, Anda dapat melanjutkan ke langkah berikutnya.<\/p>\n
Bangun Situs Web Anda<\/h2>\n
Tema Anda sekarang dikonfigurasi untuk situs web. Saatnya membangun situs web Anda. Untuk melakukannya, ubah direktori ke situs web Anda dan buat situs dengan perintah berikut:<\/p>\n
cd \/root\/test.example.com \n hugo<\/code><\/pre>\nAnda akan melihat output :<\/p>\n
| EN \n+------------------+----+ \n Pages | 17 \n Paginator pages | 0 \n Non-page files | 0 \n Static files | 26 \n Processed images | 0 \n Aliases | 5 \n Sitemaps | 1 \n Cleaned | 0 \n \nTotal in 18 ms \n<\/pre>\n
Sekarang, start server Hugo Anda dan bind dengan alamat IP server Anda dengan menjalankan perintah berikut:<\/p>\n
hugo server --bind=0.0.0.0 --baseUrl=http:\/\/server-atau-domain -D -F<\/code><\/pre>\nSetelah server mulai berhasil, Anda akan melihat output berikut:<\/p>\n
| EN \n+------------------+----+ \n Pages | 17 \n Paginator pages | 0 \n Non-page files | 0 \n Static files | 26 \n Processed images | 0 \n Aliases | 5 \n Sitemaps | 1 \n Cleaned | 0 \n \nTotal in 28 ms \nWatching for changes in \/root\/test.example.com\/{content,data,layouts,static,themes} \nWatching for config changes in \/root\/test.example.com\/config.toml \nServing pages from memory \nRunning in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender \nWeb Server is available at http:\/\/example.com\/ (bind address 0.0.0.0) \nPress Ctrl+C to stop \n<\/pre>\nSetelah selesai, Anda dapat melanjutkan untuk mengakses web interface Hugo.<\/p>\n
Akses Server Hugo<\/h2>\n
Server Hugo sekarang mulai dan listen pada port 1313. Selanjutnya, buka web browser dan ketik URL http:\/\/example.com:1313. Anda akan diarahkan ke dasbor server Hugo Anda seperti yang ditunjukkan di bawah ini:<\/p>\n
![\"Halaman](\"https:\/\/www.linuxid.net\/assets\/media\/other\/33846\/Halaman-depan-Hugo-750x400.jpg\")
<\/a><\/p>\n