> For the complete documentation index, see [llms.txt](https://docs.yoplanning.support/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.yoplanning.support/it/accademia-di-pianificazione/yoplanning-parametrage/module-de-reservation/integration-du-module-de-reservation/doc-technique-agence-web/introduction-doc-technique.md).

# Introduzione: documento tecnico

### Introduzione

Questa documentazione è destinata a sviluppatori e webmaster che desiderano integrare il modulo di prenotazione Yoplanning.pro nel proprio sito web. L'obiettivo è migliorare l'esperienza utente fornendo un'interfaccia di prenotazione accessibile e reattiva, consentendo al contempo la personalizzazione del modulo.

### Principio di funzionamento

Il modulo di prenotazione di Yoplanning.pro è progettato per integrarsi perfettamente con il tuo sito web, offrendo un'esperienza utente fluida e senza la necessità di reindirizzamenti. Il modulo si presenta come una finestra pop-up che si attiva tramite un pulsante o un link, consentendo agli utenti di effettuare prenotazioni direttamente sul tuo sito web.

#### Benefici

* **Visualizzazione ottimale**: si adatta a tutti i tipi di schermo, compresi quelli dei dispositivi mobili.
* **Integrazione semplice**: può essere aggiunto al tuo sito con un semplice pezzo di codice JavaScript.
* **Personalizzazione**: Generazione di link specifici per diverse azioni o categorie.

#### Integrazione tramite Iframe

Sebbene possibile, l'incorporamento tramite iframe non è consigliato a causa dei limiti di compatibilità con i dispositivi mobili. Se necessario, il modulo può essere aperto in una nuova scheda per un'esperienza a schermo intero.

#### Integrazione tramite Iframe: comportamento di scorrimento

Nella modalità iframe, per impostazione predefinita il modulo di prenotazione occupa tutta l'altezza possibile e lo scorrimento viene eseguito sul tuo sito, vedi screenshot qui sotto:

<figure><img src="/files/owsVDWdiVz2oP4qHxlm0" alt="" width="563"><figcaption><p>Comportement par défaut</p></figcaption></figure>

È possibile modificare questo comportamento aggiungendo il parametro `bescroll=inside` nell'URL di integrazione del modulo di prenotazione. Il modulo occuperà l'altezza dello schermo e lo scorrimento verrà eseguito nel modulo anziché sul tuo sito, come mostrato nello screenshot qui sotto:

<figure><img src="/files/VCBxe1MFHbUZSivjiymt" alt="" width="563"><figcaption><p>Avec le paramètre "bescroll=inside"</p></figcaption></figure>

### Codice di integrazione

Per incorporare il modulo, inserisci il seguente codice JavaScript nel tag `<header>` del tuo sito. Questo renderà il modulo accessibile su tutte le pagine senza dover inserimenti multipli.

```html
<script type="text/javascript" src="https://booking.yoplanning.pro/integration/script.js" async></script>
```

### Generazione di link al modulo di prenotazione

I link specifici per il modulo di prenotazione possono essere generati tramite il back office di Yoplanning:

1. Vai su **Impostazioni > Modulo di prenotazione > Menu integrazione**.
2. Utilizza la modalità URL per creare un URL adatto alle tue esigenze.

#### Esempi di link generati

* **Link generale**: `https://booking.yoplanning.pro/<ID_UNIQUE>/`
* **Categoria specifica**: `https://booking.yoplanning.pro/<ID_UNICO>/?tag=<ID_CATEGORIA>`
* **Scheda prodotto**: `https://booking.yoplanning.pro/<ID_UNIQUE>/product/<ID_PRODUIT>`
* **Accesso diretto al carrello**: `https://booking.yoplanning.pro/<ID_UNIQUE>/cart/`
* **Negozio diretto**: `https://booking.yoplanning.pro/<ID_UNIQUE>/shop/`

#### Opzioni di integrazione

Yoplanning offre diverse modalità di integrazione:

* **Pulsante**: Per l'accesso diretto tramite un pulsante cliccabile.
* **Icona mobile**: un'icona accessibile in qualsiasi momento sulla pagina.
* **Collegamento ipertestuale**: da incorporare nel testo o nelle immagini.
* **Iframe**: utilizzato come ultima risorsa, se JavaScript è soggetto a restrizioni.
* **URL semplice**: per l'integrazione diretta come collegamento.

### Gestione multilingue

Il modulo rileva automaticamente la lingua del browser dell'utente utilizzando il servizio esterno <https://gtranslate.io/detect-browser-language>, offrendo un'esperienza localizzata e intuitiva. *(Metodo consigliato nella maggior parte dei casi.)*

#### Lingua forzata per impostazione predefinita.

Se hai un sito web multilingue, hai problemi di rilevamento della lingua o vuoi forzare la visualizzazione del modulo in una lingua definita, puoi creare un modulo di prenotazione specifico forzando la lingua nella sua configurazione.

### Conclusione

L'integrazione del modulo di prenotazione Yoplanning.pro migliora significativamente l'esperienza di prenotazione sul tuo sito web, grazie all'interfaccia utente ottimizzata, alle opzioni di personalizzazione avanzate e al supporto multilingue. Segui le istruzioni fornite per un'integrazione di successo e per offrire ai tuoi utenti un'esperienza di prenotazione fluida.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.yoplanning.support/it/accademia-di-pianificazione/yoplanning-parametrage/module-de-reservation/integration-du-module-de-reservation/doc-technique-agence-web/introduction-doc-technique.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
