Incorporare Microsoft Bookings (Teams Virtual Appointments) nel tuo sito web: guida completa 2025

Vuoi offrire ai clienti un calendario “prenota‑da‑solo” direttamente sul tuo sito? In questa guida aggiornata al 2025 ti mostro come incorporare Microsoft Bookings (oggi disponibile come app in Microsoft 365, Teams e Outlook) con un semplice iframe, cosa è cambiato, limiti, sicurezza e best practice.

Indice

Panoramica 2025: cosa è cambiato davvero

Nel 2024‑2025 Microsoft ha razionalizzato l’esperienza di prenotazione: l’app Virtual Appointments per Teams è stata ritirata il 30 giugno 2025. Oggi l’entry‑point principale per pubblicare e gestire le pagine di prenotazione è Microsoft Bookings, accessibile dal web, da Outlook e come app dentro Teams. L’embed via iFrame rimane supportato.

Soluzione in breve (settembre 2025)

Sì, puoi incorporare la pagina di prenotazione condivisa (Shared/Team booking page) di Microsoft Bookings in qualunque sito che consenta iFrame.
No, la pagina personale “Book with me” (Outlook) non offre un pulsante Embed: si condivide come link o firma email.
All’interno di Microsoft 365 o dell’app Bookings in Teams, pubblica la pagina, quindi copia l’iframe e incollalo nel tuo sito.
Per SharePoint Online, usa la web‑part Embed e consenti il dominio outlook.office365.com (e/o outlook.office.com) in HTML Field Security.

Quale pagina si può incorporare e dove trovare l’iframe

Scenario	Si può incorporare?	Come recuperare il codice iFrame
Shared / Team booking page (app Microsoft Bookings sul web o dentro Teams)	Sì	Apri Microsoft Bookings → scegli la pagina → scheda Booking page → sezione Publish → Embed → copia l’iframe. (In Teams: apri l’app Bookings e segui gli stessi passaggi).
Bookings web app (portale Microsoft 365)	Sì	Microsoft 365 → Bookings → Booking page → Publish/Embed. L’iframe è generato automaticamente.
“Book with me” (pagina personale in Outlook)	No (solo link condivisibile)	Condividi il link via email, firma o social. Non è previsto un pulsante Embed.

Guida passo‑passo: pubblica e incorpora da Bookings

Dal web (Microsoft 365)

Vai a Microsoft Bookings dalla app launcher di Microsoft 365.
Seleziona la Shared booking page (o creane una nuova) e apri la scheda Booking page.
In Publish, attiva Publish booking page e clicca Embed.
Copia il codice iFrame generato e incollalo nella pagina del tuo sito.

Dentro Microsoft Teams (app Bookings)

Apri Microsoft Teams e aggiungi l’app Bookings dalla barra laterale (se non è già pinnata).
Apri la pagina di prenotazione condivisa, vai su Booking page → Publish → Embed e copia il codice.
Incolla l’iFrame nel tuo CMS.

Nota importante: l’app Virtual Appointments non è più disponibile in Teams; usa l’app Bookings per pubblicare e embedded la pagina.

Snippet iFrame consigliato

&lt;iframe
  src="https://outlook.office365.com/owa/calendar/tenant@domain/bookings/"
  width="100%"
  height="800"
  style="border:0"
  scrolling="yes"&gt;
&lt;/iframe&gt;

Incolla il frammento nel punto della pagina dove deve apparire il calendario.
SharePoint Online: usa la web‑part Embed e consenti il dominio outlook.office365.com (o outlook.office.com) in Impostazioni → HTML Field Security.
Se il browser mostra “refused to connect”, verifica le policy di sicurezza (X‑Frame‑Options, frame‑ancestors nella CSP) oppure whitelista i domini Microsoft nel tuo CMS.

Versione responsive (consigliata)

Per migliorare la resa su mobile, racchiudi l’iFrame in un contenitore fluido:

<div class="bkng-embed-wrap">
  <iframe src="https://outlook.office365.com/owa/calendar/tenant@domain/bookings/"
          loading="lazy" style="border:0" width="100%" height="800"
          scrolling="yes"></iframe>
</div>

Integrazione con SharePoint Online

Aggiungi una web‑part Embed nella pagina moderna.
Incolla l’iFrame generato da Bookings.
Se vedi l’avviso “embedding content from this website isn’t allowed”, apri Impostazioni sito → HTML Field Security e seleziona:
- Allow contributors to insert iframes only from the following domains
- Aggiungi outlook.office365.com e/o outlook.office.com

Queste impostazioni sono necessarie perché SharePoint limita per default l’embedding di domini esterni.

Requisiti, limiti e aspetti da conoscere

Aspetto	Dettagli
Licenze	Microsoft Bookings è incluso (al 2 aprile 2025) in molte sottoscrizioni: Office 365 A3/A5/E1/E3/E5/F1/F3 e Microsoft 365 A3/A5/E1/E3/E5/F1/F3/Business Basic/Business Standard/Business Premium, oltre a Teams Essentials/Premium per alcune funzionalità. La disponibilità dipende anche dalle impostazioni dell’amministratore.
Branding/URL	L’iFrame punta al dominio `outlook.office365.com` (o `outlook.office.com`). Puoi scegliere il dominio email usato nella URL della pagina (es. `@contoso.com` invece di `@tenant.onmicrosoft.com`) tramite policy/OWA, ma non puoi sostituire l’host Microsoft con un tuo dominio senza reverse proxy.
Sicurezza	Per siti pubblici abilita i controlli di accesso in Booking page: puoi richiedere un codice OTP (One‑Time Password) all’email dell’utente prima di confermare la prenotazione, riducendo lo spam.
Alternative avanzate	Con Microsoft Graph puoi generare link di prenotazione/partecipazione a Virtual Appointments (GetVirtualAppointmentJoinWebUrl) e/o usare le Bookings API per creare servizi, staff e appuntamenti in modo programmatico — utile per un front‑end personalizzato.
Widget esterni	Soluzioni come SociableKit offrono wrapper con opzioni estetiche aggiuntive (layout, stile) sopra l’iFrame ufficiale. Valutale se vuoi un look‑and‑feel diverso senza sviluppare codice.

Best practice operative

Pubblica solo i servizi necessari per ridurre il tempo di caricamento del widget.
Personalizza domande e notifiche (scheda Booking page): raccogli le informazioni pertinenti, pre‑qualifica i clienti e riduci i no‑show con reminder email/SMS (alcune funzioni richiedono Teams Premium).
Responsive design: usa contenitori con max-width:100% e altezze dinamiche per dispositivi piccoli.
Monitoring: testa periodicamente l’embed dopo aggiornamenti del CMS o policy di sicurezza Microsoft per prevenire regressioni.

Risoluzione dei problemi

“`outlook.office365.com refused to connect`”

Controlla che la pagina sia pubblicata e che tu stia usando la URL completa dell’embed.
Verifica policy del tuo sito: X‑Frame‑Options e Content‑Security‑Policy (frame‑ancestors) non devono bloccare l’iFrame.
Se sei in SharePoint, consenti il dominio Microsoft nelle impostazioni HTML Field Security.
Alcuni CMS/host applicano hardening che può interrompere l’embed; consulta la documentazione del tema/plugin o il supporto del provider. Segnalazioni simili sono comuni nelle community tecniche.

L’embed non appare in SharePoint

Usa la web‑part Embed (non la Link o Hero).
Conferma la whitelist dei domini outlook.office365.com / outlook.office.com.

Spam/fake booking

Abilita l’opzione one‑time passcode nella sezione Access control della pagina di prenotazione.
Se necessario, limita la pagina a utenti autenticati dell’organizzazione e pubblica un modulo pubblico separato per raccogliere richieste.

Esempi di layout e UX

Contenitore con rapporto 16:9

<div class="bkng-embed-16x9">
  <div class="bkng-embed-inner">
    <iframe src="https://outlook.office365.com/owa/calendar/tenant@domain/bookings/"
            title="Prenotazione appuntamenti"
            allow="clipboard-write; fullscreen"
            loading="lazy" scrolling="yes"></iframe>
  </div>
</div>

Accessibilità

Aggiungi title descrittivo all’iFrame (es. “Prenotazione appuntamenti”).
Garantisci contrasto sufficiente nei colori del tema scelto nella pagina Bookings.

Domande frequenti

Posso incorporare la pagina “Book with me”?
No. La pagina personale in Outlook si condivide tramite link (inclusa la firma) ma non espone un pulsante Embed. Usa invece una Shared booking page.

Posso mascherare completamente la URL Microsoft?
No: l’host resta outlook.office365.com/outlook.office.com. Puoi però usare il tuo dominio come parte dell’indirizzo email nella URL configurando le policy di dominio per Bookings.

Esiste ancora Virtual Appointments in Teams?
L’app dedicata è stata ritirata il 30 giugno 2025. Le funzionalità di scheduling rimangono in Microsoft Bookings, accessibile anche dentro Teams.

Posso costruire un front‑end su misura, senza iFrame?
Sì. Con Microsoft Graph (Bookings API e Virtual Appointments join link) puoi generare appuntamenti e URL di partecipazione, quindi realizzare una UX personalizzata.

Checklist di messa in produzione

Hai pubblicato la pagina e testato l’iFrame in un ambiente staging?
Il tuo CMS consente iFrame dal dominio Microsoft richiesto?
Hai attivato Access control (OTP) e rivisto le domande personalizzate?
Hai verificato la resa su mobile e l’accessibilità (titoli, contrasto)?
Hai definito un processo di monitoraggio (alert sul traffico, controllo periodico del caricamento)?

Conclusioni

Nel 2025, Microsoft Bookings è il modo supportato per offrire un calendario “prenota‑da‑solo” e si può incorporare via iFrame in pochi minuti.
Le voci di menu sono cambiate (ritiro di Virtual Appointments), ma il flusso resta semplice: pubblica la pagina → copia l’embed → incolla nel sito.
“Book with me” non supporta l’embed: condividi il link o inseriscilo nella firma email.
Attenzione a licenze, domini consentiti e policy di sicurezza (HTML Field Security in SharePoint) per un’integrazione senza errori.

Appendice tecnica

Dove trovo l’app Bookings? In Outlook o Teams, dalla barra laterale: App → cerca “Bookings” → Add/Pin.
Quali licenze servono? Vedi l’elenco aggiornato in Microsoft Learn (Office 365 A/E/F & Microsoft 365 Business/Enterprise).
OTPs & anti‑spam: proprietà enforceOneTimePassword su bookingPageSettings (Graph) e toggle nella UI di Bookings.
API & personalizzazioni: Bookings API per servizi/staff, GetVirtualAppointmentJoinWebUrl per link di partecipazione.