Incorporare i widget
Perché un'integrazione compaia sul tuo sito web, inserisci il suo codice nel sito. Questa pagina mostra dove trovi il codice, come è strutturato e cosa fare se il widget non si carica. Come si costruisce un'integrazione è spiegato in Creare e modificare un'integrazione.
Copiare il codice di un'integrazione
- Apri Manager → Integrazione del sito web.
- Tocca la scheda dell'integrazione e scegli Copia il codice. Sul telefono trovi Copia il codice anche dentro l'integrazione, sotto l'elenco dei blocchi.
- Nella finestra Codice di incorporamento tocca Copiare. Compare «Codice embed copiato negli appunti».
Nella stessa finestra trovi la Lingua del widget (la lingua della tua pagina di prenotazione), il Colore principale e dove porta un clic su un'offerta (Cliccando su un'offerta si apre, predefinito: Pannello informativo (standard)).
Com'è strutturato il codice
Il codice ha questo aspetto, con l'identificativo del tuo studio e della tua integrazione:
<!-- Bookicorn Widget -->
<script src="https://app.bookicorn.net/widget/loader.js" async defer></script>
<bookicorn-widget studio="tuo-studio" integration="tua-integrazione"></bookicorn-widget>
<a class="bookicorn-credit" href="https://www.bookicorn.net" target="_blank" rel="noopener">Powered by Bookicorn</a>
- Lo
<script>carica il widget. Non aspetta il resto della tua pagina. <bookicorn-widget>è il punto in cui compare il widget.- Il link «Powered by Bookicorn» fa parte del codice. Se lo rimuovi, il widget lo reinserisce da solo.
Il widget compare direttamente nella tua pagina, non in una cornice separata. I tuoi stili e quelli del widget non si influenzano a vicenda.
Inserire il codice in WordPress, Wix, Squarespace, Jimdo o Webflow
Inserisci il codice completo nel punto del tuo sito in cui deve comparire il widget. Il tuo sistema per siti web deve offrire un elemento che accetti codice HTML personalizzato con JavaScript. A seconda del sistema si chiama «HTML», «Codice», «Embed» o «Incorpora»:
- WordPress: un blocco per HTML personalizzato, nell'editor a blocchi «HTML personalizzato».
- Wix: un elemento per incorporare codice personalizzato.
- Squarespace: un blocco di codice.
- Jimdo: un elemento per widget o HTML.
- Webflow: un elemento Embed.
- Sito web proprio: il codice direttamente nell'HTML della pagina.
Se il tuo sistema mostra il codice in un riquadro ad altezza fissa, imposta l'altezza in modo che il widget sia visibile per intero. Se il tuo sistema non permette di inserire codice personalizzato, metti semplicemente un link alla tua pagina di prenotazione.
Incorporare più widget in una pagina
Puoi incorporare più integrazioni nella stessa pagina. Inserisci per ogni integrazione il suo elemento <bookicorn-widget>. Lo <script> basta una volta per pagina.
Cosa possono fare i visitatori nel widget incorporato
- Vedere offerte, sessioni, pacchetti e trainer, tutto in tempo reale da Bookicorn.
- Cliccare su un'offerta: si apre una finestra informativa con Panoramica e Dettagli e Trainer.
- Prenota ora, acquisto di pacchetti, buoni e accesso: aprono la tua pagina di prenotazione in una nuova scheda. Al momento della prenotazione la sessione scelta è già selezionata.
La prenotazione vera e propria e il pagamento avvengono quindi sulla tua pagina di prenotazione, non nel tuo sito web.
Domini consentiti: far funzionare il widget solo sul tuo sito
In Misure → Domini consentiti dentro l'integrazione inserisci gli indirizzi su cui il tuo widget può funzionare, per esempio www.mio-studio.it, e tocchi Aggiungere. Poi Salva. Da quel momento il widget funziona solo su questi domini e sui loro sottoindirizzi. Su altri siti mostra «Domain nicht autorisiert» (messaggio fisso in tedesco).
Se non inserisci nessun dominio, Bookicorn non controlla l'indirizzo e il widget funziona su qualsiasi sito. L'avviso nel Manager («Senza voci il widget non funziona da nessuna parte.») al momento non è corretto.
Se rimuovi un dominio, il widget smette di funzionare lì. Per questo il Manager chiede prima conferma.
Misure lo trovi nell'integrazione, sotto l'elenco dei blocchi. Il Manager mostra questo elenco sul telefono e nelle finestre del browser strette.
Testo per l'informativa sulla privacy del tuo sito
Sotto il codice, nella finestra Codice di incorporamento, trovi la sezione Clausola per l'informativa sulla privacy. Descrive che la tua pagina incorpora il widget di Bookicorn, quali dati vengono trattati e che la prenotazione avviene sulla piattaforma di prenotazione. Tocca Copia clausola e inseriscila nella tua informativa sulla privacy.
Il widget non si carica o mostra un messaggio di errore
Al posto dei contenuti il widget mostra un messaggio:
| Messaggio | Causa | Soluzione |
|---|---|---|
| Widget non trovato | l'identificativo nel codice non è corretto, oppure l'integrazione è disattivata o eliminata | copia di nuovo il codice, riattiva l'integrazione con Attiva ora |
| Widget non disponibile | l'estensione Integrazione del sito web non è attiva | attiva l'estensione nel Negozio estensioni |
| Domain nicht autorisiert | il tuo sito non è tra i Domini consentiti | inserisci il dominio e tocca Salva |
| Il widget "…" sarà presto disponibile | il blocco non è ancora disponibile nel widget incorporato (Abbonamenti, Home membro, Profilo, Portafoglio) | rimuovi il blocco dall'integrazione |
Se non compare nulla, controlla:
- Hai inserito il codice completo, compreso lo
<script>? - Il tuo sistema per siti web permette JavaScript in questo elemento?
- Hai salvato l'integrazione dopo l'ultima modifica?
Domande frequenti
Dove trovo il codice per il mio sito? In Integrazione del sito web: tocca la scheda dell'integrazione, poi Copia il codice.
Devo reinserire il codice dopo ogni modifica? No. Dopo aver toccato Salva il widget mostra la versione aggiornata.
Posso rimuovere «Powered by Bookicorn»? Il link fa parte del codice. Se lo rimuovi, il widget lo reinserisce.
Il mio widget mostra «Domain nicht autorisiert». Inserisci il tuo sito in Misure → Domini consentiti oppure rimuovi lì tutte le voci, e tocca Salva.
Posso inserire il codice in Wix? Sì, con un elemento per incorporare codice personalizzato. Imposta un'altezza sufficiente per l'elemento.