Il widget di prenotazione e il suo aspetto

Attivare il pulsante Prenota ora

Usa Apri l'editor del tema nella guida alla configurazione. Apre gli Incorporamenti di app dell'editor del tema con l'incorporamento Prenota ora di Rezervito già attivato: premi Salva e hai finito. Puoi anche aprire tu stesso Impostazioni del tema → Incorporamenti di app nell'editor del tema e attivare Prenota ora.

È l'unica cosa che deve essere attiva. Con l'incorporamento attivo, un pulsante fluttuante Prenota ora compare in un angolo di ogni pagina del tuo negozio, e tutti gli altri pulsanti Prenota ora funzionano. Non compare nella pagina in cui il cliente vede la sua prenotazione: ha già prenotato, e sul telefono coprirebbe i pulsanti di quella pagina. Mentre il carrello laterale, il menu o la ricerca del tuo tema sono aperti, si fa da parte, così non ne copre mai i pulsanti. Se è disattivato, nessuno di loro funziona.

Il passaggio Attiva il pulsante Prenota ora della guida alla configurazione si spunta da solo quando l'incorporamento è attivo nel tuo tema pubblicato. Vedi Primi passi.

Le impostazioni dell'incorporamento nell'editor del tema:

• Mostra il pulsante fluttuante: attivo all'inizio. Disattivalo se preferisci inserire i tuoi pulsanti.
• Posizione: In basso a destra, In basso a sinistra, Centro a destra o Centro a sinistra.
• Distanza dal lato e Distanza dal basso, in pixel: 20 all'inizio. Con una posizione Centro, la distanza dal basso sposta invece il pulsante sotto il centro.
• Distanza dal basso diversa sui telefoni: attivala per impostare la Distanza dal basso sui telefoni, per esempio per alzare il pulsante sopra la barra fissa Aggiungi al carrello del tuo tema o un pulsante della chat.
• Testo del pulsante: lascialo vuoto per mostrare «Prenota ora» nella lingua in cui il cliente sta navigando.
• Etichetta del campo note e Testo segnaposto del campo note: il testo del campo note. Se ai clienti vengono chieste delle note si imposta in Rezervito, in Impostazioni → Regole di prenotazione → Dati del cliente. Se lo lasci vuoto, il campo mostra un promemoria a non scrivere dati sulla salute o altri dati sensibili; con il tuo testo segnaposto, il promemoria compare sotto il campo.

Altri pulsanti Prenota ora

Ogni pulsante Prenota ora apre la stessa finestra di prenotazione:

• Il blocco Pulsante di prenotazione. Nell'editor del tema, aggiungi il blocco Pulsante di prenotazione a qualsiasi sezione che accetta blocchi di app, per esempio l'hero della home page o l'intestazione del negozio. Le sue impostazioni sono Testo (vuoto mostra «Prenota ora» nella lingua del cliente) e Allineamento: Sinistra, Centro o Destra. Nell'intestazione, Posizione nell'intestazione lo mette Prima delle icone, Prima del carrello (la scelta iniziale) o Dopo il carrello; quanto si può spostare dipende dal tuo tema. Sul telefono compare più piccolo, su una riga; in un tema con un logo largo al centro dell'intestazione potrebbe comunque non esserci spazio, quindi controlla il negozio sul telefono e, se serve, usa lì il pulsante fluttuante o un link del menu. Il blocco compare solo mentre l'incorporamento è attivo.
• Qualsiasi link a `#book-now`. Aggiungi una voce di menu, o un pulsante nel tuo tema, il cui link sia #book-now (o /#book-now). Apre la finestra di prenotazione nella pagina in cui si trova il cliente. Funziona anche dove il tuo tema non accetta blocchi di app.
• Un link da condividere. L'indirizzo del tuo negozio seguito da /#book-now, per esempio https://your-store.com/#book-now, apre il negozio con la finestra di prenotazione già aperta. Usalo nelle email, nei post sui social o in un codice QR.

Se disattivi il pulsante fluttuante e non inserisci nessun altro pulsante Prenota ora, i clienti non hanno modo di prenotare, e nulla ti avvisa. Controlla il tuo negozio online dopo aver cambiato queste impostazioni.

La finestra di prenotazione segue la lingua del tuo negozio. Quando Calendario aperto alle nuove prenotazioni è disattivato in Impostazioni → Regole di prenotazione, mostra che al momento non si accettano prenotazioni. Vedi Come prenotano i clienti.

La tua pagina di prenotazione

Il tuo negozio ha anche una pagina di prenotazione: l'indirizzo del negozio seguito da /apps/booking, per esempio https://il-tuo-negozio.it/apps/booking. Appena si carica, apre la finestra di prenotazione. Sotto la finestra la pagina mostra "Prenota un appuntamento" e un pulsante Prenota ora, così un cliente che chiude la finestra può riaprirla.

La pagina di prenotazione funziona anche quando l'incorporamento è disattivato o il tuo tema non può contenere app, quindi è il link più sicuro da condividere: nel menu, sui social, nelle email o come codice QR al bancone. Copia il suo indirizzo con Copia link nella scheda Dove possono prenotare i clienti in Impostazioni → Aspetto. La pagina si apre nel tuo tema, nella lingua in cui il cliente sta navigando. Il suo pulsante Prenota ora prende i tuoi colori Pulsante e Testo del pulsante; con Tema scelto, ha l'aspetto dei pulsanti del tuo tema.

Dove possono prenotare i clienti

La scheda Dove possono prenotare i clienti in Impostazioni → Aspetto elenca ogni modo di aprire la finestra di prenotazione, ognuno con la sua scorciatoia:

• Pulsante fluttuante: Attivo o Disattivato, come letto dal tuo tema attivo, e dove si trova, per esempio "In basso a destra, su ogni pagina."
• Pulsante nell'header o in una sezione: Aggiungi ↗ apre l'editor del tema aggiungendo il blocco Pulsante di prenotazione al tuo header. Alcuni temi non lo accettano nell'header; in quel caso aggiungilo a una sezione.
• Link di menu: #book-now con Copia link. In Shopify, vai su Contenuti → Menu e aggiungi una voce di menu con questo link.
• Pagina di prenotazione: l'indirizzo della tua pagina di prenotazione con Copia link.

La scheda li raggruppa: Nel tuo tema riunisce i primi tre, che hanno bisogno dell'incorporamento Prenota ora, e la sua intestazione dice Incorporamento attivo o Incorporamento disattivato. Modifica ↗ apre gli incorporamenti app dell'editor del tema. Ovunque riunisce la tua pagina di prenotazione, che funziona anche senza l'incorporamento.

Quando sembra che Canvas abbia creato da zero il tuo tema attivo, o il tema non si vede affatto, Nel tuo tema dice Non disponibile e le sue righe non hanno scorciatoie, perché un tema così non può ancora contenere app: usa la tua pagina di prenotazione.

Scegliere i colori del widget

Apri Impostazioni → Aspetto. La scheda Widget di prenotazione contiene:

• Schema di colori: set di colori già pronti. Tema, la scelta iniziale, non imposta colori propri: i pulsanti Prenota ora hanno l'aspetto dei pulsanti del tuo tema, e la finestra di prenotazione è bianca con testo scuro. Qualsiasi altro schema imposta tutti e cinque i colori, che puoi poi cambiare uno per uno. Personalizzato compare quando cambi un colore a mano, e resta lì per tornarci se provi un altro schema.
• I cinque colori: Testo, Sfondo, Pulsante, Testo del pulsante e Pulsante con contorno.

Una coppia di colori poco leggibile è segnalata con Difficile da leggere. È solo un avviso: puoi comunque salvarla.

L'Anteprima mostra il pulsante fluttuante Prenota ora e la finestra di prenotazione con dati di esempio, in larghezza Telefono o Desktop: l'elenco dei servizi e gli orari. Su un computer sta accanto alle schede, su un telefono sotto.

Salva applica subito i colori al tuo negozio. Se il negozio non può essere aggiornato, non viene salvato nulla e puoi riprovare.

I pulsanti Prenota ora usano i colori Pulsante e Testo del pulsante. Mantengono la forma dei pulsanti del tuo tema: angoli, dimensioni e carattere. Con Tema selezionato, hanno l'aspetto dei pulsanti del tuo tema. Se i pulsanti del tuo tema non vengono riconosciuti, ricevono un semplice pulsante con contorno.

La finestra di prenotazione usa sempre il carattere del tuo tema e gli spessori che il tuo tema dà al testo e ai titoli, così appare leggera o marcata quanto il resto del negozio. Tutto il resto nella finestra è suo: mantiene maiuscole e minuscole, spaziatura delle lettere, dimensioni e layout, qualunque cosa il tuo tema faccia a titoli, etichette e campi, e il suo testo in grassetto (il mese, il passaggio attuale, il totale) non è mai più sottile del testo del tuo negozio. Si legge anche da sinistra a destra, come tutte le sue lingue, anche quando il tuo negozio è impostato da destra a sinistra (per l'ebraico o l'arabo). Per qualsiasi altro stile, usa il CSS personalizzato del tuo tema; una regola per la finestra di prenotazione deve iniziare con .rezervito-modal[data-rezervito-modal][open] (o usare !important) per avere effetto. I colori valgono per ogni pulsante Prenota ora e per la finestra di prenotazione in ogni tema, e per la pagina in cui i clienti vedono, spostano o annullano la loro prenotazione. Le usano anche le tue email di prenotazione: il colore Pulsante ne è l'accento (un grigio scuro con Tema, o con un pulsante troppo chiaro sul bianco), insieme al logo del tuo negozio, e le pagine di Rezervito nel tuo admin di Shopify hanno sempre l'aspetto di Shopify.

La pagina di prenotazione dei tuoi clienti è impostata come le loro email: in alto il nome del tuo negozio e il N. prenotazione, come #1042 (lo stesso numero che vedi nell'admin); poi lo stato della prenotazione, l'orario e il servizio con il collaboratore, la durata e il prezzo. Sotto, Modifica o annulla indica fino a quando il cliente può cambiare l'orario o annullare online — in una sola frase quando le due scadenze coincidono — con i pulsanti Sposta e Annulla prenotazione. Sposta apre la stessa finestra di prenotazione in cui prenotano i clienti, su Scelga un orario, per il servizio di quella prenotazione: il collaboratore è già scelto, e altri sono proposti solo se la prendono allo stesso prezzo e con la stessa durata. Scelto un orario, la finestra mostra il nuovo orario, e Sposta la mia prenotazione la sposta e ricarica la pagina. Annulla prenotazione chiede prima conferma, in una finestra con Mantieni la prenotazione. Sposta compare solo finché l'app embed «Book now» è attivo nel tuo tema. Quando online non si può più fare nulla, lo dice in una frase e mostra il pulsante Scrivi al salone. La pagina di una visita mostra il numero una volta e ogni servizio uno dopo l'altro.

Il marchio Rezervito

Le email ai tuoi clienti finiscono con una breve riga, «Prenotato con Rezervito», con una piccola icona. Il tuo negozio non mostra alcun marchio Rezervito: né nella finestra di prenotazione, né nella pagina di prenotazione dei tuoi clienti. È uguale in tutti i piani.

Per rimuoverli, contattaci e li disattiveremo per il tuo negozio.

L'aspetto del portale staff

La scheda Portale del personale nella stessa sezione imposta il Colore di accento del portale: i suoi elementi evidenziati e i pulsanti.

• Come il pulsante del widget (la scelta iniziale) segue il colore Pulsante del widget.
• Il mio colore ti permette di sceglierne uno.

Un accento troppo chiaro per essere leggibile nel portale non viene usato: il portale mantiene il blu di Rezervito, e la scheda te lo segnala. Lo sfondo, il testo e i colori delle prenotazioni del portale restano sempre gli stessi, così resta facile da leggere come strumento di lavoro.

Il portale mostra il Logo del tuo negozio da Impostazioni → Brand in Shopify; Apri le impostazioni del brand ti porta lì. Senza logo mostra il nome del tuo negozio. Vedi Staff e orari.

Il pulsante Prenota ora in un tema creato con Canvas

Canvas è il nuovo modo di Shopify per creare un tema con Sidekick. Un tema duplicato con Canvas (nel menu ⋯ del tema: Duplicate in Canvas) mantiene le sue app com'erano: se nell'originale l'incorporamento Prenota ora era attivo, nella copia funzionano il pulsante fluttuante, la finestra di prenotazione, i link del menu a #book-now e la tua pagina di prenotazione, e Rezervito lo vede come qualsiasi altro tema. Un tema che Canvas crea da zero non può ancora contenere app, e in Canvas stesso non c'è niente da attivare. Rezervito riconosce un tema così: finché è attivo e l'incorporamento è spento, il passaggio Attiva il pulsante Prenota ora della guida alla configurazione dice che il tuo tema attivo sembra creato con Canvas, e mostra l'indirizzo della tua pagina di prenotazione con Copia link al posto di Apri l'editor del tema. (Se Rezervito non riesce affatto a vedere il tuo tema attivo, il passaggio dice "Non riusciamo a vedere il tuo tema attivo" e offre lo stesso indirizzo.)

In questo caso puoi:

• indirizzare i clienti alla tua pagina di prenotazione: aggiungila al menu e usala sui social, nelle email e nei codici QR; oppure
• pubblicare un tema normale e attivare lì l'incorporamento Prenota ora.

Il passaggio resta aperto finché il tuo tema attivo non è visibile, e si spunta da solo quando l'incorporamento è attivo in un tema attivo che Rezervito riesce a vedere.

Prenotando compare "Qualcosa è andato storto"

L'indirizzo di Rezervito è /apps/booking in quasi tutti i negozi, ma nel tuo può essere un altro. Puoi cambiarlo in Shopify (Impostazioni → App → Rezervito → App proxy), e Shopify dà a Rezervito un altro indirizzo, come /apps/booking-1, quando un'altra app usa già /apps/booking. Rezervito segue il nuovo indirizzo da solo appena una visita lo raggiunge: la finestra di prenotazione prova da sé /apps/booking-1, /apps/booking-2 e /apps/booking-3, e la scheda Dove possono prenotare i clienti mostra poi la tua pagina di prenotazione al nuovo indirizzo. Anche le email di prenotazione inviate dopo rimandano al nuovo indirizzo.

Se la finestra di prenotazione dice ancora solo "Qualcosa è andato storto. Riprovi.", apri il negozio nell'editor del tema: lì la finestra di prenotazione dice a te, e solo a te, cosa non va. In Shopify, vai su Impostazioni → App → Rezervito, apri una volta l'URL App proxy indicato lì, poi ricarica il negozio.