Quint adalah tema Hugo minimalis yang dirancang untuk membangkitkan nuansa bersih dan lapang, menekankan kejelasan dan kemudahan membaca. Ini menampilkan spanduk gambar built-in yang elegan dan desain yang ringan, membuatnya ideal untuk menampilkan panggung tengah konten Anda.
Lihat repositori situs demo, yang juga dapat Anda gunakan sebagai templat awal untuk situs baru. (Psst... ada tombol penerapan sekali klik ke Netlify di sana.)
Demo langsung di sini.
Desain Minimalis : Berfokus pada keterbacaan konten dengan gangguan minimal.
Mode Gelap dan Terang : Pergantian tema otomatis yang mengikuti pengaturan browser/perangkat pemirsa.
Tata Letak Responsif : Tampak hebat di perangkat seluler dan desktop.
Termasuk Spanduk Gambar : Dikirim dengan spanduk gambar minimalis yang indah yang mengatur suasana situs Anda. Ganti atau tambahkan milik Anda kapan saja.
Pencarian Situs : Pencarian bawaan di situs statis Anda menggunakan Lunr.js.
Ikon Sosial : Tautan yang dapat dikonfigurasi ke media sosial Anda di footer.
Untuk memulai Quint, Anda harus menginstal Hugo di mesin Anda. Untuk informasi lebih lanjut tentang menginstal Hugo, lihat dokumentasi resmi Hugo.
Untuk panduan langkah demi langkah dalam membuat situs baru dengan Hugo, baca Panduan mulai cepat.
Dengan Hugo terinstal, tambahkan Quint ke direktori tema situs Anda. Dari root situs Anda, jalankan:
git submodule tambahkan https://github.com/victoriadrake/hugo-theme-quint.git Themes/quint
Buka file konfigurasi situs Hugo Anda ( hugo.toml
, hugo.yaml
, hugo.json
) dan perbarui parameter theme
untuk menggunakan quint
:
hugo.toml
:tema = "quint"
hugo.yaml
:tema: "quint"
Quint tampak hebat di luar kotak. Secara opsional, salin nilai konfigurasi dari yoursite/themes/quint/hugo.toml
ke konfigurasi situs Anda ( yoursite/hugo.toml
) untuk mempersonalisasi Quint lebih lanjut.
Jalankan Hugo untuk membuat situs Anda dan memulai server. Dari root situs Anda, jalankan:
server besar
Navigasikan ke http://localhost:1313
di browser web Anda untuk melihat situs Anda beraksi dengan tema Quint.
Untuk mengunduh Quint versi terbaru, jalankan:
pembaruan submodul git --tema jarak jauh/quint
Quint dirancang agar mudah disesuaikan.
Tambahkan file CSS khusus Anda dengan mudah dengan menamainya di konfigurasi Hugo Anda:
[params]css = ["css/custom.css"] # CSS khusus Anda diganti, disimpan di situs Anda/statis/
Anda dapat mengganti tata letak apa pun menggunakan file dengan nama yang sama di direktori proyek Anda. Misalnya, file yoursite/layouts/partials/contact.html
akan menggantikan yoursite/themes/quint/layouts/partials/contact.html
.
Tambahkan atau hapus bagian dari halaman beranda dengan mengganti file yoursite/themes/quint/layouts/index.html
. Cukup buat salinan file ini di direktori proyek Anda ( yoursite/layouts/index.html
) dan hapus atau tambahkan partial
yang Anda inginkan.
Jika halaman atau postingan tidak menentukan image
di bagian depan, Quint akan menampilkan spanduk gambar yang indah dengan memilih gambar acak dari direktori themes/quint/static/images
.
Hal ini dilakukan dengan memilih nomor acak dari 1-10, yang sesuai dengan nama file gambar. Anda dapat menambah koleksi ini atau mengganti gambar apa pun yang Anda inginkan. Cukup perbarui nomor acak maksimum agar sesuai dengan jumlah gambar yang Anda miliki.
[params]numImages = 12 # Jumlah gambar acak yang dapat dipilih untuk spanduk (dalam tema/quint/statis/gambar)
Kontribusi untuk Quint dipersilakan! Jangan ragu untuk mengirimkan masalah atau menarik permintaan di GitHub untuk meningkatkan fungsionalitas atau dokumentasi tema.
Ingin beberapa ide untuk memulai? Berikut daftar singkat fitur yang ingin saya tambahkan:
Tombol penyalinan blok kode
Penyorotan sintaksis Chroma Hugo
Generator aset Hugo dengan pipeline, sidik jari, bundling, dan minifikasi
Dukungan multibahasa
Navigasi remah roti
Tema ini dirilis di bawah Lisensi MIT. Untuk lebih jelasnya, lihat file LISENSI.
Quint menggunakan Open Sauce Font yang luar biasa.
Maket perangkat dibuat dari deviceframes.com.