Cara Membuat Generator Resep Menggunakan Chat GPT Di Divi

Rifat Divi Tutorials Nov 29, 2023

Selamat datang di tutorial kami hari ini tentang cara membuat generator resep menggunakan ChatGPT di Divi ! Dalam panduan ini, saya akan memandu Anda langkah demi langkah cara menyiapkan formulir sederhana di situs web Divi Anda yang memanfaatkan Obrolan GPT untuk secara dinamis menghasilkan ide dan instruksi resep smoothie.

Pada akhirnya, Anda akan memiliki generator resep bertenaga AI yang dapat digunakan pengunjung untuk mendapatkan saran resep khusus berdasarkan bahan-bahan yang mereka miliki. Ini adalah cara yang sangat keren untuk menambahkan elemen interaktif unik ke situs makanan atau memasak Anda.

Mari kita mulai!

Pengaturan Bidang Formulir Dasar

Kami akan mengonfigurasi bidang formulir dasar untuk alat rekomendasi smoothie kami di bagian ini. Bahan-bahan, jenis smoothie, dan pantangan makanan adalah beberapa di antaranya.

Buat Situs Web Luar Biasa

Dengan Elementor pembuat halaman gratis terbaik

Mulai sekarang

Tambahkan Formulir Divi

Di pembuat visual Divi, buat halaman baru dan tambahkan satu baris kolom.

Tambahkan modul Divi Form Builder dengan nama "Smoothie Doctor" atau nama lain yang sesuai ke baris.

Bidang Masukan untuk Bahan

Bahan-bahannya harus masuk ke bidang baru. Tentukan jenis bidang yang akan dijadikan Input.

Masukkan ID bidang yang mudah diingat, seperti f_ingredients.

Buat label di bagian atas, ikon, dan teks placeholder (seperti "Masukkan bahan-bahan Anda, dipisahkan koma") untuk bidang bahan di bawah Tab Tata Letak.

Bidang Radio untuk Jenis Smoothie

Untuk jenis smoothie kami, tambahkan kolom baru.
Tentukan jenis bidang yang akan menjadi Radio.
Masukkan ID bidang yang mudah diingat, seperti f_type.

Tambahkan pilihan smoothie buah dan smoothie sayuran ke dalam kolom untuk jenis smoothie.

Atur Gaya Bidang Radio/Kotak Centang ke Default atau Gaya tombol di bawah Opsi Tata Letak.

Setel "YA" untuk opsi satu baris berikut.

Pastikan untuk mengatur gaya radio/kotak centang aktif pada Tab Desain jika Anda menggunakan gaya tombol.

Bidang Pemeriksaan Pembatasan Diet

Untuk keterbatasan diet kita, tambahkan bidang baru.
Pilih jenis bidang Kotak Centang.
Masukkan ID bidang yang mudah diingat, seperti f_restrictions.

Pilihan Rendah Kalori, Bebas Susu, dan Tidak Ada dapat ditambahkan ke kotak batasan diet untuk membuatnya lebih unik.

Atur Gaya Bidang Radio/Kotak Centang ke Default atau Gaya tombol di bawah Opsi Tata Letak.

Setel "YA" untuk opsi satu baris berikut.

Pastikan untuk mengatur gaya radio/kotak centang aktif pada Tab Desain jika Anda menggunakan gaya tombol.

Menambahkan Bidang dan Ikhtisar AI Formulir Divi

Kami akan memperbarui formulir kami menggunakan fungsi Divi Form AI di bagian ini. Dengan bantuan Divi Form AI, kami akan dapat menghasilkan resep smoothie yang dihasilkan AI dan disesuaikan dengan kemungkinan batasan diet yang mungkin dimiliki pengguna kami. Saat kami mendefinisikan persona AI, perintah AI, dan lebih banyak lagi pada formulir yang digerakkan oleh Divi AI ini, kami akan membaginya menjadi beberapa bagian.

Bidang AI untuk Keluaran Resep

Tambahkan bidang untuk AI ke formulir dan beri nama "Resep AI" atau nama apa pun yang sesuai.

Pilih jenis bidang AI untuk bidang tersebut.

Masukkan ID kolom yang mudah diingat, seperti f_recipe.

Konfigurasikan opsi prompt di bagian Form AI dengan menggulir ke bawah. Di sini, kami akan menentukan pedoman untuk model AI.

Pengaturan Formulir AI Formulir Divi

Saya tahu bahwa kita semua siap untuk memulai perintah AI sehingga kita dapat menikmati smoothie yang lezat dan pernak-pernik Chat GPT yang manis, namun pertama-tama mari kita lihat pengaturan AI.

Ini terletak di bagian Formulir AI pada pengaturan formulir utama, bukan pengaturan bidang.

Tetapkan pengeluaran maksimum yang diperbolehkan untuk formulir khusus ini yang dapat diubah di pengaturan admin.

Pilih tindakan yang Anda inginkan untuk diambil formulir ketika batasnya terpenuhi.

Tombol kirim formulir dapat ditampilkan, disembunyikan, atau dinonaktifkan hingga konten AI diproduksi.

Untuk mengevaluasi ketepatan waktu dan kualitas respons, simpan respons AI ke database.

Tetapkan batas kecepatan panggilan API untuk mencegah penyalahgunaan.

Jika Anda menerima respons yang buruk atau tampaknya AI tidak mencatat semua masukan, aktifkan ini.

Pengaturan Divi AI – Mendefinisikan Persona AI

Konteks inilah yang membuat model AI ini tetap terkendali dan mencegah mereka mengalami halusinasi aneh dan melontarkan omong kosong yang benar-benar tidak logis. Kami akan mendefinisikan persona AI untuk memberikan konteks dan peran spesifik untuk model AI. Personanya, dalam terminologi AI, adalah cara kami menyediakan konteks yang diperlukan untuk merespons permintaan Anda dengan lebih terampil.

Anda beruntung karena Divi Form Builder memungkinkan Anda untuk sepenuhnya menyesuaikan dan membuat persona dari awal selain menawarkan beberapa persona AI yang telah ditentukan sebelumnya. Buka pengaturan Bidang AI dan gulir ke bawah ke Formulir AI untuk melihat pilihan ini.

Membuat Persona AI Khusus

Pilih "Kustom" dari opsi persona prompt yang telah ditentukan sebelumnya di bagian Persona Prompt yang telah ditentukan sebelumnya.

Di Custom Prompt Persona, jelaskan posisi dan keahlian koki AI. Dengan menggunakan komponen yang disediakan pengguna dan mempertimbangkan batasan diet apa pun, Anda dapat mengatakan, misalnya, "Anda adalah koki AI yang berpengalaman membuat resep smoothie yang lezat."

Persona AI bahkan dapat diberi nama, seperti "Chef Engine", dengan menambahkan sesuatu yang memberi kesan "Nama Anda adalah Chef Engine dan Anda harus menyebut diri Anda seperti itu." Persona Prompt Kustom Anda telah berakhir.

Dengan membangun persona AI, kami dapat memberikan konteks model AI dan instruksi mengenai jenis data yang kami ingin hasilkan. Hal ini memungkinkan untuk menyesuaikan resep smoothie yang dihasilkan AI dengan masukan dan preferensi pengguna.

Pengaturan Divi AI – Rekayasa Prompt AI Anda

Saatnya untuk mengatasi masalah tersulit saat bekerja dengan AI apa pun, seperti Divi Form AI atau ChatGPT, rekayasa cepat. Rekayasa yang cepat mungkin tampak mengintimidasi bagi orang awam, namun yang diperlukan hanyalah mempelajari cara berkomunikasi dengan AI sehingga AI memahami apa yang Anda katakan dan melaksanakan instruksi Anda.

Oleh karena itu, untuk menghasilkan resep smoothie, kita harus menyediakan konteks dan instruksi yang sesuai dalam kerangka pelajaran Divi Form AI ini. Kami memperhitungkan masukan pengguna untuk Divi Smoothie Generator kami karena kami melakukan lebih banyak hal dengan Divi From AI daripada sekadar membuat konten. Untuk mencapai hal ini, kami meneruskan ID bidang yang kami tetapkan sebelumnya ke prompt kami.

Anda sekarang mengerti mengapa saya kesakitan karenanya.

Berikut ini adalah pertimbangan yang paling krusial:

  • Verifikasi bahwa Anda menggunakan ID bidang yang benar.
  • Pastikan Anda menggabungkan ID bidang dalam %% (mis. f_ingredients menjadi %%f_ingredients%% ).

Mengingat hal ini, yang tersisa hanyalah menginstruksikan AI tentang cara mengelola masukan pengguna dari Formulir Divi Anda dan apa yang Anda ingin lakukan dengannya. Kami akan menginformasikan bahan-bahan yang digunakan pengguna, jenis smoothie yang mereka inginkan, dan batasan diet apa pun yang perlu dipertimbangkan.

Membuat perintah AI

Gunakan bidang ID %%f_ingredients%% untuk mencantumkan bahan-bahan yang tersedia bagi pengguna di awal bagian perintah. Hal ini akan menjamin bahwa model AI mengetahui bahan-bahan yang perlu dipertimbangkan.

Jenis smoothie pilihan pengguna kemudian harus disertakan menggunakan bidang ID %%f_type%% . Ini akan membantu model AI menghasilkan resep yang tepat.

Gunakan bidang ID %%f_restrictions%% untuk menunjukkan batasan diet pengguna. Hal ini akan menjamin bahwa saat membuat resep, model AI akan mempertimbangkan keterbatasan ini.

Perjelas bahwa Anda ingin AI menawarkan resep smoothie langkah demi langkah yang menyeluruh dengan mempertimbangkan bahan-bahan dan batasan diet Anda.

Bersikeras bahwa resep tersebut harus mempertimbangkan batasan diet pengguna dan jenis smoothie yang disukai.

Kami memilih perintah berikut.

The user has the following list of ingredients available to them:
%%f_ingredients%%
They want a %%f_type%% smoothie recipe.
They have the following dietary restrictions:
%%f_restrictions%%

Please give me on detailed step-by-step smoothie recipe that takes the users ingredients and dietary restrictions into account. Make sure you adhere to their dietary restrictions and make the type of smoothie they want.

Do not ask me any follow-up questions, just provide the information.

Sekarang, dengan asumsi Anda menyelesaikan setiap langkah persis seperti yang saya instruksikan, respons GPT Anda akan seperti ini.

Pengaturan Divi AI – Meningkatkan Prompt

Dengan mengubah ungkapan atau menambahkan konteks tambahan, Anda dapat membuat perintah awal menjadi lebih efektif jika tidak memberikan hasil yang diinginkan. Sebagai layanan tambahan bagi pengguna kami, kami mungkin juga ingin menyertakan data nutrisi di bagian bawah respons.

Mari kita minta AI untuk memasukkan rincian makanan dengan menambahkan " I also want you to output detailed nutritional information as an HTML table format for easy reading".

Pikirkan tentang memformat keluaran tabel dengan elemen HTML dengan melangkah lebih jauh dan menambahkan Use <table> <thead> <tr>
dll sesuai kebutuhan untuk menampilkan tabel ke prompt Anda .

Formulir Divi AI Anda sekarang harus lebih disempurnakan, dan respons GPT sekarang harus seperti ini.

Pengaturan Divi AI – Prapemuat Teks Formulir

Tergantung pada model GPT yang Anda gunakan, pengguna mungkin harus menunggu beberapa detik, dan ini tidak ideal. Saya tidak akan berbohong kepada Anda tentang hal itu. Untuk meningkatkan pengalaman pengguna dan meyakinkan pengguna bahwa situs web Anda tidak mogok atau terhenti karena alasan apa pun, sebaiknya pasang prapemuat.

Untuk membantu hal ini, Divi Form AI menawarkan sejumlah pilihan opsi prapemuat. Selain beberapa animasi, kami juga menawarkan Preloader Teks yang memberikan kesan terminal cyberpunk yang keren.

  • Navigasikan ke pengaturan bidang bidang Resep AI.
  • Pilih Teks dari preferensi Gaya Pemuatan Respons AI dengan menggulir ke bawah ke Formulir AI.
  • Masukkan teks yang ingin Anda lihat selama proses pramuat di bawah Teks Respons AI, seperti "Menganalisis bahan..." dan "Mempertimbangkan batasan..."
  • Dengan menggunakan kode warna HTML di antara kurung kurawal, Anda dapat mengubah warna teks untuk setiap baris (misalnya, masukkan "#000000" untuk teks hitam).
  • Output teks kemudian dapat diatur agar muncul pada baris yang berbeda atau pada baris yang sama, sesuai keinginan.

Pandangan Akhir

Berikut adalah demonstrasi visual tampilan generator resep smoothie.

Kesimpulannya

Dan itu saja! Sekarang Anda memiliki generator resep cerdas sendiri yang didukung oleh ChatGPT di situs web Divi Anda. Hanya dengan formulir sederhana dan dorongan AI yang cermat, Anda dapat membuat alat yang menyenangkan bagi pengunjung untuk mendapatkan ide resep yang dipersonalisasi.

Pastikan untuk bereksperimen dengan memodifikasi persona AI dan petunjuknya untuk menghasilkan berbagai jenis resep dan instruksi yang disesuaikan dengan tema situs Anda. Kemungkinannya tidak terbatas saat menggabungkan Divi dan ChatGPT.

Divi WordPress Theme