Installazione del widget

Il widget di prenotazione permette ai suoi clienti di prenotare direttamente dal suo sito web.

Ottenere il codice

Vada su Widget → Codice nel menu laterale
Scelga la scheda di integrazione (Standalone è quella consigliata)
Clicchi su Copia codice — il suo clientId univoco è già incluso

Opzione 1: Standalone (consigliata)

È l'integrazione più rapida e leggera. Incolli questo codice nel suo sito, nel punto in cui desidera che appaia il widget:

<!-- Widget di Reserva de Hamacas (Standalone) -->
<div id="reserva-hamacas"></div>
<script src="https://cdn.reservadehamacas.com/widget/embed.js"></script>
<script>
  document.addEventListener('DOMContentLoaded', function () {
    ReservaHamacas.init({
      clientId: 'IL_SUO_CLIENT_ID',
      container: '#reserva-hamacas',
      locale: 'it',
      theme: {
        primaryColor: '#3B82F6'
      },
      onReservationComplete: function (data) {
        console.log('Prenotazione completata:', data);
        // Il suo codice qui (analitica, redirect, ecc.)
      },
      onError: function (error) {
        console.error('Errore:', error);
      }
    });
  });
</script>
Seleziona per copiare

Non deve inserirlo nell'<head>: lo <script> va accanto al <div> e il widget si avvia da solo al caricamento della pagina.

Il colore principale e i testi del widget si configurano da Widget → Personalizzazione nel pannello. Il primaryColor del codice è opzionale e funge da rinforzo.

Opzione 2: Iframe (semplice)

Se la sua piattaforma non consente di eseguire script, usi un iframe. È l'opzione più compatibile:

<!-- Widget di Reserva de Hamacas (Iframe) -->
<iframe
  src="https://reservadehamacas.com/embed/IL_SUO_CLIENT_ID"
  width="100%"
  height="900px"
  style="border: none; border-radius: 12px; box-shadow: 0 4px 6px rgba(0,0,0,0.1);"
  title="Prenoti il suo lettino"
  allow="payment"
></iframe>
Seleziona per copiare

L'attributo allow="payment" è indispensabile perché i pagamenti funzionino all'interno dell'iframe.

Opzione 3: Link diretto

Invii i suoi clienti direttamente alla pagina di prenotazione, senza installare nulla:

https://reservadehamacas.com/la-sua-azienda
Seleziona per copiare

Se non ha ancora configurato l'URL personalizzato della sua azienda, usi il link con il suo identificativo:

https://reservadehamacas.com/embed/IL_SUO_CLIENT_ID
Seleziona per copiare

Lo utilizzi in:

Email
Social network
Codici QR stampati

Widget per condomini

Se il suo piano include il widget per condomini (prenotazioni interne, senza prezzi né pagamenti), lo script e l'oggetto globale sono diversi:

<div id="reserva-hamacas"></div>
<script src="https://cdn.reservadehamacas.com/widget/embed-community.js"></script>
<script>
  document.addEventListener('DOMContentLoaded', function () {
    ReservaHamacasCommunity.init({
      clientId: 'IL_SUO_CLIENT_ID',
      container: '#reserva-hamacas',
      locale: 'it'
    });
  });
</script>
Seleziona per copiare

Integrazioni specifiche

WordPress

Installi il plugin "Insert Headers and Footers" (o simile)
Incolli il codice del widget nella sezione del footer
Crei una nuova pagina per le prenotazioni
Aggiunga il <div> del contenitore

Può anche usare un blocco HTML personalizzato nell'editor a blocchi.

Wix

Vada all'editor del suo sito
Aggiunga un elemento "Incorpora" > "HTML personalizzato"
Incolli il codice completo del widget
Regoli le dimensioni del contenitore

Squarespace

Vada alla pagina dove desidera il widget
Aggiunga un blocco di "Codice"
Incolli il codice del widget
Salvi e pubblichi

Shopify

Vada su Negozio online > Pagine
Crei una nuova pagina
Passi all'editor HTML
Incolli il codice del widget

Verificare l'installazione

Visiti la pagina in cui ha installato il widget
Dovrebbe vedere il calendario delle prenotazioni
Provi a effettuare una prenotazione di prova

Risoluzione dei problemi

Il widget non appare

Verifichi che il clientId sia corretto
Controlli che il <div id="reserva-hamacas"> esista nell'HTML
Controlli la console del browser (F12) per eventuali errori

Il widget appare ma non carica i dati

Verifichi che il suo account sia attivo
Controlli di avere almeno una zona pubblicata
Controlli di avere lettini disponibili

Errore CORS

Il widget deve essere caricato da un dominio pubblico
Non funziona aprendo il file HTML direttamente (file://)

Requisiti tecnici

Requisito	Minimo
Larghezza del sito	400px (altezza consigliata 800px)
JavaScript	Abilitato
HTTPS	Consigliato
Browser	Chrome, Firefox, Safari, Edge (ultime 2 versioni)

Prossimo passo

Impari a personalizzare il widget con le sue opzioni di configurazione.