Benvenuto nel nostro tutorial di oggi su come creare un generatore di ricette utilizzando ChatGPT su Divi ! In questa guida ti spiegherò passo dopo passo come impostare un semplice modulo sul tuo sito web Divi che sfrutta Chat GPT per generare dinamicamente idee e istruzioni per ricette di frullati.
Alla fine, avrai un generatore di ricette basato sull'intelligenza artificiale che i visitatori potranno utilizzare per ottenere suggerimenti di ricette personalizzate in base agli ingredienti che hanno a portata di mano. Questo è un modo davvero interessante per aggiungere un elemento interattivo unico al tuo cibo o al tuo sito di cucina.
Iniziamo!
Impostazione di base del campo modulo
In questa sezione configureremo i campi del modulo fondamentali per il nostro strumento di raccomandazione dei frullati. Ingredienti, tipo di frullato e restrizioni dietetiche sono alcuni di questi campi.
Create Amazing Websites
Con il miglior generatore di pagine gratuito Elementor
Parti ora
Aggiungi il modulo Divi
Nel visual builder Divi, crea una nuova pagina e aggiungi una riga a colonna singola.
Aggiungi alla riga un modulo Divi Form Builder con il nome "Smoothie Doctor" o un altro nome adatto.
Campo di input per gli ingredienti
Gli ingredienti dovrebbero andare in un nuovo campo. Determinare il tipo di campo da inserire.
Inserisci un ID campo semplice da ricordare, ad esempio f_ingredients.
Crea un'etichetta in alto, un'icona e un testo segnaposto (ad esempio "Inserisci i tuoi ingredienti, separati da virgole") per il campo degli ingredienti nella scheda Layout.
Campo radio per tipo frullato
Per i nostri frullati, aggiungi un nuovo campo.
Determina che il tipo di campo sia Radio.
Inserisci un ID campo semplice da ricordare, ad esempio f_type.
Aggiungi opzioni per frullato di frutta e frullato di verdura sul campo per il tipo di frullato.
Imposta lo stile del campo Radio/Casella di controllo su Predefinito o lo stile del pulsante in Opzioni di layout.
Impostare "SÌ" per le seguenti opzioni a una riga.
Assicurati di impostare gli stili di opzione/casella di controllo attivi nella scheda Progettazione se utilizzi lo stile del pulsante.
Campo di controllo delle restrizioni dietetiche
Per le nostre limitazioni dietetiche, aggiungi un nuovo campo.
Scegli il tipo di campo Casella di controllo.
Inserisci un ID campo memorizzabile, ad esempio f_restrictions.
Le opzioni Basso contenuto calorico, Senza latticini e Nessuno possono essere aggiunte alla casella delle limitazioni dietetiche per renderla più unica.
Imposta lo stile del campo Radio/Casella di controllo su Predefinito o lo stile del pulsante in Opzioni di layout.
Impostare "SÌ" per le seguenti opzioni a una riga.
Assicurati di impostare gli stili di opzione/casella di controllo attivi nella scheda Progettazione se utilizzi lo stile del pulsante.
Aggiunta del campo AI e della panoramica del modulo Divi
Aggiorneremo il nostro modulo utilizzando la funzione Divi Form AI in questa sezione. Con l'aiuto di Divi Form AI, saremo in grado di produrre ricette di frullati generate dall'intelligenza artificiale e adattate alle possibili limitazioni dietetiche che i nostri utenti potrebbero avere. Man mano che definiamo la personalità dell'IA, i suggerimenti dell'IA e altro ancora in questo modulo Divi basato sull'intelligenza artificiale, lo divideremo in alcune sezioni.
Campo AI per l'output della ricetta
Aggiungi un campo per AI al modulo e assegnagli il nome "Ricetta AI" o qualsiasi nome adatto.
Scegli il tipo di campo AI per il campo.
Inserisci un ID campo semplice da ricordare, ad esempio f_recipe.
Configura le opzioni del prompt nella sezione Modulo AI scorrendo verso il basso. Qui specificheremo le linee guida per il modello AI.
Impostazioni dei moduli AI Divi Form
So che tutti noi siamo pronti per iniziare con i suggerimenti dell'IA in modo da poter goderci i meravigliosi frullati e le dolci prelibatezze GPT di Chat, ma diamo prima un'occhiata alle impostazioni dell'IA.
Questi si trovano nella sezione Modulo AI delle impostazioni principali del modulo, non nelle impostazioni del campo.
Imposta una spesa massima consentita per questo particolare modulo che può essere modificata nelle impostazioni di amministrazione.
Seleziona l'azione desiderata per il modulo da intraprendere quando viene raggiunto il limite.
Il pulsante di invio del modulo può essere visualizzato, nascosto o disabilitato finché non viene prodotto il contenuto AI.
Per valutare la tempestività e la qualità della risposta, salva le risposte dell'intelligenza artificiale nel database.
Imposta un limite di velocità sulle chiamate API per prevenire abusi.
Se ricevi risposte scadenti o sembra che l'intelligenza artificiale non stia registrando tutti gli input, attiva questa opzione.
Configurazione Divi AI – Definizione di una Persona AI
Il contesto è ciò che tiene sotto controllo questi modelli di intelligenza artificiale e impedisce loro di avere allucinazioni bizzarre e di emettere parole senza senso assolutamente illogiche. Definiremo una persona AI per fornire un contesto e un ruolo specifico per il modello AI. La persona, per usare la terminologia dell'intelligenza artificiale, è il modo in cui le forniamo il contesto di cui ha bisogno per rispondere alle tue richieste in modo più abile.
Sei fortunato perché Divi Form Builder ti consente di personalizzare completamente e creare un personaggio da zero oltre a offrire alcuni personaggi AI predefiniti. Vai alle impostazioni del campo AI e scorri verso il basso fino a Modulo AI per vedere queste scelte.
Creazione di una persona AI personalizzata
Scegli "Personalizzato" dalle opzioni del tipo di prompt predefinito nella sezione Persona di prompt predefinito.
Nella Persona Prompt personalizzata, descrivi la posizione e le abilità dello chef AI. Utilizzando i componenti forniti dall'utente e tenendo conto di eventuali restrizioni dietetiche, potresti dire, ad esempio, "Sei uno chef AI con esperienza nella creazione di deliziose ricette di frullati".
Al personaggio AI può anche essere assegnato un nome, come "Chef Engine", aggiungendo qualcosa come "Il tuo nome è Chef Engine e dovresti riferirti a te stesso come tale". la tua Persona Prompt personalizzata è giunta al termine.
Costruendo un personaggio AI, possiamo fornire il contesto del modello AI e istruzioni sul tipo di dati che vogliamo che produca. Ciò consente di adattare le ricette di frullati generate dall'intelligenza artificiale agli input e alle preferenze dell'utente.
Configurazione Divi AI: ingegnerizza il tuo prompt AI
È giunto il momento di affrontare il problema più difficile quando si lavora con qualsiasi tipo di intelligenza artificiale, come Divi Form AI o ChatGPT, ovvero il prompt engineering. L'ingegneria tempestiva può sembrare intimidatoria per i non addetti ai lavori, ma tutto ciò che realmente comporta è imparare a comunicare con l'intelligenza artificiale in modo che capisca cosa stai dicendo ed esegua le tue istruzioni.
Per generare la ricetta del frullato, dobbiamo quindi fornire il contesto e le istruzioni appropriati nell'ambito di questa lezione Divi Form AI. Prendiamo in considerazione l'input degli utenti per il nostro Divi Smoothie Generator perché con Divi From AI stiamo facendo di più che semplicemente creare contenuti. Per fare ciò, passiamo gli ID campo che abbiamo precedentemente definito al nostro prompt.
Ora capisci perché mi ha dato fastidio.
Le seguenti sono le considerazioni più cruciali:
- Verifica di utilizzare l'ID campo corretto.
- Assicurati di racchiudere l'ID del campo in
%%(ad esempio f_ingredients diventa%%f_ingredients%%).
Detto questo, non resta che istruire l'intelligenza artificiale su come gestire l'input dell'utente dal tuo modulo Divi e cosa vuoi che ne faccia. Lo informeremo sugli ingredienti dell'utente, sul tipo di frullato che desidera e su eventuali restrizioni dietetiche da prendere in considerazione.
Richiesta di creazione dell'IA
Utilizza l'ID campo %%f_ingredients%% per elencare gli ingredienti disponibili dell'utente all'inizio della sezione del messaggio. Ciò garantirà che il modello di intelligenza artificiale sia consapevole degli ingredienti di cui tenere conto.
Il tipo di frullato preferito dall'utente deve quindi essere incluso utilizzando l'ID campo %%f_type%% . Ciò aiuterà il modello di intelligenza artificiale a produrre la ricetta giusta.
Utilizza l'ID campo %%f_restrictions%% per indicare le limitazioni dietetiche dell'utente. Ciò garantirà che durante la creazione della ricetta, il modello AI terrà conto di queste limitazioni.
Metti in chiaro che desideri che l'intelligenza artificiale offra una ricetta di frullato approfondita e passo dopo passo che tenga conto dei tuoi ingredienti e delle limitazioni dietetiche.
Insistere sul fatto che la ricetta tenga conto delle limitazioni dietetiche dell'utente e del tipo di frullato preferito.
Abbiamo optato per il seguente prompt.
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.Ora, supponendo che tu abbia completato ogni passaggio esattamente come ti ho indicato, la tua risposta GPT dovrebbe assomigliare a questa.
Configurazione Divi AI: miglioramento del prompt
Modificando la frase o aggiungendo ulteriore contesto, puoi rendere più efficace il suggerimento iniziale se non produce il risultato desiderato. Come servizio aggiuntivo per i nostri utenti, potremmo anche voler includere i dati nutrizionali in fondo alla risposta.
Chiediamo all'IA di includere i dettagli dietetici aggiungendo " I also want you to output detailed nutritional information as an HTML table format for easy reading".
Pensa a formattare l'output della tabella con elementi HTML facendo un ulteriore passo avanti e aggiungendo Use <table> <thead> <tr>
etc secondo necessità per visualizzare la tabella al prompt .
Il tuo modulo Divi AI ora dovrebbe essere più raffinato e la risposta GPT ora dovrebbe assomigliare a questa.
Configurazione Divi AI – Precaricatore testo modulo
A seconda del modello GPT che stai utilizzando, gli utenti potrebbero dover attendere alcuni secondi, il che non è l'ideale. Non ti mentirò su questo. Per migliorare l'esperienza utente e convincere gli utenti che il tuo sito web non si è bloccato o si è bloccato per qualsiasi motivo, è sempre una buona idea installare un preloader.
Per facilitare questo, Divi Form AI offre una serie di selezioni di opzioni di precaricamento. Oltre ad alcuni animati, offriamo anche un precaricatore di testo che gli conferisce una fantastica atmosfera da terminale cyberpunk.
- Passare alle impostazioni del campo del campo Ricetta AI.
- Seleziona Testo dalle preferenze Stile caricamento risposta AI scorrendo verso il basso fino a Modulo AI.
- Inserisci il testo che desideri visualizzare durante il processo di precaricamento in Testo risposta AI, ad esempio "Analisi degli ingredienti..." e "Considerazione delle restrizioni..."
- Utilizzando i codici colore HTML tra parentesi graffe, puoi modificare il colore del testo per ogni riga (ad esempio, inserisci "#000000" per il testo nero).
- L'output del testo può quindi essere impostato in modo che venga visualizzato su righe diverse o sulla stessa riga, a seconda delle esigenze.
Prospettiva finale
Ecco una dimostrazione visiva di come appare il generatore di ricette di frullati.
Insomma
E questo è tutto! Ora hai il tuo generatore di ricette intelligente basato su ChatGPT sul tuo sito web Divi . Con un semplice modulo e alcuni attenti suggerimenti dell'intelligenza artificiale, puoi creare uno strumento divertente per consentire ai visitatori di ottenere idee di ricette personalizzate.
Assicurati di sperimentare la modifica della personalità dell'IA e delle istruzioni per produrre diversi tipi di ricette e istruzioni su misura per il tema del tuo sito. Le possibilità sono davvero infinite quando si combinano Divi e ChatGPT.
