Come aggiungere il widget di prenotazione Schedito a Wix
Puoi aggiungere Schedito al sito Wix che hai già senza trasferire servizi, disponibilità o prenotazioni dentro Wix. L'integrazione Wix più semplice utilizza un elemento Embed HTML che contiene i tre elementi Schedito forniti dal pannello.
Wix gestisce l'HTML incorporato diversamente da un sito tradizionale: il codice viene eseguito dentro un iframe isolato. Questa guida spiega questa differenza e come integrare correttamente Schedito.
Prima di aprire l'editor Wix
Un calendario Schedito configurato
Configura servizi, risorse e disponibilità che vuoi rendere prenotabili ai visitatori Wix.
Accesso all'editor Wix
Devi poter modificare la pagina nella quale vuoi mostrare le prenotazioni e aggiungere un elemento HTML incorporato.
I tre elementi del widget Schedito
Apri il codice widget in Schedito e tieni pronti link CSS, script JavaScript e DIV specifico del calendario.
1. Comprendi perché Wix funziona diversamente
Su un normale sito consigliamo di caricare CSS e JavaScript Schedito una sola volta e poi inserire i DIV specifici dei calendari nei punti necessari.
Il normale elemento Embed HTML di Wix viene invece eseguito dentro un iframe isolato. Il codice caricato nella pagina Wix esterna non entra automaticamente nell'iframe e il codice dell'iframe non accede direttamente agli elementi della pagina.
Per questo la configurazione Wix più semplice rappresenta un'eccezione intenzionale: link CSS, script JavaScript e DIV del widget devono essere presenti nello stesso iframe.
Integrazione normale
JavaScript — una volta
DIV — dove necessario
Wix Embed HTML
Link CSS
Script JavaScript
DIV specifico del calendario
2. Aggiungi un elemento HTML incorporato
Apri la pagina Wix in cui vuoi consentire ai clienti di prenotare.
Aggiungi un elemento HTML o Embed Code. Wix Editor e Wix Studio utilizzano etichette leggermente diverse, ma entrambi permettono di incorporare codice HTML esterno.
Posiziona l'elemento nel punto desiderato e assegna spazio orizzontale e verticale sufficiente al calendario.
3. Inserisci i tre elementi Schedito nell'embed
Apri il codice widget nel pannello Schedito. Copia link CSS, script JavaScript e DIV HTML nel campo codice dell'elemento Wix.
Un ordine pratico è:
1. Link CSS
2. DIV specifico del calendario
3. Script JavaScript
Utilizza esattamente gli snippet attuali mostrati dal pannello Schedito. Non sostituire identificatori o URL con valori provenienti da altri calendari o vecchie guide.
La ripetizione di CSS e JavaScript è specifica dell'integrazione Wix basata su iframe e non rappresenta la nostra raccomandazione generale per i normali siti web.
Dentro l'elemento Wix Embed HTML
Assegna all'iframe spazio sufficiente
L'elemento HTML Wix ha dimensioni proprie. Il widget può adattarsi alla larghezza disponibile al suo interno, ma Wix continua a controllare le dimensioni complessive dell'iframe.
Imposta una larghezza adatta al layout e un'altezza sufficiente per l'intero processo di prenotazione. Se l'elemento è troppo basso, le fasi successive possono essere tagliate o richiedere uno scroll interno.
L'iframe è inoltre isolato dal punto di vista grafico. Il CSS del sito Wix non modifica automaticamente Schedito. Utilizza quindi temi chiari o scuri e personalizzazione direttamente nelle impostazioni Schedito.
Integrazioni Wix avanzate: Custom Elements
Wix supporta anche Custom Elements basati sullo standard Web Components. Possono offrire un'integrazione più stretta rispetto al normale iframe e sono utili quando servono componenti riutilizzabili o una maggiore integrazione con la pagina.
Schedito attualmente non richiede e non fornisce un Custom Element Wix dedicato per la normale installazione descritta in questa guida. La sua realizzazione è quindi un'integrazione avanzata per sviluppatori.
Se devi utilizzare molti widget Schedito nello stesso sito Wix, un wrapper Custom Element riutilizzabile può diventare interessante.
Quale soluzione scegliere?
Uno o pochi widget
Utilizza Embed HTML: è il percorso più semplice.
Integrazione avanzata o molti widget
Valuta un Custom Element Wix sviluppato appositamente.
4. Pubblica e prova l'intero processo
Controlla il widget, le dimensioni dell'iframe e la prenotazione risultante, non soltanto la presenza dell'elemento nella pagina.
Prova il sito pubblicato
Prova la pagina Wix pubblicata e non soltanto l'editor o l'anteprima. Verifica che il widget venga caricato completamente.
Completa una prenotazione
Scegli servizio, data e orario e completa il processo. Controlla poi la prenotazione nel pannello Schedito.
Controlla desktop e mobile
Verifica sia il layout del widget sia le dimensioni dell'elemento Wix nei breakpoint responsive utilizzati dal sito.
Risoluzione problemi del widget Wix
Controlla tutti e tre gli elementi all'interno del codice Wix: link CSS Schedito, script JavaScript e DIV specifico del calendario.
Verifica gli identificatori di organizzazione e calendario pubblico e controlla gli strumenti sviluppatore del browser per richieste fallite.
È il comportamento previsto quando il DIV si trova in un normale Embed HTML Wix. L'embed viene eseguito in un iframe separato, mentre Custom Code agisce sulla pagina esterna.
Per l'integrazione iframe semplice, inserisci CSS, JavaScript e DIV insieme nello stesso elemento embed.
Aumenta l'altezza dell'elemento HTML Wix. Il layout Wix controlla le dimensioni dell'iframe, quindi anche un widget correttamente renderizzato può essere tagliato se il contenitore è troppo basso.
L'integrazione Wix probabilmente funziona. Controlla Schedito: servizio, risorse richieste, disponibilità ricorrente, eccezioni, prenotazioni, capacità e impegni nei calendari esterni collegati.
È normale con un iframe HTML. Il documento Schedito incorporato è isolato dagli stili della pagina Wix esterna.
Configura tema chiaro o scuro, colori e altre proprietà direttamente in Schedito.
Controlla entrambi i livelli: Schedito si adatta alla larghezza disponibile dentro l'iframe, mentre Wix controlla larghezza e altezza dell'elemento embed. Regola l'elemento nei breakpoint necessari e riprova il sito pubblicato.
Lascia a Wix il sito e a Schedito le prenotazioni
Quando il widget funziona, continua a gestire servizi, risorse, disponibilità, capacità, sincronizzazione calendari e stile direttamente in Schedito.
Tutte le guide Schedito · Personalizzazione widget · Sincronizzazione Google Calendar