Come integrare Koalendar in Webflow
Aggiungi la prenotazione immediata a qualsiasi progetto Webflow: basta copiare il codice di incorporamento di Koalendar → incollarlo in Webflow → pubblicare. Nessun plugin, nessuna chiave API.
📑 Menu
- Passaggio 1 – Copia il tuo codice Koalendar
- Passaggio 2 – Incollalo in Webflow
- Risoluzione dei problemi
- Quale modello dovrei scegliere?
👉 Passaggio 1 – Copia il tuo codice Koalendar
- Nella dashboard di Koalendar, clicca 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 incorporato | Cosa vedono i visitatori |
|---|---|
| Incorporamento in linea 🖥️ | Calendario completo visualizzato direttamente sulla pagina. |
| Widget a comparsa 📍 | Pulsante fluttuante che apre il calendario in una finestra a comparsa. |
| Testo/pulsante a comparsa 🔗 | Qualsiasi link o pulsante presente sulla tua pagina apre il calendario in una finestra a comparsa. |
➕ Vuoi semplicemente un link normale? Salta l'incorporamento, copia l'URL di condivisione di Koalendar e crea un collegamento ipertestuale a qualsiasi testo, immagine o pulsante per aprire il tuo calendario in una nuova scheda.
🎨 Consiglio di progettazione: personalizza colori, testo e posizione in Koalendar prima di copiare, in modo che tutto si adatti allo stile del tuo Webflow.
📝 Passaggio 2 – Incollalo in Webflow
A. Testo o pulsante incorporato o a comparsa (elemento incorporato)
- Nel Webflow Designer, apri la pagina in cui desideri inserire il calendario o il trigger.
- Trascina un elemento"Incorpora codice " da + Aggiungi → Elementi nella posizione desiderata.
- Clicca su " Modifica codice personalizzato " e incolla il tuo codice Koalendar.
- Salva e chiudi → Pubblica il tuo sito.
B. Widget a comparsa (pulsante mobile in tutto il sito)
- Vai su Impostazioni progetto → Codice personalizzato → Codice piè di pagina.
- Incolla lo script del widget Koalendar.
- Salva modifiche → Pubblica.
⏳ Attenzione: il codice personalizzato viene eseguito solo sul sito pubblicato, non nell'anteprima di Designer.
🛠️ Risoluzione dei problemi
| Problema | Soluzione rapida |
| Il calendario o il widget non vengono visualizzati in Designer | Pubblica il sito e visualizza l'URL live: gli script non vengono eseguiti nell'area di lavoro di Designer. |
| Il widget a comparsa non viene visualizzato | Verifica che lo script sia inserito nel codice del piè di pagina (o in un elemento «Embed») e ripubblica. |
| Il testo del popup o il link del pulsante vengono visualizzati ma non si aprono | Assicurati che sia lo snippet di attivazione che lo script di Koalendar si trovino sulla stessa pagina. |
| L'altezza del calendario incorporato sembra sbagliata | Ridimensiona l'elemento «Embed» o imposta un'altezza fissa in Koalendar prima di copiarlo. |
😕 Quale modello dovrei scegliere?
| Obiettivo | Il miglior stile |
| Sezione dedicata alle prenotazioni | Incorporamento in linea 🖥️ |
| Invito all'azione su tutto il sito | Widget a comparsa 📍 |
| Aggiungi una pianificazione a un CTA esistente | Testo/pulsante a comparsa 🔗 |
| Collegamento rapido esterno | Semplice collegamento ipertestuale all'URL del tuo Koalendar |