Nota: Sebbene le nostre guide più popolari siano state tradotte in italiano, alcune guide sono disponibili solo in inglese.

Pagine di copertina

Le Pagine di copertina presentano le informazioni in un'unica pagina d'effetto. Sono ideali per mostrare una pagina «In costruzione», per annunciare il rilascio di un prodotto o per raccogliere gli indirizzi e-mail dei visitatori.

Le Pagine di copertina sono disponibili in tutti i piani di fatturazione Website e Commerce nella versione 7.0. Se al momento utilizzi il piano Pagina di copertina a sé stante, la tua pagina rimarrà attiva fintanto che la fatturazione sarà attiva. Non è più possibile tornare al piano Pagina di copertina dopo essere passati a un sito completo.

Le Pagine di copertina non sono disponibili nella versione 7.1.

Guarda un video

Aggiungere una Pagina di Copertina

Per aggiungere una Pagina di copertina e personalizzarne il contenuto, segui questi step:

  1. Nel Menu Home, clicca su Pagine, quindi su + e seleziona Pagina di copertina. Per maggiori informazioni, visita Aggiungere pagine alla tua navigazione.
  2. Scegli un layout.
  3. Aggiungi logo, testo e immagini.
  4. Aggiungi azioni, come pulsanti, link o moduli.
  5. Definisci lo stile della pagina.

Ricorda:

  • Per rendere la Pagina di copertina la prima pagina visibile ai visitatori del tuo sito, impostala come homepage.
  • Per rimuovere la Pagina di copertina dai menu di navigazione, spostala nella sezione Non collegato nel pannello Pagine. L'ideale se desideri che i visitatori la visualizzino una sola volta prima di accedere al tuo sito o se vuoi utilizzarla come pagina di destinazione.
  • Se stai utilizzando un piano solo Pagina di copertina, non disponi di un pannello Pagine e non puoi aggiungere altre pagine. Il tuo Menu Home visualizza i pannelli per modificare la tua Pagina di copertina a sé stante.

Layout pagina di copertina

Ogni layout Pagina di copertina funziona come un modello a una pagina, con specifiche funzionalità e opzioni di stile. Le Pagine di copertina non prevedono l'utilizzo di blocchi, mentre altri elementi di design, come testo e pulsanti, vengono visualizzati in una posizione fissa. In questo modo, la tua Pagina di copertina avrà un aspetto piacevole e potrà essere visualizzata sui vari dispositivi.

Nota: le copertine non supportano la formattazione HTML e Markdown.

Per cambiare layout:

  1. Clicca su Modifica layout nel menu Pagina di copertina.
  2. Utilizza il menu a discesa per ordinare i layout per categoria oppure scegli Tutti i layout per visualizzarli tutti.
  3. Passa il mouse su un layout e clicca su Seleziona per impostarlo come nuovo layout.
  4. Clicca su Salva nella parte superiore della pagina per applicare la modifica.

Anche se puoi adattare i layout Pagina di copertina a qualsiasi scopo, li abbiamo progettati pensando a temi generali. Troverai maggiori informazioni su ogni categoria di layout qui sotto. 

Utilizza questi layout per una pagina personale o aziendale, una pagina «Presto disponibile» o una pagina di iscrizione alla newsletter:

  • Carta
  • Copertina
  • Flash
  • Gazette
  • Jacket
  • Mission
  • Visualizzazione
  • In evidenza
  • Trade

Utilizza questi layout per un profilo personale incentrato sul testo o per evidenziare immagini d'effetto:

  • Backstory
  • Focus
  • Monocle
  • Montage
  • Ritratto
  • Prism
  • Silhouette
  • Snapshot
  • Vanguard
  • Vignette

Utilizza questi layout per mettere in evidenza le tracce audio di un musicista o di una band o per condividere un episodio di un podcast:

  • Broadcast
  • Record
  • Sessione
  • Tour

Per aggiungere tracce audio, clicca su Audio dal menu Pagine di copertina, quindi trascina un file .mp3 nell'uploader Aggiungi traccia. Per creare una playlist, trascina e rilascia più file .mp3. Le Pagine di copertina supportano file .mp3 fino a 20 MB per traccia.

Utilizza questi layout per condividere un film, un trailer o un altro video:

  • Debut
  • Premier
  • Projector
Suggerimento: la maggior parte dei layout supporta anche i video di sfondo utilizzando un URL YouTube o Vimeo.

Per incorporare un video, clicca su Video dal menu Pagina di copertina. Quindi, segui i nostri step per aggiungere un video, utilizzando il link diretto o il codice da incorporare.

Sulla pagina con un video incorporato viene visualizzato un pulsante di riproduzione. Quando il visitatore clicca su di esso, il video si apre in lightbox.

L'incorporamento di un link video non carica automaticamente la grafica o la miniatura correlate al video. Per aggiungere immagini correlate alla pagina, carica un'immagine nel pannello Media.

Utilizza questi layout per visualizzare una posizione fisica, ad esempio un negozio, uno studio o la sede di un evento:

  • Flagship
  • Harbor

Per aggiungere una mappa, clicca su Posizione mappa nel menu Pagina di copertina. Inserisci un indirizzo per l'indicatore, quindi clicca su +/- nel pannello per modificare lo zoom predefinito.

Cliccando sull'indicatore, si apre la posizione in Google Maps. Non è possibile aggiungere più indicatori alla mappa.

Utilizza questi layout per visualizzare uno slideshow degli ultimi tweet da un feed Twitter o da un filtro di ricerca:

  • Echo
  • Status 

Per collegare un feed Twitter, clicca su Twitter nel menu Pagina di copertina, quindi clicca su Aggiungi account. Puoi visualizzare i tweet dal tuo account o un feed dei tweet di altri utenti tramite hashtag, menzioni o qualsiasi termine con Usa Ricerca Twitter.

Suggerimento avanzato: per le linee guida di Twitter sull'utilizzo degli operatori di query nella loro ricerca, visita la documentazione API di Twitter.

Aggiungere branding e testo

Usa il pannello Branding e testo per aggiungere:

  • Un logo o un testo di branding
  • Un'intestazione di pagina
  • Il corpo del testo

Queste impostazioni sono associate allo stile del layout per permetterti di presentare una quantità minima di informazioni con il massimo impatto.

Ricorda:

  • La visualizzazione del branding e del testo varia in base al layout
  • Non è possibile visualizzare contemporaneamente un logo e un testo di branding.
  • Assicurati che il tuo logo rispetti le nostre procedure consigliate oppure crea un nuovo logo con Squarespace Logo.
  • A differenza di altre pagine, i titoli dei siti e i loghi sulle Pagine di copertina non sono collegati alla homepage del sito.
  • Il tuo testo di branding può essere diverso dal titolo SEO, che è utilizzato come nome della pagina nelle schede del browser e nei risultati dei motori di ricerca.

Aggiungere file multimediali

Usa il pannello Media per:

Ricorda:

  • Formatta correttamente le immagini prima del caricamento.
  • Puoi utilizzare l'Editor di immagini integrato per modificare le immagini originali.
  • Puoi caricare più immagini per creare uno slideshow o uno sfondo a griglia.
  • Il caricamento di molte immagini ad alta risoluzione può influire sul tempo di caricamento della tua Pagina di copertina.
  • La maggior parte dei layout supporta video di sfondo, riprodotti in loop senza audio, tramite il link a un URL di YouTube o di Vimeo. 
  • Non è possibile aggiungere i comandi di navigazione o impostare la velocità di transizione nello slideshow di una Pagina di copertina.
  • A causa del responsive design, le immagini e i video appariranno sempre parzialmente ritagliati, soprattutto sui dispositivi mobili. La quantità del ritaglio dipende dall'altezza dell'immagine, dalla larghezza del browser e dal layout prescelto.

Impostare un colore di sfondo

Per visualizzare un semplice sfondo colorato invece di un'immagine o di un video, scegli Nessuno. L'immagine scomparirà dall'anteprima. Modifica il colore dello sfondo nel pannello Stile.

Aggiungere azioni

Utilizza il pannello Azione per aggiungere pulsanti, link di navigazione, un modulo o un'opzione per l'iscrizione a una newsletter. Se non desideri nessuna azione sulla tua Pagina di copertina, lascia vuoti i relativi campi.

Ricorda:

  • Puoi aggiungere pulsanti o link di navigazione, ma non entrambi.
  • Puoi aggiungere fino a due pulsanti o cinque link di navigazione.
  • Puoi aggiungere un modulo o l'iscrizione a una newsletter.

Per aggiungere un'azione:

  1. Clicca su Azione nel menu della Pagina di copertina.
  2. In Seleziona tipo di azione, scegli un'azione.

Aggiungere pulsanti o link di navigazione

Pulsanti e link di navigazione dirigono i visitatori a una pagina differente del tuo sito Squarespace, a un altro sito web o a un file scaricabile. Per aggiungere pulsanti o link di navigazione:

  1. Scegli PulsantiNavigazione dal menu Seleziona tipo di azione.
  2. Aggiungi un'etichetta nel primo campo. È consigliabile che il testo dell'etichetta del link sia breve per garantire una migliore formattazione e leggibilità.
  3. Clicca sul campo dell'URL per inserire un indirizzo Web o clicca su“the  per aprire l'editor di link. Puoi creare un link a siti esterni, file scaricabili, indirizzi e-mail, numeri di telefono o a contenuti del tuo stesso sito. Per maggiori informazioni, visita Aggiungere link al tuo sito.
  4. Clicca su Salva all'estremità superiore del pannello per pubblicare tutte le modifiche.

Aggiungere un modulo o l'iscrizione a una newsletter

I visitatori possono cliccare su un pulsante e compilare il modulo o l'iscrizione alla newsletter che si apre in sovrapposizione. Per aggiungere un modulo o l'iscrizione a una newsletter:

  1. Scegli Modulo Newsletter dal menu Seleziona tipo di azione.
  2. Aggiungi un'etichetta al pulsante nel campo Etichetta pulsante .
  3. Clicca su Modifica modulo o su Modifica iscrizione newsletter per creare il contenuto.
  4. Nel caso dei moduli, puoi assegnare un nome al modulo nel campo Nome modulo. Non è possibile assegnare un nome alle iscrizioni alle newsletter.
  5. Nel caso dei moduli, puoi eliminare i campi dimostrativi cliccando sulle icone del cestino, o cliccare sul segno + nella parte inferiore per aggiungere nuovi campi. Se desideri richiedere ai visitatori di compilare un campo per inviare il modulo, seleziona Obbligatorio. Le iscrizioni alle newsletter prevedono solo il campo dell'indirizzo e-mail.
  6. Click the Storage tab to tell us where to send submissions. If you use an Email Campaigns mailing list as your storage option, subscribers will receive a confirmation email when they sign up. It's not possible to disable this.
  7. Nella scheda Avanzate, personalizza l'etichetta del pulsante di invio, impostare un reindirizzamento post-invio o modificare il messaggio che viene visualizzato dai visitatori dopo aver inviato il modulo. Usa testo normale o HTML.
  8. Clicca su Salva nell'editor, quindi su Salva all'estremità superiore del pannello per pubblicare tutte le modifiche.
Suggerimento: dopo aver collegato il modulo o l'iscrizione alla newsletter a un'opzione di archiviazione, è consigliabile visitare la versione online della pagina e inviare un modulo di prova per verificarne il funzionamento.

Aggiungere un colore di sfondo al modulo

Nella maggior parte dei layout, è possibile utilizzare il tweak Colore sovrapposizione personalizzato nel pannello Stile per aggiungere un colore allo sfondo del modulo o dell'iscrizione alla newsletter. Per nascondere questa sovrapposizione dal resto della pagina, usa il cursore di opacità per renderla trasparente. I visitatori visualizzeranno la sovrapposizione dopo aver cliccato sul modulo o sul pulsante di iscrizione alla newsletter.

Ricorda:

  • Il layout Harbor non include le impostazioni Colore di sovrapposizione personalizzatoColore dietro il testo. Gli sfondi Harbor per moduli o iscrizioni alla newsletter sono sempre di colore grigio chiaro.
  • In alcuni layout, l'opzione Colore sovrapposizione personalizzato viene visualizzata solo dopo aver aggiunto immagini al pannello Media.

Su questi layout, lo sfondo del modulo o dell'iscrizione alla newsletter corrisponde all'impostazione Colore dietro il testo:

  • Backstory
  • Carta
  • Flagship
  • Flash
  • Focus
  • Monocle
  • Sessione
  • In evidenza
  • Vignette

Nascondere il modulo

Per nascondere il modulo o l'iscrizione alla newsletter, elimina tutto il testo dell'Etichetta pulsante e lascia il campo vuoto. I campi modulo rimangono intatti se li riattivi in un secondo momento.

Aggiungere icone social

Per visualizzare le icone social, clicca su Link social nel menu della Pagina di copertina e seleziona Visualizza icone social. Le icone social riflettono gli account che hai aggiunto nel pannello Link social. La posizione delle icone varia in base al layout, ma in generale è collocata nella parte inferiore.

Definire lo stile della Pagina di copertina

Utilizza il pannello Stile nel menu della Pagina di copertina per personalizzare il design. Ogni Pagina di copertina ha opzioni di stile uniche, indipendenti dal modello del sito e dalle altre Pagine di copertina.

Ricorda:

  • Se cambi layout, vengono ripristinate tutte le impostazioni predefinite del layout relative al tipo di carattere, al colore e alle dimensioni. Se torni a un layout usato in precedenza, vengono reimpostati anche i tweak di stile.
  • Dal momento che le Pagine di copertina sono create con un responsive design, avranno un aspetto leggermente diverso su un dispositivo mobile. Puoi visualizzare in anteprima come apparirà la tua pagina su un dispositivo mobile utilizzando Vista dispositivo.

Modificare i tweak di stile

Clicca su Stile nel menu Pagina di copertina. Utilizza i tweak di stile per personalizzare la tua Pagina di copertina. Mentre apporti le modifiche, l'anteprima della pagina si aggiorna. Ti consigliamo di provare diverse opzioni finché non trovi il design che preferisci.

Ecco un elenco di tweak comuni per la Pagina di copertina:

  • Posizionamento - Posiziona il contenuto sulla pagina. A seconda del layout, le opzioni sono Sinistra, CentroDestrao In alto, Al centroIn basso.
  • Branding - Imposta il tipo di carattere e il colore.
  • Titolo - Imposta il tipo di carattere e il colore.
  • Corpo - Imposta il tipo di carattere e il colore.
  • Sfondo - Imposta il colore di sfondo (visibile se non utilizzi un'immagine o un video) e le opzioni del bordo pagina.
  • Media (non disponibile nei layout Posizione) - Imposta lo stile comeIntero o Griglia e personalizza l'aspetto della griglia. Seleziona Colore sovrapposizione automatico e e Colore caricamento automatico oppure deseleziona e imposta i colori per ciascuno di essi. Per ulteriori informazioni sul colore di caricamento, vedi di seguito.
  • Pulsanti - Imposta il tipo di carattere, lo stile e il colore dei pulsanti.
  • Icone social - Imposta lo stile e il colore delle icone social.
  • Controlli audio (solo layout Audio) - Imposta lo stile del lettore, il tipo di carattere e il colore delle tracce.
  • Controlli video (solo layout Video) - Imposta lo stile e il colore del lettore.
  • Mappa (solo layout Posizione) - Imposta lo stile della mappa.
  • Twitter (solo layout Twitter) - Imposta il tipo di carattere, lo stile e il colore del testo dei tweet (Corpo) e del nome utente di Twitter (Nome e Meta ).

Immagini di sfondo

La maggior parte dei layout include le opzioni Full (Intera) e Grid (Griglia) per le immagini:

  • Seleziona Full (Intera) per riempire l'intero sfondo della Pagina di copertina con un'unica immagine. Se carichi più immagini, queste verranno visualizzate una alla volta come slideshow.
  • Seleziona Grid (Griglia) per creare una griglia di sfondo con immagini ripetute. Se hai una sola immagine, la griglia ripeterà tale immagine per riempire lo spazio.
    • L'opzione Grid (Griglia) non è disponibile nei layout Focus, Flagship, Harbor o Monocle.
    • Nel layout Montage, la barra dei contenuti potrebbe coprire alcune immagini.
  • Utilizza i tweak riportati di seguito per impostare il rapporto dimensionale, l'orientamento dell'immagine e altro ancora.

Colore di caricamento

La maggior parte dei layout Pagina di copertina offre un'opzione colore di caricamento per visualizzare un colore di sfondo diverso durante il caricamento del normale colore di sfondo o dell'immagine. Questo colore può essere visualizzato anche durante il passaggio da un'immagine all'altra in uno slideshow.

Nota: i layout Flagship, Focus, Harbor e Monocle non offrono un colore di caricamento.

Per impostazione predefinita, il layout utilizza il Colore caricamento automatico. Ciò significa che il colore si basa sul colore di sfondo dell'immagine o del video. Se hai più immagini di sfondo, il colore di caricamento si basa sulla prima immagine nel pannello Media. 

Per scegliere un colore personalizzato, deseleziona Colore caricamento automatico e impostane uno nuovo cliccando su Colore caricamento personalizzato.

Per disabilitare il colore di caricamento, clicca su Colore caricamento personalizzato e seleziona l'opzione Trasparente.

Colore di sovrapposizione

Tutti i layout tranne Harbor offrono un'opzione di sovrapposizione del colore, che aggiunge una tonalità all'immagine o al colore di sfondo. Per impostazione predefinita, il layout utilizza il Colore sovrapposizione automatico. Il colore automatico è solitamente una tonalità di grigio abbinata all'immagine demo.

Per utilizzare un colore di sovrapposizione personalizzato, deseleziona Colore sovrapposizione automatico, clicca su Colore sovrapposizione personalizzato e scegli un nuovo colore.

Per utilizzare il colore di sovrapposizione personalizzato come colore di sfondo di un modulo, ma nasconderlo dal resto della pagina, utilizza il cursore di opacità per rendere il colore trasparente.

Domande frequenti

Perché non posso aumentare le dimensioni del testo oltre un determinato punto?

Il testo, i logo e i pulsanti di una Pagina di copertina possono essere ingranditi fino alla larghezza massima supportata da ciascun layout. Questi limiti impediscono al contenuto di sovrapporsi e garantiscono un design reattivo.

Più specificamente, il corpo del testo viene visualizzato nella dimensione impostata per il tipo di carattere quando la larghezza del browser è superiore a 1800 pixel. Per i browser di larghezza pari o inferiore a 1800 pixel, il tipo di carattere del corpo raggiunge una dimensione massima a seconda della larghezza:

  • Larghezza 1800 pixel: 27px
  • Larghezza 1600 pixel: 22px
  • Larghezza 1020 pixel: 18px
  • Larghezza 760 pixel: 17px
  • Larghezza 600 pixel: 16px

Ad esempio, impostando le dimensioni del carattere relative al corpo del testo su 30px, solo i visitatori che dispongono di una finestra del browser larga almeno 1801 pixel lo visualizzeranno a 30 pixel. In caso contrario, le dimensioni si modificheranno come da elenco precedente. Analogamente, impostando le dimensioni del corpo del testo a 13px, questo apparirà sempre a 13 pixel poiché le sue dimensioni sono inferiori a qualsiasi limite.

Il branding e il testo del titolo si comportano in modo diverso. La dimensione del tipo di carattere funziona più come un bersaglio e il testo si adegua all'altezza e alla larghezza del browser. Questa scalabilità varia a seconda del layout.

Posso aggiungere un codice personalizzato a una Pagina di copertina?

Le Pagine di copertina hanno dei design studiati nel dettaglio e non si prestano all'aggiunta di CSS personalizzati. Per regolare lo stile della Pagina di copertina (ad esempio tipi di carattere e colori), usa il pannello Stile.

Se hai comunque bisogno di aggiungere HTML o script, utilizza le impostazioni della Pagina di copertina per aggiungere una Iniezione di codice per pagina. Per maggiore assistenza, visita Domande Frequenti sul codice personalizzato.

Perché il mio feed Twitter non si aggiorna?

L'integrazione del feed Twitter si aggiorna ogni cinque minuti. Se noti un intervallo di tempo più lungo, aggiorna manualmente la connessione:

  1. Nel menu Pagina di copertina, clicca su Icone social, quindi su Account connessi.
  2. Clicca sul tuo account Twitter.
  3. Clicca su Ripristina dati. Verrà visualizzato un messaggio che indica che i dati vengono ripristinati e che il feed verrà aggiornato entro pochi minuti.
  4. Fai clic su Salva.

Il pulsante di riproduzione cambia posizione nel layout Projector.

La posizione del pulsante di riproduzione nel layout Projector dipende dalla lunghezza del testo nel campo Corpo:

  • Con una quantità limitata di testo, il pulsante di riproduzione rimane centrato.
  • Quando il testo supera una certa larghezza, il pulsante di riproduzione si sposta nell'angolo in alto a sinistra.
  • La posizione varia in base alle dimensioni del browser.
Questo articolo ti è stato utile?
Utenti che ritengono sia utile: 382 su 595
Pagine di copertina