Il widget di embed è uno snippet JavaScript che incolli nel tuo sito esistente. Renderizza il calendario delle lezioni del tuo studio direttamente sulla tua pagina, con piena funzionalità di prenotazione, senza che gli studenti lascino il tuo sito.
Funzione del piano Premium. I piani Pro e free non hanno accesso; passa al piano superiore se la vuoi.
Perché usare il widget di embed
Gli studi con il proprio sito (yourstudio.com) tipicamente vogliono che gli studenti prenotino sul proprio sito per motivi di brand. Senza il widget, la scelta è:
- Mandare gli studenti su MoveMentors. Si perde il branding, gli studenti possono rimbalzare.
- Costruire il proprio sistema di prenotazione. Costoso, complicato, richiede mesi.
- Usare il widget. Setup di 5 minuti, flusso di prenotazione completo dentro il tuo sito.
Il widget renderizza lo stesso flusso di prenotazione del sito MoveMentors (filtri, card lezione, sidebar di prenotazione, pagamento) ma dentro un iframe sul tuo sito. La prenotazione è registrata come prenotazione MoveMentors; lo studente riceve l'email da MoveMentors; gestisci le prenotazioni nella tua solita dashboard.
Come appare
Alcune modalità di rendering predefinite:
- Vista lista: un elenco verticale di lezioni in arrivo. Migliore per "tutte in arrivo" su una pagina di prenotazione dedicata.
- Vista griglia: una griglia a 2 o 3 colonne di card di lezione.
- Lezione singola: solo una lezione specifica, con la sidebar di prenotazione inline.
- Vista calendario: un calendario settimanale o mensile con blocchi di lezione. Migliore per studi con calendari fitti.
Scegli la modalità nella configurazione del widget. Puoi avere più widget sullo stesso sito (es. una lezione in evidenza sulla homepage, una lista completa su /book).
Configurazione
Vai su /studio/settings/embed
La pagina di impostazioni del widget di embed.
Scegli una modalità del widget
Lista, griglia, lezione singola o calendario.
Configura i filtri
Filtra opzionalmente la vista incorporata su location, categorie o insegnanti specifici. Per esempio, "mostra solo lezioni alla location di Brooklyn" o "mostra solo yoga, non pilates".
Personalizza lo stile
Il widget eredita un look predefinito. Puoi sovrascrivere:
- Colore primario (corrispondente al tuo brand).
- Famiglia di font.
- Raggio dei bordi.
- Densità di spaziatura.
- Modalità scura (se il tuo sito è scuro).
Le variabili CSS ti permettono di fare la maggior parte delle personalizzazioni senza scrivere codice.
Copia lo snippet
La pagina genera uno snippet tipo:
<script src="https://movementors.com/embed.js" data-studio="your-slug" data-mode="list" async></script> <div id="movementors-embed"></div>Incolla entrambe le righe nell'HTML del tuo sito dove vuoi che il widget si renderizzi.
Verifica sul tuo sito
Carica il tuo sito in un browser. Il widget dovrebbe apparire in 1-2 secondi.
Se non appare, vedi Widget di embed non si carica.
Dove metterlo
Alcuni posizionamenti comuni:
- Una pagina dedicata /book o /schedule. La più comune. Dimensionata per adattarsi all'area di contenuto del tuo sito.
- La homepage in una sezione "lezioni in evidenza". Una griglia di 3-6 lezioni in arrivo.
- Pagine promozionali di singole lezioni. Un widget inline a lezione singola "Prenota questo workshop".
- Un pulsante sticky fluttuante. "Prenota una lezione" che espande al widget al click.
Il widget è responsive; si adatta alla larghezza del contenitore.
Cosa succede quando uno studente prenota via widget
Il flusso di prenotazione è identico al prenotare su MoveMentors direttamente:
- Lo studente sceglie una lezione e una sessione.
- Lo studente compila la sidebar di prenotazione (posti, partecipanti, metodo di pagamento, ecc.).
- Lo studente paga (Stripe Checkout si apre in una nuova tab; i metodi manuali funzionano allo stesso modo).
- La conferma appare nel widget.
- Lo studente riceve un'email di conferma prenotazione da MoveMentors.
La prenotazione è registrata in MoveMentors. La vedi nella tua dashboard normale su /studio/bookings. I pagamenti Stripe vanno al tuo account Stripe Connect esattamente come se lo studente avesse prenotato su MoveMentors direttamente.
Il widget è solo un layer UI. I dati e la logica di business sono gli stessi del resto della piattaforma.
Tracciare le prenotazioni dal widget
La dashboard etichetta ogni prenotazione con la sua fonte: "Web" (MoveMentors direttamente), "Embed" (tramite il tuo widget), "MCP" (tramite un assistente AI), "Walk-in" (aggiunta manualmente).
Filtra l'elenco prenotazioni per fonte per vedere "tutte le prenotazioni arrivate via il mio sito". Utile per misurare l'impatto del widget.
Puoi anche configurare Google Analytics / event tracking simile sul widget; emettiamo eventi standardizzati (widget_loaded, class_viewed, booking_started, booking_completed) che la tua analytics può catturare.
Sicurezza ed embedding
Il widget gira in un iframe sotto il cofano. Questo isola il JavaScript del tuo sito da quello di MoveMentors (si applicano le protezioni di scripting cross-frame).
Usiamo il sandboxing sull'iframe con sandbox="allow-scripts allow-popups allow-popups-to-escape-sandbox", senza allow-same-origin. Il widget non può leggere i cookie sul tuo sito né tentare altri trucchi cross-origin.
CSP-friendly: se il tuo sito ha una Content-Security-Policy stretta, devi consentire movementors.com in frame-src e script-src.
Branding e personalizzazione
Il widget può essere stilato per adattarsi al tuo sito. Variabili CSS che puoi sovrascrivere:
--mm-primary-color: il colore di bottoni e accenti.--mm-font-family: il carattere.--mm-border-radius: gli angoli.--mm-spacing-unit: la densità.--mm-card-shadow: la profondità delle card.
Per personalizzazioni più profonde (layout diversi, logica personalizzata), vedi Widget di embed avanzato.
Cosa non puoi fare via widget
- Campi di prenotazione personalizzati oltre a ciò che MoveMentors supporta.
- Regole di pricing personalizzate (es. codici sconto specifici del sito che non esistono su MoveMentors).
- Nascondere conferme di prenotazione / ricevute (MoveMentors continua a inviarle).
Sono vincoli a livello di piattaforma; il widget è una UI sottile sopra il flusso di prenotazione standard.
Domande frequenti
Posso usare il widget senza essere su Premium? No. Funzione solo Premium.
Il widget rallenterà il mio sito?
Il widget si carica in modo asincrono (attributo async sul tag script). Non blocca il rendering della pagina. Il rendering iniziale richiede circa 1-2 secondi; gli utenti vedono uno scheletro placeholder durante quel tempo.
Posso incorporare su più siti? Sì. Lo stesso snippet funziona su qualsiasi numero di siti. Ogni prenotazione torna comunque all'account MoveMentors del tuo studio.
Posso personalizzare il widget per uso white-label (con un logo personalizzato, brand completamente diverso)? L'indicatore "powered by MoveMentors" è richiesto di default. Potremmo aggiungere un'opzione white-label per clienti enterprise; al momento non disponibile.
Il widget incorporato funziona su Squarespace / Wix / ecc.? Sì. La maggior parte dei costruttori di siti no-code permette blocchi di embed HTML personalizzati. Incolla lo snippet in uno di quei blocchi.
Prossimi passi
- Widget di embed avanzato per personalizzazioni più profonde.
- Piani di abbonamento per studi: il piano che lo sblocca.