Situs demo | log perubahan
Yue adalah tema Hugo yang minimalis, multibahasa, dan dapat disesuaikan, cocok untuk blogging.
Tangkapan layar mungkin sudah usang, jadi lebih baik kunjungi situs demo.
Mode ringan di desktop
Mode gelap di desktop
Mode ringan di ponsel
Mode gelap di ponsel
Penampilan minim
Mudah dipasang (dengan Git dan Hugo terinstal, buat situs web dalam beberapa detik)
Dokumentasi terperinci
Mode gelap otomatis
Multibahasa
Daftar terjemahan dalam satu halaman
Pemilih bahasa (buka halaman atau beranda terkait)
Banyak penulis
Daftar Isi (dapat dilipat, hanya dibuat jika tersedia)
Tanggal modifikasi pada halaman beranda, halaman tunggal, halaman bagian, dan halaman istilah
Format tanggal khusus
Paginasi di halaman beranda dan halaman bagian
RSS teks lengkap
Tag dan kategori
Pemberitahuan hak cipta (penulis dan rentang tahun dapat diatur)
Tautan RSS
Tautan jangkar judul
Mobile-first dan responsif
SCSS
Optimasi mesin pencari
Mikrodata
deskripsi meta
Buka Grafik
Jumlah halaman menjadi beberapa bagian ( /posts/ , /tags/ , dll.)
Kustomisasi
favicon
Gaya (SCSS)
Isi (HTML)
Untuk mengetahui semua fitur, periksahugo.yaml (konfigurasi default) dan exampleSite/hugo.yaml (konfigurasi situs demo).
Instal Git dan Hugo terbaru yang diperluas.
# Buat situs webgit init situs web sayacd situs web saya# Instal submodul themegit tambahkan --kedalaman=1 https://github.com/CyrusYip/hugo-theme-yue theme/hugo-theme-yue git commit --message "tambahkan tema"# Buat konten democp --tema rekursif/hugo-theme-yue/exampleSite/* .# Pratinjauserver Hugo
Sekarang kami memiliki situs demo yang berfungsi. Direktori content berisi konten, hugo.yaml adalah file konfigurasi. Jangan ragu untuk bermain-main dengan mereka.
cd situs web saya pembaruan submodul git --remote
Disarankan untuk membaca CHANGELOG.md sebelum memperbarui tema.
Anda dapat berlangganan pembaruan dan log perubahan di agregator umpan (misalnya Inoreader).
Pembaruan: https://github.com/CyrusYip/hugo-theme-yue/commits/main.atom
Catatan Perubahan: https://github.com/CyrusYip/hugo-theme-yue/commits/main/CHANGELOG.md.atom
Anda perlu menggunakan opsi tambahan saat mengkloning proyek situs web Anda.
git clone --recurse-submodules --shallow-submodules [email protected]:nama-pengguna-Anda/situs-saya.git
Setelah menyiapkan situs web, Anda mungkin ingin menghostingnya di Internet. Ada banyak metode untuk melakukannya, lihat Hosting dan penerapan | Hugo. Jika Anda tidak tahu harus memilih apa, Anda bisa memulai dari Netlify, lihat Host di Netlify | Hugo.
Pastikan Anda mengubah baseURL ke nama domain Anda (misalnya https://my-cool-domain.org/ ) di hugo.yaml .
-baseURL: https://yue.cyrusyip.org/+baseURL: https://my-cool-domain.org/
Perintah build yang disarankan:
pelukan --gc --minify
--gc menghapus file cache yang tidak digunakan, dan --minify mengurangi ukuran situs web (terutama HTML).
Buat postingan baru.
hugo new content content/en/posts/my-first-post.md
Untuk mempelajari lebih lanjut tentang penggunaan, lihat:
Penggunaan dasar | Hugo
Struktur direktori | Hugo
Pengaturan tercantum di exampleSite/hugo.yaml (konfigurasi situs demo) danhugo.yaml (konfigurasi default, diimpor oleh yang sebelumnya).
Di root proyek situs web Anda, hugo.yaml adalah file konfigurasi, yang merupakan salinan dari exampleSite/hugo.yaml.
Untuk mempelajari konfigurasi, lihat Konfigurasi Hugo | Hugo.
Bahasa yang didukung:
en : Bahasa Inggris
fr : Perancis
zh-CN : Mandarin Sederhana
Untuk membuat situs web multibahasa, lihat Mode multibahasa | Hugo dan exampleSite/hugo.yaml.
File terjemahan terletak di direktori i18n dan data/i18n.yaml. Kontribusi untuk bahasa tambahan dipersilahkan.
Untuk berkontribusi dalam bahasa baru:
Buat file bahasa (misalnya, fr.yaml untuk bahasa Prancis) di direktori i18n.
Salin konten i18n/en.yaml ke file baru.
Hapus semua komentar ( # ... ) dan terjemahkan kontennya.
Terjemahkan juga konten di data/i18n.yaml.
Jika Anda ingin terus berkontribusi pada terjemahan, Anda bisa mendapatkan perubahan terbaru dengan berlangganan feed i18n/en.yaml (https://github.com/CyrusYip/hugo-theme-yue/commits/main/i18n/en.yaml .atom) menggunakan pembaca RSS.
Jika situs web Anda tidak dalam bahasa Inggris, Anda mungkin ingin menyesuaikan judul /tags dan /categories .
Misalnya, untuk menyesuaikan /tags judul situs web zh-CN , buat content/zh-CN/tags/_index.md dan tambahkan konten berikut ke dalam file.
--- title: Chinese Tags ---
Yue memungkinkan Anda menyesuaikan favicon, gaya (SCSS), dan konten (HTML).
Favicon adalah ikon di samping judul di tab browser. Untuk menggunakan favicon Anda, letakkan favicon.ico di bawah direktori static . Anda dapat membuat favicon.ico di generator favicon.ico online.
Yue menggunakan SCSS (libsass) untuk menambahkan gaya. Semua file ada dalam aset/scss. Untuk menyesuaikan gaya, buat assets/scss/_style-start.scss dan assets/scss/_style-end.scss .
_style-start.scss diterapkan terlebih dahulu, dan Anda dapat mengganti variabel dalam file ini.
$ukuran font dasar: 15px;
_style-end.scss diterapkan terakhir, dan Anda dapat menambahkan gaya di file ini.
Vanilla CSS juga valid di SCSS.
Referensi:
CSS: Lembar Gaya Berjenjang | MDN
Sass: Dasar-dasar Sass
Struktur direktori | Hugo
Anda dapat membuat file ini untuk memasukkan kode HTML.
layouts/partials/head/head-start.html
layouts/partials/head/head-end.html
layouts/partials/single/single-end.html
layouts/partials/body/body-end.html
head-start.html ditambahkan di dekat awal elemen <head> .
Kasus penggunaan:
Skrip pramuat
Memuat skrip
Memuat gaya
Berikut adalah contoh skrip pramuat:
<link rel="preload" as="script" href="https://unpkg.com/@swup/head-plugin@2"><link rel="preload" as="script" href="https: //unpkg.com/@swup/preload-plugin@3"><link rel="preload" as="script" href="https://unpkg.com/swup@4">
head-end.html ditambahkan ke akhir elemen <head> .
Kasus penggunaan:
Memuat skrip
Memuat gaya
Berikut ini contoh penambahan Google Analytics dan skrip lokal:
<!-- Google Analytics --><script async src="https://www.googletagmanager.com/gtag/js?id=G-F46B15BRUF"></script><script> window.dataLayer = window.dataLayer || []; fungsi gtag(){dataLayer.push(argumen);} gtag('js', Tanggal baru()); gtag('config', 'G-F46B15BRUF');</script><!-- Skrip lokal, jalur: aset/js/skrip-saya.js -->{{ dengan sumber daya.Dapatkan "js/skrip-saya .js" | js.Build }} <skrip defer src="{{ .RelPermalink }}"></script>{{ end }} single-end.html ditambahkan ke akhir elemen <main> dalam sebuah postingan.
Kasus penggunaan:
layanan komentar, misalnya Disqus dan giscus
Berikut ini contoh penambahan Giscus:
{{ $bahasa := "" }}
{{- /*
Solusi untuk LanguagePrefix huruf kecil,
lihat https://github.com/gohugoio/hugo/issues/9404
*/ -}}
{{ if eq site.LanguagePrefix "/zh-cn" }}
{{ $bahasa = "zh-CN" }}
{{ kalau tidak }}
{{ $bahasa = "en" }}
{{ end }}<script src="https://giscus.app/client.js" data-repo="CyrusYip/yue-test" data-repo-id="P_9hJMbXtqr" data-category="Umum" data -category-id="SIB_ldsflk712ldRsjf7" data-mapping="pathname" data-strict="0" data-reactions-enabled="1" data-emit-metadata="0" data-input-position="bawah" data-theme="preferred_color_scheme" data-lang="{{ $bahasa }}" crossorigin="anonymous" async></script>Daftar layanan komentar: Komentar | Hugo.
body-end.html ditambahkan ke akhir elemen <body> .
Kasus penggunaan:
Memuat skrip secara dinamis
Untuk melaporkan bug, kirimkan masalah. Untuk mengajukan pertanyaan, mulailah diskusi.
Hugo memiliki banyak fitur, baca Dokumentasi Hugo untuk mempelajarinya.
Lihat CHANGELOG.md.
Proyek ini menggunakanhugo-bin - npm untuk mengelola versi Hugo. Prasyarat: Node.js dan npm.
Kloning repositori ini.
instalasi npm npm jalankan bersih:server:dibagi
Ada perintah berguna lainnya yang tercantum di package.json. Untuk menggunakan versi Hugo yang direkomendasikan, jalankan npx hugo .
Jika Anda belum menginstal Node.js dan npm, cukup instal versi yang tercantum di package.json.
"hugo-bin": { "buildTags": "diperpanjang", "versi": "x.yyy.z"},CHANGELOG.md harus diperbarui di setiap komit.
Jika Anda menggunakan Yue dan kode sumber situs web Anda dihosting di GitHub, Anda dapat menambahkan topikhugo hugo-theme-yue ke repositori Anda.
Tautan ke topik hugo-theme-yue .
Saya telah belajar banyak dari banyak proyek. Terima kasih, pengembang.
hugo-xmin (templat minimal)
hugo-tema-jane (templat RSS)
hugo-theme-zen (pemilih bahasa)
Hugo-tema-gruvbox (warna)
kotak gruv (warna)
hugo-theme-stack (kode sumber, dokumentasi dan konfigurasi)
hugo-PaperMod (kode sumber, dokumentasi dan konfigurasi)
Proyek ini dilisensikan di bawah MIT.
