Membuat situs
Deskripsikan, bangun, dan sempurnakan situs web di ChatGPT atau Codex
Mulailah dengan mendeskripsikan apa yang ingin Anda bangun di ChatGPT atau Codex. Kemudian tinjau versi pertama dan sempurnakan secara bertahap.
Mulai menggunakan sites
Buka ChatGPT di web atau aplikasi desktop. Sertakan kata "website" dalam prompt Anda atau sebutkan @Sites untuk memulai alur kerja sites. Misalnya, Anda dapat meminta dasbor permintaan proyek untuk tim operasional:
Prompt:
Build a project request dashboard website for my operations team. Let team members submit requests, see who owns each one, update the status, and filter the list. Require people to sign in with their workspace account, and keep the request data saved between visits.
Dasbor tersebut hanyalah salah satu contoh. Anda dapat menyesuaikan alur berikut dengan situs yang ingin Anda bangun.
Deskripsikan situs
Beri tahu ChatGPT siapa pengguna situs dan apa yang Anda ingin mereka lakukan. Bagikan dokumen atau data yang dibutuhkan. Untuk dasbor permintaan, Anda dapat menyertakan contoh permintaan, penanggung jawab, dan label status.
Tinjau situs
Coba tindakan yang Anda minta, lalu periksa konten dan hasilnya berdasarkan materi sumber Anda. Untuk dasbor, Anda dapat mengirim permintaan, mengubah statusnya, atau memfilter berdasarkan penanggung jawab. Pastikan Anda memahami cara situs menggunakan dan menyimpan informasi.
Sempurnakan situs
Beri tahu ChatGPT apa yang ingin Anda ubah, dan bagikan tangkapan layar atau situs referensi jika membantu. Untuk dasbor, Anda dapat meminta: “Letakkan filter penanggung jawab dan status di atas daftar permintaan.”
Kelola dan bagikan situs
Kembali ke sites untuk membuka kembali atau mengedit situs. Sebelum memublikasikan, ikuti pemeriksaan peninjauan dan berbagi. Pilih siapa yang dapat mengunjungi situs dan periksa tautan yang dipublikasikan sebagai pengunjung yang dituju.
Temukan situs dan edit dalam pratinjau
Di aplikasi desktop ChatGPT, buka sites. Anda dapat memulai situs dari prompt atau proyek lokal yang kompatibel, lalu kembali ke tampilan sites untuk mengelolanya.
Di web, pilih Lainnya > sites, atau langsung buka sites di ChatGPT, untuk menemukan situs yang telah Anda buat. Dalam pratinjau, pilih Edit. Di bagian Deskripsikan pengeditan situs web, deskripsikan perubahan yang Anda inginkan. Gunakan Tangkapan layar atau Tambahkan file dan lainnya jika konteks tambahan akan membantu.
Sites tidak memiliki tampilan pengelolaan tersendiri di CLI Codex atau ekstensi IDE. Gunakan ChatGPT di web atau aplikasi desktop untuk membuat, menyimpan, menerapkan, dan mengelola situs. Anda tetap dapat menggunakan CLI atau ekstensi IDE untuk mengedit dan menguji proyek lokal sebelum memublikasikannya.
Simpan catatan dan progres
Menyimpan versi situs mempertahankan konten, desain, dan perilakunya. Permintaan pengunjung, pembaruan status, file yang diunggah, dan progres pribadi memerlukan penyimpanan tersendiri. Beri tahu ChatGPT atau Codex apa yang harus disimpan dan siapa yang boleh membaca atau mengubahnya.
Untuk catatan bersama atau pribadi, minta aturan akses yang diberlakukan di server. Periksa bahwa pembaruan tetap tersimpan setelah halaman dimuat ulang, dan gunakan akun terpisah untuk memastikan akses setiap orang. Menyembunyikan tombol tidak melindungi catatan yang mendasarinya.
Untuk file yang disediakan, tentukan apakah situs harus menggunakan salinan atau memperbarui dari sumbernya. Periksa kapan informasi terakhir diperbarui.
Untuk opsi penyimpanan dan masuk, lihat Data dan koneksi.
Kiat membangun situs
- Gunakan materi sumber Anda. Lampirkan file, tautan, definisi, dan rumus yang harus digunakan situs. Minta ChatGPT atau Codex menandai informasi yang belum tersedia alih-alih mengisinya sendiri.
- Deskripsikan kondisi kosong dan kesalahan. Jelaskan apa yang harus dilihat pengunjung ketika pencarian tidak menemukan kecocokan, formulir belum lengkap, atau aplikasi yang terhubung tidak tersedia. Sertakan cara untuk mencoba kembali atau memperbaiki masalah.
- Bagikan referensi visual. Lampirkan tangkapan layar atau tautan ke halaman, lalu tunjukkan detail yang ingin Anda gunakan, seperti kartu ringkas atau penempatan pencarian. Sertakan warna merek, font, atau pedoman penulisan yang berlaku.
- Rencanakan untuk ponsel. Deskripsikan cara kartu, tabel, dan formulir harus menyesuaikan dengan layar sempit. Periksa bahwa navigasi, filter, dan kontrol formulir tetap dapat digunakan tanpa menggulir secara horizontal.
- Beri label pada data contoh. Jika konten akhir belum siap, minta catatan sampel yang diberi label sebagai contoh. Ganti sebelum membagikan situs.
- Lakukan perubahan yang terfokus. Minta satu perubahan pada satu waktu dan sebutkan apa yang harus dipertahankan. Misalnya, pindahkan filter tanpa mengubah catatan tersimpan, aturan akses, atau tindakan yang sudah ada. Coba interaksi yang terpengaruh setelah setiap perubahan.
Galeri Sites menampilkan contoh aplikasi web yang dapat Anda bangun dengan Sites.
Contoh prompt
Untuk pusat sumber daya, mulailah dengan prompt singkat:
Prompt:
Build a resource hub website where project leads can search our kickoff resources by task. Use the resource list I attach. Save a version without deploying it so I can review it.Anda dapat memperluas permintaan tersebut dengan tindakan pengunjung, aturan pencarian, dan preferensi desain:
Prompt:
Build a resource hub website for project leads preparing a kickoff. Use the resource list I attach, with its titles, descriptions, task labels, and source links.
Visitor actions:
- Choose a task, such as preparing an agenda.
- Search within that task's resources.
- Select a result to open its source link.
Search rules:
- When the search is empty, show all resources for the selected task.
- If no task is selected, show the full list.
- If there are no matches, offer a way to clear the filters and show the help contact from my list.
- Flag entries with missing titles or links for my review.
- Search filters can reset when the visitor returns.
Design preferences:
- Use a white background and dark text. Keep descriptions to one sentence, with a layout that works on a phone.
- If I provide a reference screenshot, use it for the search placement and compact resource cards.
- If I provide a brand guide, use its accent color.
Save a version without deploying it so I can review the layout and try the search.Untuk proyek yang sudah ada, minta ChatGPT memeriksa kompatibilitas dan menyiapkannya untuk dipublikasikan:
Prompt:
Deploy this project with sites. Check whether it is compatible, make any required changes, and give me the deployment URL.Jika situs perlu mengingat catatan atau file yang diunggah, sertakan hal tersebut dalam permintaan Anda:
Prompt:
Add player scores and avatar uploads to this game. Keep the scores and uploaded avatars between visits.