Come aggiungere Koalendar a un sito Unbounce
Integra la pianificazione senza sforzo in qualsiasi landing page di Unbounce con un semplice copia e incolla. Non sono necessarie integrazioni aggiuntive: tutto ciò che ti serve è già disponibile in Koalendar e Unbounce.
📑 Menu
- 📋 Passaggio 1 – Copia il codice di incorporamento
- 📝 Passaggio 2 – Incollalo in Unbounce
- 🛠️ Risoluzione dei problemi
- 🤔 Quale stile di incorporamento dovresti usare?
📋 Passo 1 – Copia il tuo codice di incorporamento
- Nella Dashboard di Koalendar, fai clic su Condividi accanto alla pagina di prenotazione che desideri incorporare.
- Seleziona Aggiungi al sito web.
- Scegli uno stile di incorporamento e clicca su «Copia codice».
| Stile di incorporamento | Cosa fa |
|---|---|
| Incorporamento in linea 🖥️ | Visualizza il calendario delle prenotazioni direttamente sulla pagina di destinazione. |
| Widget popup 📍 | Aggiunge un pulsante fluttuante "Prenota ora" che apre un popup del calendario. |
| Finestra a comparsa al clic 🔗 | Trasforma qualsiasi link o pulsante in un calendario popup. |
💡 Personalizza colori, testo e posizione prima di copiare, in modo che il risultato si adatti al tuo design Unbounce.
📝 Passaggio 2 – Incollalo in Unbounce
Opzione A – Incorporamento in linea o finestra a comparsa al clic 🔧
- Nel Page Builder di Unbounce, trascina un blocco HTML nella pagina in cui desideri che appaia il calendario (o il trigger del popup).
- Fai doppio clic sul blocco per aprire l'editor HTML personalizzato.
- Incolla il codice Koalendar che hai copiato.
- Salva il codice, quindi visualizza l'anteprima o pubblica la pagina.
Opzione B – Widget a comparsa (pulsante mobile) 📌
- Apri la tua pagina nel Page Builder di Unbounce e clicca sulla scheda "Javascripts " (in basso a sinistra).
- Fai clic su Aggiungi script, quindi assegnagli un nome come “Koalendar Widget”.
- Incolla il codice del widget di Koalendar e imposta Posizionamento su Prima del tag di chiusura del corpo.
- Fatto → Anteprima o Pubblica. Il pulsante mobile ora compare su tutte le varianti di quella pagina.
📝 Ti serve un widget per tutto il sito? Aggiungi lo stesso script a ogni pagina di destinazione oppure duplica la pagina una volta installato il widget.
🛠️ Risoluzione dei problemi
| Problema | Soluzione rapida |
| Il calendario non si carica in Anteprima | Pubblica la pagina: alcuni script funzionano solo sull'URL live. |
| Il widget non viene visualizzato dopo l'incollaggio | Assicurati che lo script sia posizionato prima del tag di chiusura del corpo (non nell'intestazione). |
| Il link a comparsa viene visualizzato ma non si apre | Conferma che sia lo snippet del link che lo script di Koalendar si trovino sulla stessa pagina. |
| Il layout sembra un po' affollato | Aumenta la larghezza/altezza del blocco HTML o regola il padding nelle impostazioni di incorporamento di Koalendar. |
🤔 Quale stile di incorporamento dovresti usare?
| Obiettivo | Miglior stile |
| Sezione dedicata alle prenotazioni | Incorporamento in linea 🖥️ |
| CTA sempre visibile | Widget popup 📍 |
| Aggiungi la pianificazione a un pulsante esistente | Finestra a comparsa al clic 🔗 |
| Collegamento rapido esterno | Link diretto ↗️ |