> ## Knowledge Base Index > Fetch the complete knowledge base index at: https://help.hoppyapps.com/sitemap.xml > Use this file to discover available pages before exploring further. > Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash). # 📅 Come Costruire il Calendario di Prenotazione Appuntamento sul Tuo Negozio > ℹ️ **Note:** Questo articolo è stato tradotto automaticamente utilizzando AI e può contenere imprecisioni. Se qualcosa sembra sbagliato, si prega di contattare il nostro team di supporto. Hoppy Appointments ti dà due modi per visualizzare il calendario di prenotazione sul tuo negozio: 1. **Pulsante automatico Prenota ora** — sostituisce il pulsante Aggiungi al carrello sulle pagine dei prodotti collegate ai tuoi servizi. 2. **Blocco del calendario di nomina manuale** — inserire una carta di prenotazione o un calendario in linea in qualsiasi pagina utilizzando Shopify’ l’editor tema. Questa guida ti accompagna attraverso entrambi i metodi in modo che i clienti possano iniziare a prenotare direttamente dal tuo negozio. --- # **⚠️ Prima di iniziare** Prima di incorporare il calendario, assicurarsi di avere: * The **Hoppy Appointments** app installata sulla tua Shopify negozio * Almeno **un servizio creato** e collegato a un Shopify prodotto * Una chiara idea di se si desidera un calendario popup o un calendario in linea sulla pagina Se non hai ancora creato un servizio, inizia con **Come impostare i servizi di prenotazione di nomina** Prima. --- # **🛠️ Fase 1 — Abilitare l'app Prenotazione App Embed** L'app embed è l'interruttore principale che fa funzionare il widget di prenotazione. Deve essere abilitato sia per l'integrazione automatica che manuale. ## **Opzione A: Attiva dall'interno dell'app** 1. Aprire **Hoppy Appointments** app 2. Nel **cruscotto,** Trova il **Stato dell'app** carta 3. Fare clic **Attivare** Questo apre il Shopify editor tema direttamente alla sezione app embed. ## **Opzione B: Abilitare manualmente da Shopify Amministrazioni** 1. Vai a **Shopify Admin → Online Store → Temi** 2. Fare clic **Personalizzarsi** sul tema live 3. Fare clic su **App incorporato** icona in alto 4. Trova **Appuntamento Prenotazioni** 5. Toggle it **ON** 6. Fare clic **Salva** Una volta abilitato, il **Stato dell'app** scheda dentro Hoppy Appointments spettacoli **Attivo**. --- # **🛠️ Passo 2 — Assicurarsi che il vostro servizio è attivo e salvato** Il widget di prenotazione appare solo per i servizi che vengono salvati e attivati. 1. Nell'app, vai a **I miei servizi** 2. Controlla il badge vicino al tuo servizio: * **Attivo** ✅ — il servizio è vivo * **Inattivo** — aprire il **Altro** menu e click **Accensione** * **Archivio** — aprire il **Altro** menu e click **Unarchive**, poi accendere 3. Aprire il servizio e fare clic **Salva** Risparmiare il vostro servizio con il negozio. Questo è importante dopo aver cambiato varianti di prodotto, prezzi o disponibilità. --- # **🛠️ Passo 3 — Controlla il pulsante Prenota ora sulla tua pagina di prodotto** Una volta che l'app incorporata è attiva e il servizio viene salvato, la pagina del prodotto collegata al tuo servizio mostra automaticamente una **Prenota ora** pulsante invece di **Aggiungi al carrello**. 1. Apri il tuo negozio dal vivo 2. Vai al prodotto collegato al tuo servizio 3. Confermare **Prenota ora** pulsante appare 4. Fare clic su di esso per aprire il popup di prenotazione Se il prodotto ha più varianti, passare tra loro. Il pulsante Book Now appare solo per le varianti che fanno parte del servizio. 💡 Il selettore di quantità è disabilitato per i prodotti prenotabili perché ogni prenotazione è per una slot alla volta. --- # **🛠️ Passo 4 — Aggiungi il blocco del calendario di nomina manualmente (opzionale)** Utilizzare questo metodo se: * Il tuo tema utilizza un costruttore di pagine o un modulo di prodotto personalizzato * Vuoi il calendario su una pagina che non è una pagina di prodotto * Vuoi una carta di prenotazione in stile con dettagli di servizio * Si desidera che il calendario completo incorporato direttamente sulla pagina ## **Aggiungere il blocco** 1. Vai a **Shopify Admin → Online Store → Temi** 2. Fare clic **Personalizzarsi** sul tema live 3. Navigare alla pagina in cui si desidera il calendario 4. Fare clic **Aggiungi blocco** o **Aggiungi sezione** 5. Trova **Apps → Calendario di Appuntamento** 6. Incolla il tuo **ID servizio** 7. Scegli una **Modalità incorporata** ## **Trova il tuo ID Servizio** * Aprire la pagina di modifica del servizio — l'ID del servizio è mostrato vicino all'inizio * O vai **I miei servizi → Più → Copy Service ID** ## **Scegliere una modalità incorporata** * **Modal** — mostra una carta di prenotazione con l'immagine di servizio, titolo, descrizione, prezzo e **Prenota ora** pulsante che apre il calendario in un popup * **Direct** — incorpora il calendario di prenotazione completo direttamente sulla pagina in modo che i clienti possono scegliere date e orari senza aprire un popup ## **Configurare lo stile di base** Il blocco ti permette di personalizzare: * Colore dello sfondo * Titolo colore e dimensione del carattere * Colore del prezzo e dimensione del carattere * Opzione etichetta colore e dimensione del carattere * Prenota ora pulsante colore, sfondo e dimensione del carattere * Dettagli link colore, sfondo, dimensione del carattere e visibilità Per opzioni di styling più profonde, vedere **Prenotazioni di nomina — Design & Styling Opzioni**. ## **Salvare il tema** Fare clic **Salva** nell'editor tema, quindi visualizzare la pagina live. ⚠️ Il blocco Calendario di Appuntamento richiede ancora **App prenotazioni embed** da abilitare. Se non lo è, il blocco mostra un messaggio "App Embed Not Enabled". --- # **👀 Cosa vedono i clienti** ## **Pulsante automatico Prenota ora** 1. Il cliente visita la pagina del prodotto 2. Vedono **Prenota ora** pulsante invece di Aggiungi al carrello 3. Si fa clic su di esso e si apre un calendario popup 4. Selezionano una data, un'ora e compilano il modulo di prenotazione 5. Se il pagamento è abilitato, il prodotto è aggiunto al carrello e controllano 6. Se il pagamento non è abilitato, la prenotazione viene confermata immediatamente ## **Blocco manuale Modal** 1. Il cliente visita la pagina in cui è stato inserito il blocco 2. Vedono una carta con dettagli di servizio, prezzo e opzioni di variante o durata 3. Loro cliccano **Prenota ora** per aprire il calendario popup 4. Completano il flusso di prenotazione ## **Blocco manuale diretto** 1. Il cliente visita la pagina in cui è stato inserito il blocco 2. Il calendario completo si carica in linea mentre scorre in vista 3. Selezionano una data e l'ora direttamente sulla pagina 4. Completano il modulo di prenotazione e il checkout --- # **⚠️ Note importanti** * **App incorporato è necessario per entrambi i metodi.** Anche se si utilizza il blocco manuale, l'app Appointment Bookings embed deve essere attivata. * **Usa il tuo tema live, pubblicato.** Il calendario non apparirà su temi redatti o inediti. * **Un servizio attivo per variante di prodotto.** Se una variante è collegata a più di un servizio attivo, il comportamento può essere imprevedibile. * **Salva dopo ogni cambiamento.** Varianti di prodotto, prezzi, disponibilità e impostazioni di servizio raggiungono solo il negozio dopo aver fatto clic su Salva. * **Il pulsante Book Now nasconde i pulsanti originali Add to Cart e dynamic checkout** solo per varianti prenotabili. Altri prodotti rimangono invariati. * **Quantità selettori disabilitati** per i prodotti prenotabili perché le prenotazioni sono acquisti single-slot. --- # **🐞 Risoluzione dei problemi** ## **Il pulsante Prenota ora non appare** * Confermare **Stato dell'app** spettacoli **Attivo** * Assicurarsi che il servizio sia salvato e attivo * Controllare che si sta visualizzando la pagina del prodotto corretta e variante * Assicurarsi che si sta testando sul tema live, non un progetto * Difficile aggiornare la pagina o il test in una finestra Incognito ## **Il blocco manuale mostra "App Embed Not Enabled"** Torna al Passo 1 e abilita l'app Prenotazione embed. ## **Il blocco manuale mostra "Configurazione del servizio di Appuntamento non trovata"** Controllare il **ID servizio** Hai incollato. Puoi copiarlo di nuovo da **I miei servizi → Più → Copy Service ID**. ## **Il calendario si apre ma non sono disponibili date** Controlla il tuo servizio **Disponibilità** scheda. Assicurarsi che i giorni di lavoro sono abilitati, guarda-ahead e minimo preavviso di programmazione sono ragionevoli, e le date bloccate non stanno coprendo tutto. Per una passeggiata completa di risoluzione dei problemi, vedere **Calendario di prenotazione non mostra sul mio negozio \[Fixed\]**. --- # **🎉 Risultato finale** Una volta configurato: ✅ L'app per le prenotazioni di App embed è abilitata nel tuo tema ✅ Il servizio viene salvato, attivo e connesso al prodotto giusto ✅ The **Prenota ora** pulsante appare automaticamente nella pagina del prodotto ✅ Opzionalmente, un blocco Calendario di Appuntamento è posizionato su qualsiasi pagina che si sceglie ✅ I clienti possono prenotare direttamente dal tuo negozio --- # **📚 Articoli correlati** * **Come impostare i servizi di prenotazione di nomina** * **Calendario di prenotazione non mostra sul mio negozio \[Fixed\]** * **Prenotazioni di nomina — Design & Styling Opzioni** * **Come impostare CSS personalizzato per le prenotazioni di nomina App** * **Come impostare il pulsante di azione galleggiante come Calendly per le prenotazioni di nomina** * **Prenotazioni di nomina — Tutte le opzioni di pagamento Spiegato** * **Prenotazioni di nomina — Tipi di prenotazioni spiegate**