Personalizzazione visiva

Il widget viene servito isolato dal suo sito (i suoi stili non si mescolano con quelli della sua pagina), quindi la personalizzazione si effettua dal pannello e con l'opzione theme, non riscrivendo il suo CSS interno.

Dal pannello (consigliato)

In Widget → Personalizzazione può regolare, senza toccare codice:

• Colore del marchio: colore principale di pulsanti, selezione e accenti
• Colore di accento: colore secondario
• Titolo del widget: intestazione vista dai suoi clienti
• Descrizione del widget: testo introduttivo

Queste impostazioni si applicano sia al widget incorporato sia al link diretto e all'iframe.

Colore dal codice

Oltre al pannello, può fissare il colore principale nella chiamata a init() con theme:

ReservaHamacas.init({
  clientId: 'IL_SUO_CLIENT_ID',
  container: '#reserva-hamacas',
  theme: {
    primaryColor: '#059669',  // Colore principale
    accentColor: '#F59E0B'    // Colore di accento
  }
});
Seleziona per copiare

Utilizzi qualsiasi colore in formato esadecimale. Il colore principale si applica a:

• Pulsanti principali
• Lettini selezionati
• Link e accenti

Il contenitore è suo

Anche se l'interno del widget è isolato, il <div> contenitore si trova nella sua pagina, quindi può controllarne dimensioni, margini e posizione con il proprio CSS:

#reserva-hamacas {
  max-width: 900px;
  margin: 0 auto;   /* centrato */
  padding: 1rem;
}
Seleziona per copiare

Cosa NON si può fare

Per mantenere il widget stabile su qualsiasi sito, non vengono esposte classi interne da sovrascrivere (tipografie, colori di ogni elemento, bordi, ecc.). Se ha bisogno di una modifica visiva non coperta né dal pannello né da theme, ci scriva dal Centro assistenza e la valuteremo.

Consigli

• Mantenga il contrasto: si assicuri che il colore del marchio lasci i testi leggibili
• Verifichi su mobile: la maggior parte delle prenotazioni arriva da smartphone
• Coerenza: usi i colori del suo marchio affinché il widget sembri parte del suo sito

Prossimo passo

Riveda l'installazione del widget o torni alla documentazione tecnica.