Template Website Sekolah Bootstrap 5 Terang Kalem Responsif
Template website resmi sekolah berbahasa Indonesia yang dibangun dengan Bootstrap 5.3. Desainnya terang, lapang, dan ramah di mata. Struktur dan isinya disesuaikan dengan website sekolah pada umumnya di Indonesia: sambutan kepala sekolah, visi & misi, agenda, pengumuman, prestasi, galeri, hingga informasi SPMB (Sistem Penerimaan Murid Baru).
Warna: Palet terang dan kalem dengan kontras lembut: biru keabuan sebagai warna utama, aksen hijau sage dan pasir, di atas latar putih hangat. Nyaman di mata dan berkesan tenang.
Halaman yang tersedia:
- Beranda: info terkini (running text), carousel, akses cepat (SPMB, E-Learning, Perpustakaan, E-Rapor), sambutan kepala sekolah, statistik, program unggulan, berita terbaru, agenda & pengumuman, prestasi, galeri dengan modal, testimoni, dan ajakan pendaftaran SPMB.
- Profil: sambutan, sejarah dalam bentuk timeline, visi & misi, pimpinan sekolah, sarana & prasarana, serta identitas sekolah.
- Berita: daftar berita dengan pagination, sidebar pencarian, kategori, berita populer, dan tag.
- Kontak: informasi kontak, formulir dengan validasi Bootstrap, dan area peta lokasi.
Fitur:
- Komponen Bootstrap 5: navbar dengan dropdown, offcanvas (menu HP), carousel, card, list group, modal, breadcrumb, pagination, dan form validation.
- Responsif untuk HP, tablet, dan desktop.
- Bootstrap disimpan lokal (tanpa CDN) dan ikon berupa SVG inline, jadi bisa dipakai offline.
- Seluruh warna diatur lewat variabel CSS di satu tempat, mudah disesuaikan dengan warna sekolah Anda.
- Angka statistik yang menghitung naik, animasi muncul saat scroll, dan galeri foto dalam modal.
- Istilah terkini sesuai Kurikulum Merdeka, termasuk P5 dan SPMB.
- Dilengkapi README berisi panduan penggunaan dan penggantian gambar.
Cocok untuk: website SD, SMP, SMA, SMK, MA, MTs, dan yayasan pendidikan, tugas sekolah atau kuliah, maupun bahan awal proyek website sekolah untuk klien.
Teknologi: HTML5, CSS3, Bootstrap 5.3, dan JavaScript.
Cara pakai: ekstrak file zip, lalu buka index.html di browser. Ganti nama sekolah, kontak, dan gambar di folder assets/img dengan foto asli sekolah Anda. Gambar bawaan berupa ilustrasi contoh (placeholder).
Tersedia juga dalam pilihan warna lain di kategori HTML Template. Catatan: formulir kontak masih berupa demo tampilan. Sambungkan ke PHP atau backend Anda agar pesan benar-benar terkirim.
