fb-pixel
Hotely Logo

Creare un sito

Guida passo-passo per creare il sito della tua struttura in pochi minuti, dalla scelta del template alla pubblicazione.

Dal nulla al tuo sito in meno di un'ora

Creare un sito web professionale per la tua struttura ricettiva non dovrebbe richiedere settimane di lavoro o migliaia di euro. Con il Website Builder di Hotely, puoi passare da zero a un sito pubblicato in meno di un'ora — senza scrivere una singola riga di codice e senza dover assumere uno sviluppatore.

Questa guida ti accompagna attraverso ogni passaggio, dalla creazione del progetto alla pubblicazione finale.

Prerequisiti

Prima di iniziare, assicurati di avere:

  • Un account Hotely attivo con un piano che include il Website Builder
  • Le informazioni base della tua struttura (nome, indirizzo, contatti)
  • Il logo della struttura in formato PNG o SVG (consigliato: almeno 400x400 pixel)
  • Alcune foto della struttura (camere, esterni, aree comuni)
Suggerimento

Suggerimento: non è necessario avere tutte le foto pronte. Puoi iniziare con poche immagini e aggiungerne altre in seguito. I template includono anche immagini segnaposto di alta qualità che puoi usare temporaneamente.

Passo 1: Accedere al Website Builder

  1. Accedi alla tua dashboard Hotely
  2. Nel menu laterale, seleziona Website Builder
  3. Clicca su Crea nuovo sito

Se è la prima volta che accedi al Website Builder, vedrai una breve procedura guidata che ti chiederà alcune informazioni sulla tua struttura. Queste informazioni verranno usate per pre-compilare i contenuti del template scelto.

Singola proprietà o multi-proprietà?

La prima scelta del form di creazione è tra due modalità:

  • Sito singola proprietà — un sito dedicato a una struttura. È la modalità classica, consigliata per hotel, B&B e singole case vacanza.
  • Sito multi-proprietà (portfolio) — un sito che aggrega più strutture (es. 5–20 appartamenti a indirizzi diversi) con ricerca disponibilità unificata.

Scegli multi-proprietà se gestisci più unità indipendenti sotto un brand comune. Il checkout resta comunque separato per ogni struttura — indispensabile per mantenere corrette le credenziali Alloggiati Web, ISTAT e la tassa di soggiorno del comune. Approfondisci nella guida dedicata Sito multi-proprietà.

Informazioni richieste nella procedura guidata

CampoDescrizioneObbligatorio
Nome strutturaIl nome commerciale della tua struttura
Tipo strutturaHotel, B&B, Agriturismo, Resort, etc.
IndirizzoIndirizzo completo con città e CAP
TelefonoNumero di telefono principale
EmailEmail di contatto
Descrizione breve1-2 frasi che descrivono la tua strutturaNo
LogoFile immagine del logoNo

Passo 2: Scegliere un template

La libreria di template è organizzata per tipologia di struttura. A differenza dei page builder generici che offrono template vaghi e multiuso, ogni template Hotely è stato progettato specificamente per un tipo di struttura ricettiva.

Categorie di template disponibili

  • Hotel classico: design elegante e istituzionale, ideale per hotel 3-5 stelle
  • Boutique hotel: layout moderno con grande enfasi sulle immagini e sull'atmosfera
  • B&B e affittacamere: design caldo e accogliente, con focus sulla personalità del gestore
  • Agriturismo: layout che valorizza il territorio, la natura e i prodotti locali
  • Resort e villaggi: design immersivo con sezioni dedicate ad attività ed esperienze
  • Residence e appartamenti: layout funzionale con focus sulla praticità e i servizi

Come scegliere il template giusto

  1. Sfoglia le anteprime: ogni template ha un'anteprima interattiva che puoi esplorare
  2. Verifica la versione mobile: clicca sull'icona smartphone per vedere come appare su dispositivi mobili
  3. Leggi la descrizione: ogni template indica per quale tipo di struttura è ottimizzato
  4. Non preoccuparti dei colori: potrai personalizzare ogni aspetto visivo dopo la selezione
Suggerimento

Suggerimento: scegli il template che meglio rappresenta la struttura delle pagine che desideri, non basarti sui colori o sulle immagini. Quelli li cambierai facilmente nel passaggio successivo.

Una volta scelto il template, clicca su Usa questo template. Il sistema creerà il tuo progetto e ti porterà nell'editor visuale.

Passo 3: Inserire le informazioni della struttura

Dopo aver selezionato il template, l'editor ti guiderà attraverso la compilazione delle informazioni principali. Se hai completato la procedura guidata iniziale, molti campi saranno già pre-compilati.

Sezione "Informazioni generali"

Compila o verifica i seguenti dati:

  • Nome della struttura: apparirà nell'header, nel footer e nei meta tag SEO
  • Slogan o tagline: una frase breve che cattura l'essenza della tua struttura (es. "Il tuo rifugio tra le colline toscane")
  • Descrizione: un testo più lungo per la homepage, 3-5 frasi che raccontano cosa rende unica la tua struttura
  • Contatti: telefono, email, indirizzo — verranno inseriti automaticamente nella pagina contatti e nel footer

Sezione "Immagini principali"

Carica le immagini che definiranno l'identità visiva del tuo sito:

  • Immagine hero: la foto principale che appare nella parte alta della homepage. Usa un'immagine orizzontale di alta qualità (minimo 1920x1080 pixel) che rappresenti al meglio la tua struttura
  • Logo: il logo della tua struttura. Formati supportati: PNG (con sfondo trasparente), SVG, JPG
  • Favicon: l'icona che appare nella barra del browser. Se non ne carichi una, verrà generata automaticamente dal logo
Suggerimento

Suggerimento: le immagini vengono ottimizzate automaticamente dal sistema. Non serve ridimensionarle o comprimerle prima del caricamento — Hotely si occupa di tutto, garantendo velocità di caricamento ottimale senza sacrificare la qualità visiva.

Passo 4: Personalizzare colori e tipografia

L'editor visuale ti permette di personalizzare l'aspetto del sito per allinearlo al brand della tua struttura.

Palette colori

  1. Clicca su Tema nella barra laterale dell'editor
  2. Seleziona una delle palette predefinite oppure crea la tua palette personalizzata
  3. Definisci i colori principali:
    • Colore primario: usato per pulsanti, link e elementi di accento
    • Colore secondario: usato per sfondi alternativi e elementi complementari
    • Colore del testo: il colore principale del testo
    • Colore di sfondo: il colore di sfondo delle pagine

Tipografia

Scegli i font per titoli e corpo del testo dalla libreria di Google Fonts inclusa. L'editor mostra un'anteprima in tempo reale di ogni combinazione.

Combinazioni consigliate per strutture ricettive:

StileFont titoliFont corpo
Elegante classicoPlayfair DisplayLato
Moderno minimaleMontserratOpen Sans
Caldo e accoglienteMerriweatherSource Sans Pro
Lusso contemporaneoCormorant GaramondRaleway

Passo 5: Aggiungere e organizzare le pagine

Il template include già una serie di pagine predefinite. Puoi modificarle, riordinarle, eliminare quelle non necessarie o aggiungerne di nuove.

Pagine incluse di default

La maggior parte dei template include queste pagine:

  1. Home: la pagina principale con hero image, presentazione e call-to-action
  2. Camere / Alloggi: la vetrina delle tipologie di camera con foto, descrizioni e tariffe
  3. Servizi: i servizi offerti dalla struttura (ristorante, spa, piscina, etc.)
  4. Galleria: una raccolta fotografica della struttura e dei dintorni
  5. Contatti: form di contatto, mappa e informazioni di contatto
  6. Chi siamo: la storia della struttura e del team

Aggiungere una nuova pagina

  1. Nella barra laterale, clicca su Pagine
  2. Clicca su Aggiungi pagina
  3. Scegli un modello di pagina o parti da una pagina vuota
  4. Assegna un titolo e un URL (slug) alla pagina
  5. La pagina verrà aggiunta automaticamente al menu di navigazione

Riordinare le pagine nel menu

Trascina le pagine nella barra laterale per riordinarle. L'ordine nella barra laterale corrisponde all'ordine nel menu di navigazione del sito.

Suggerimento

Suggerimento: posiziona le pagine più importanti (Camere, Prenota) nelle prime posizioni del menu. Gli studi di usabilità dimostrano che le voci nelle prime tre posizioni ricevono la maggior parte dei click.

Passo 6: Modificare i contenuti con l'editor visuale

L'editor visuale funziona con un sistema di blocchi. Ogni sezione della pagina è un blocco che puoi:

  • Spostare trascinandolo in una nuova posizione
  • Modificare cliccando direttamente sul testo o sull'immagine
  • Duplicare per creare una copia da personalizzare
  • Eliminare se non è necessario

Tipi di blocchi disponibili — 47 blocchi

Il catalogo del Website Builder comprende 47 blocchi suddivisi in categorie, ciascuno ottimizzato per le esigenze di una struttura ricettiva.

Blocchi fondamentali:

  • Hero: sezione a tutto schermo con immagine di sfondo, titolo e pulsante
  • Testo: paragrafo di testo con formattazione rich-text
  • Immagine: singola immagine con didascalia opzionale
  • Galleria: griglia di immagini con lightbox
  • Video: embed da YouTube o Vimeo — inserisci l'URL e il blocco fa tutto il resto
  • Divisore: separatore tra sezioni con 4 stili (linea, onda, puntini, ornamento decorativo)
  • HTML personalizzato: per inserire codice personalizzato (utenti avanzati)

Blocchi specifici per hospitality:

  • Camere: vetrina delle tipologie di camera con collegamento al Booking Engine
  • Camera in evidenza: vetrina per una singola camera con foto, prezzo e servizi sincronizzati dal booking engine
  • Servizi: griglia di servizi con set di 30 icone hospitality dedicate (WiFi, piscina, spa, parcheggio, ristorante e altre 25)
  • Offerte speciali: griglia di promozioni con prezzi, badge e pulsanti di prenotazione
  • Confronto tariffe: tabella comparativa delle tipologie con feature, prezzi e pulsante prenota
  • Mappa: embed Google Maps con la posizione della struttura, senza toccare codice
  • Il team: presentazione dei membri dello staff con foto, ruolo e bio
  • Numeri: contatori animati per statistiche chiave (anni di attività, camere, ospiti soddisfatti)
  • Loghi e partner: cloud di loghi di partner, certificazioni, premi e portali
  • Newsletter: form di iscrizione alla mailing list integrato direttamente nella pagina
  • Menu ristorante: categorie di piatti con prezzi e descrizioni per la ristorazione interna
  • Eventi e attività: schede con data, orario e descrizione delle esperienze in programma
  • Schede policy: informazioni pratiche (check-in, check-out, cancellazione) sincronizzabili dal booking engine
  • Riepilogo recensioni: punteggio medio e ultime recensioni sincronizzate
  • Punti di forza struttura: vantaggi principali della struttura con icone grandi
  • Griglia icone: servizi e comfort in formato compatto con icone e label
  • Meteo locale: temperature medie per mese con icone meteo

Blocchi di conversione:

  • CTA (Call to Action): banner con pulsante per incentivare la prenotazione
  • Testimonianze: citazioni e recensioni degli ospiti
  • Form contatti: modulo di contatto con campi personalizzabili
  • Conto alla rovescia: timer per offerte a tempo con aggiornamento in tempo reale
  • Promozione stagionale: card promozionale con immagine, prezzo, inclusi e prenotazione
  • Prova sociale: barra con punteggi da portali esterni (Booking, Google, TripAdvisor)
  • Premi e certificazioni: badge e riconoscimenti con icone e descrizioni

Blocchi di storytelling:

  • Cronologia: storia della struttura con layout alternato o lineare
  • Contenuto diviso: testo e immagine affiancati con posizione invertibile
  • Percorso ospite: i passi dalla prenotazione alla partenza in formato grafico
  • Sostenibilità: iniziative green con icone tematiche
  • Galleria Instagram: griglia fotografica per mostrare i migliori scatti

Blocchi di organizzazione:

  • Schede: contenuto organizzato in tab per mostrare camere, servizi e tariffe in uno spazio compatto
  • Confronto: tabella comparativa di feature con check/cross
  • Fisarmonica: domande e risposte in formato espandibile

Blocchi multimediali:

  • Collage fotografico: layout asimmetrico o masonry per gallerie creative
  • Banner parallasse: immagine a piena larghezza con testo sovrapposto e effetto profondità

Ogni blocco supporta 12 animazioni di ingresso (fade, slide, scale up, blur in, rotazione, bounce e stagger children) per rendere la navigazione fluida e professionale.

Modificare il testo

Per modificare un testo, clicca direttamente su di esso nell'anteprima. Apparirà una barra di formattazione con le opzioni:

  • Grassetto, corsivo, sottolineato
  • Titoli (H1, H2, H3)
  • Elenchi puntati e numerati
  • Link
  • Allineamento testo

Sostituire le immagini

  1. Clicca sull'immagine che vuoi sostituire
  2. Seleziona Cambia immagine
  3. Carica una nuova immagine dal tuo dispositivo o scegli dalla libreria
  4. Regola il ritaglio e il punto focale
  5. Aggiungi un testo alternativo (alt text) per l'accessibilità e la SEO

Passo 7: Anteprima e controllo qualità

Prima di pubblicare, verifica che tutto sia in ordine:

  1. Clicca su Anteprima nella barra superiore dell'editor
  2. Controlla il sito in tre modalità:
    • Desktop (schermo largo)
    • Tablet (schermo medio)
    • Smartphone (schermo stretto)
  3. Verifica che:
    • Tutte le immagini siano caricate correttamente
    • I testi non contengano errori
    • I link funzionino
    • Il form di contatto sia configurato
    • Il pulsante di prenotazione sia visibile e funzionante
Suggerimento

Suggerimento: chiedi a un collega o a un amico di navigare il sito in anteprima. Un occhio esterno cattura errori che chi ha lavorato al sito tende a non notare.

Passo 8: Pubblicare il sito

Quando sei soddisfatto del risultato:

  1. Clicca su Pubblica nella barra superiore
  2. Scegli il dominio:
  3. Conferma la pubblicazione

Il sito sarà online in pochi secondi. Riceverai una notifica via email con il link al tuo nuovo sito.

Dopo la pubblicazione

La pubblicazione non è un punto di arrivo, è un punto di partenza. Puoi continuare a modificare il sito in qualsiasi momento:

  • Le modifiche vengono salvate come bozza finché non clicchi nuovamente "Pubblica"
  • Puoi tornare alla versione pubblicata in qualsiasi momento se una modifica non ti convince
  • Lo storico delle versioni ti permette di ripristinare versioni precedenti del sito

Tempi reali di realizzazione

Ecco quanto tempo richiede mediamente ogni fase:

FaseTempo stimato
Procedura guidata iniziale5 minuti
Scelta template5-10 minuti
Personalizzazione colori e font5-10 minuti
Inserimento contenuti e foto20-30 minuti
Anteprima e revisione10 minuti
Pubblicazione2 minuti
Totale47-67 minuti

A differenza di un sito sviluppato da un'agenzia — che richiede settimane di attesa tra briefing, bozze, revisioni e deploy — con Hotely il tuo sito può essere online oggi stesso.

Domande frequenti

Posso modificare il template dopo averlo scelto?

Sì, puoi cambiare template in qualsiasi momento. I tuoi contenuti (testi e immagini) verranno mantenuti e adattati al nuovo template. Potrebbe essere necessario rivedere il layout di alcune sezioni.

Posso avere più siti per strutture diverse?

Sì, puoi creare un sito separato per ogni struttura gestita nel tuo account Hotely. Ogni sito può avere il proprio template, i propri colori e il proprio dominio.

E se voglio un unico sito per più strutture (portfolio)?

Per gestori di case vacanza o appartamenti a indirizzi diversi è disponibile la modalità multi-proprietà: un unico sito con branding condiviso che mostra tutte le proprietà e offre una ricerca disponibilità aggregata. Checkout, Alloggiati Web, ISTAT e tassa di soggiorno restano separati per ogni proprietà. Vedi la guida Sito multi-proprietà.

Il sito funziona anche senza il Booking Engine?

Sì, il Website Builder funziona indipendentemente. Tuttavia, collegare il Booking Engine è fortemente consigliato per massimizzare le prenotazioni dirette e ridurre la dipendenza dalle OTA.

Le modifiche al sito sono immediate?

Le modifiche vengono salvate come bozza nell'editor. Quando clicchi "Pubblica", le modifiche diventano visibili ai visitatori in pochi secondi grazie alla CDN globale di Hotely.

Cosa succede se annullo il mio abbonamento?

Il tuo sito rimarrà online per 30 giorni dopo la scadenza dell'abbonamento, dandoti il tempo di rinnovare o esportare i tuoi contenuti. Dopo 30 giorni, il sito verrà sospeso ma i dati saranno conservati per altri 60 giorni.