1
Buka Layanan Gemini AI
Akses situs resmi Gemini AI melalui peramban (browser) di komputer atau ponsel Anda:
gemini.google.com. Pastikan Anda telah masuk (login) menggunakan akun Google Anda.
2
Salin & Siapkan Prompt Perintah
Gunakan teks perintah (prompt) terstruktur di bawah ini agar Gemini AI membuatkan kode dengan desain dan spesifikasi yang presisi:
Buatkan laman Portal Website PGRI Kabupaten Batanghari, bentuk laman seperti gambar yang saya kirim, tolong dibuatkan icon apa saja yang perlu dalam organisasi pgri. semua icon akan dihubungkan ke laman lain (a href="#"). laman responsif, tampilan menarik, animasi cahaya berubah warna, modern. jika dilihat di handphone 3 icon dalam 1 baris. di atas header ada logo (logopgri.png). Warna laman sesuaikan dengan warna logo PGRI.
3
Unggah Gambar Contoh Tampilan Web
Klik ikon tambah/lampirkan gambar (+ atau ) pada kolom input Gemini AI, lalu pilih file gambar acuan Anda (misalnya:
gbr-tampilan-web.jpg).
Contoh File Terlampir: gbr-tampilan-web.jpg
4
Proses Prompt dengan Gemini AI
Tekan tombol **Kirim** (ikon pesawat kertas atau Enter). Biarkan Gemini AI menganalisis tata letak pada gambar dan memproses instruksi penulisan kode HTML, CSS, & JS.
5
Unduh atau Salin Kode yang Dihasilkan
Setelah pratinjau (preview) hasil keluaran AI muncul, klik tombol "Copy Code" di sudut kanan atas blok kode atau gunakan fitur unduh file HTML.
6
Edit Kode HTML Menggunakan Notepad / Code Editor
Buka file HTML tersebut menggunakan aplikasi Notepad, Notepad++, atau VS Code. Cari bagian atribut
href="#" pada tiap ikon menu, lalu ubah tanda # sesuai tautan laman tujuan Anda.
<!-- Contoh Pengeditan Tautan Menu -->
<a href="pengantar.html" class="menu-card">
<i class="fa-solid fa-file-lines"></i>
<span>Pengantar</span>
</a>