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

Blocchi immagine

Utilizza i Blocchi immagine per aggiungere immagini a pagine o post del blog in diversi layout. Ciascun Blocco immagine visualizza un'immagine.

Guarda un video

Aggiungere un Blocco immagine

Per aggiungere un Blocco immagine:

  1. Modifica una pagina o un post, fai clic su un punto di inserimento e poi su Immagine. Per maggiori informazioni, visita Aggiungere contenuto con blocchi.
  2. Utilizza la scheda Contenuto per aggiungere un'immagine e un link a un'immagine.
  3. Clicca sulla scheda Design per modificare il layout e animare il blocco.
  4. Quando hai finito, clicca fuori dall'editor dei blocchi. Le modifiche apportate vengono salvate automaticamente.

Per istruzioni dettagliate, consulta le sezioni seguenti.

Aggiungere un'immagine

Nella scheda Contenuto dell'editor Blocco immagini:

  • Per caricare la tua immagine, clicca su Aggiungi un'immagine. Puoi anche trascinare l'immagine nell'uploader d'immagini dal tuo computer.
  • Per aggiungere un'immagine di archivio, clicca su Cerca immagine o Cerca immagini. Puoi scegliere tra opzioni gratuite o premium. Per maggiori informazioni, visita Cercare e aggiungere immagini di archivio.
  • Inoltre puoi riutilizzare le immagini dalla finestra Ricerca immagini.

Ricorda:

  • Per ottenere risultati ottimali, utilizza un'immagine di dimensione inferiore a 500 KB. Per ulteriori suggerimenti sul formato delle immagini, visita Formattazione delle immagini per la visualizzazione sul Web.
  • È possibile modificare l'immagine dopo il caricamento utilizzando l' Editor immagini.
  • Il blocco immagine non si visualizzerà sul tuo sito Web senza aver caricato un'immagine.

Aggiungere un link a un'immagine o un pulsante

Nella scheda Contenuti, puoi trasformare l'immagine in un link o aggiungere un pulsante al suo layout.

Per trasformare l'immagine in un link nel layout In linea, aggiungi l'URL al campo Link o clicca su l'icona dell'ingranaggio per ulteriori opzioni.

Ricorda:

  • Se attivi una lightbox, i collegamenti URL verranno disattivati.
  • Il layout Inline (In linea) non supporta l'utilizzo di pulsanti.

Per tutti gli altri layout del Blocco immagine, utilizza il menu a discesa Link. Puoi scegliere tra:

  • None (Nessuno) - Nessun link
  • Su immagine - L'intera immagine diventa un link. Aggiungi un URL nel campo che viene visualizzato sotto il menu a discesa, oppure clicca su l'icona dell'ingranaggio per ulteriori opzioni.
  • Pulsante - Viene visualizzato un pulsante allineato al testo, sotto il titolo e il sottotitolo. Personalizza il testo del pulsante e aggiungi l'URL nel campo che appare sotto il menu a discesa o clicca su l'icona dell'ingranaggio per ulteriori opzioni.

Scegli un layout

Quando aggiungi un Blocco immagine, questo utilizza il layout In linea per impostazione predefinita. Per modificare il layout, clicca sulla scheda Design, quindi scegli il layout desiderato tra i seguenti:

  • Inline - Il blocco immagine di base, con sottotitoli opzionali sotto o sovrapposti all'immagine. Imposta la modalità di visualizzazione della didascalia nella scheda Contenuto.
  • Poster - Visualizza il testo sulle immagini, creando l'aspetto di un banner o di un poster.
  • Scheda - Visualizza immagini con testo a sinistra o a destra. Il testo di solito si sposta sotto le immagini nei browser e nei dispositivi mobili più piccoli o quando vengono utilizzati Blocchi immagine nelle colonne.
  • Sovrapposto - Visualizza immagini su un lato e il testo sull'altro, parzialmente sovrapposto all'immagine. Aggiungi un colore di sfondo per evidenziare il titolo. Di solito, il testo si sposta sotto le immagini nei browser più piccoli e nei dispositivi mobili o quando i Blocchi immagine vengono utilizzati in colonne.
  • Collage - Visualizza le immagini su un lato e il testo sopra" le schede" di sfondo dall'altro, compensando e sovrapponendo l'immagine. Il testo di solito si sposta verso l'angolo inferiore delle immagini nei browser e nei dispositivi mobili più piccoli o quando vengono utilizzati Blocchi immagine nelle colonne.
  • Stack - Visualizza le immagini con il testo sottostante.

Mentre selezioni un layout, vedrai un'anteprima della pagina.

Suggerimento: quando passi dal layout In linea a un altro layout, dovrai inserire nuovamente il testo dell'immagine.

Aggiungere animazioni

Non è possibile aggiungere animazioni dall'app Squarespace.

Nella scheda Designdell'editor del Blocco immagine, puoi aggiungere animazioni che i visitatori vedono quando caricano o aggiornano la pagina.

Per aggiungere animazioni:

  1. Nell'editor Blocco immagini fare clic su Progettazione, quindi su Animazioni.
  2. Seleziona un effetto dalla lista da applicare all'immagine e a un qualsiasi testo. Mentre selezioni un'opzione, vedrai un'anteprima di come apparirà sulla pagina.
  3. Per animare separatamente l'immagine e il testo, selezionaPersonalizza, quindi seleziona le opzioni Immagine e Testo.
Suggerimento: nella versione 7.1, è possibile applicare animazioni a livello globale a tutte le immagini sul tuo sito.

Scegli tra queste opzioni di animazione per l'immagine, il testo o entrambi:

  • Dissolvenza - Il blocco, l'immagine o il testo si dissolve
  • Scorrimento verso l'alto - Il blocco, l'immagine o il testo scorre verso l'alto
  • Scorrimento verso il basso: l'immagine o il testo scorre verso il basso
  • Clip orizzontale - Il blocco o l'immagine si carica in strati orizzontali
  • Clip verticale - Il blocco o l'immagine si carica in strati verticali
  • Inclinazione verso l'alto - Il blocco o l'immagine si ingrandiscono con un'inclinazione verso l'alto
  • Inclinazione verso il basso - Il blocco o l'immagine si ingrandiscono con un'inclinazione verso il basso
  • Messa a fuoco: il blocco, l'immagine o il testo sembra sfocato, poi viene messo a fuoco
  • Scontro: immagine e testo scivolano verso l'interno dai lati
  • Rivelazione: immagine e testo scivolano verso l'esterno dal centro
  • Scorrimento da sinistra: l'immagine o il testo scorre da sinistra
  • Scorrimento da destra: l'immagine o il testo scorre da destra

Ecco un esempio di un Blocco immagine Collage che utilizza queste impostazioni:

  • Animazione - Personalizza
  • Animazione immagine - Diapositiva da destra
  • Animazione testo - Diapositiva da sinistra

Esempio di un Blocco immagine con animazioni.

Aggiungere il testo

Nel Blocco immagine, clicca su Scrivi una didascalia qui, Scrivi un titolo qui o Scrivi un sottotitolo qui per aggiungere del testo all'immagine.

Per un migliore risultato, mantieni il testo breve e prova a limitare i sottotitoli a una o due frasi. In questo modo, puoi mantenere un giusto equilibrio tra le parole e l'immagine. Inoltre, il testo sarà visibile anche su dispositivi mobili.

Suggerimento: evidenzia il testo per apportare modifiche di base alla formattazione con la barra degli strumenti di testo, come il grassetto, il corsivo o l'aggiunta di un link.

Differenze tra didascalie, titoli e sottotitoli

I campi di testo e opzioni di stile variano in base al layout. Il layout In linea supporta una didascalia di base, mentre gli altri layout supportano i campi titolo e sottotitoli.

Il layout In linea supporta una didascalia:

Nella scheda Contenuto, seleziona un'opzione di visualizzazione dal menu a discesa delle didascalie:

  • Off - Non viene visualizzata alcuna didascalia a meno che l'immagine non venga visualizzata in un lightbox.
  • Didascalia sotto - La didascalia viene visualizzata sotto l'immagine, allineata a sinistra.
  • Didascalia in sovrapposizione - La didascalia viene visualizzata sull'immagine in una barra di colore grigio scuro.
  • Didascalia in sovrapposizione al passaggio del mouse - La didascalia viene visualizzata sull'immagine in una barra di colore grigio scuro quando il cursore passa sopra l'immagine.
Suggerimento:se non vedi Scrivi didascalia qui, passa temporaneamente allo stile Didascalia sotto nella scheda Design.

Le didascalie vengono sempre visualizzate in lightbox. Le didascalie non vengono visualizzate in Blocchi immagine vuoti. Per aggiungere testo senza un'immagine, utilizza un Blocco di testo.

Altri layout supportano un titolo e un sottotitolo:

Definire lo stile del Blocco immagine

Alcuni layout hanno impostazioni di stile specifiche per i caratteri, i colori e i pulsanti. La visualizzazione di queste impostazioni dipende dalla versionedel sito.

Per modellare i Blocchi immagine a livello globale:

Per creare uno stile di elementi specifici del layout nel Blocco immagine, come l'allineamento del testo o la larghezza del contenuto:

  1. Durante la modifica di una pagina, apri Stili sito, quindi clicca su Blocchi immagine.
  2. Scorri verso il basso fino alla sezione di ogni layout per modificarne i tweak.

Nella versione 7.0, tutti i layout Image Block tranne Inline hanno le proprie impostazioni di stile in Stili sito. Per trovare queste opzioni:

  1. Nel Menu Home, clicca su Design, quindi su Stili sito.
  2. Scorri verso il basso fino alla sezione di ogni layout per modificarne i tweak.

Il Blocco immagine in linea non ha tweak specifici in Stili sito. Per informazioni sugli stili, i colori e le dimensioni dei tipi di carattere delle didascalie, visita Definire lo stile delle didascalie delle immagini.

Ridimensiona l'immagine

È possibile ridimensionare o ritagliare i Blocchi immagine in diversi modi, a seconda del layout. Per ulteriori informazioni, visita Ridimensionamento di un'immagine.

Suggerimento: puoi rimuovere il padding applicato automaticamente ai Blocchi immagine aggiungendo codice personalizzato. Per maggiori informazioni, vedi questo post nello Squarespace Forum.

Nota: le personalizzazioni del codice non rientrano nell'ambito del nostro supporto. Ciò significa che non possiamo fornire assistenza in relazione alla configurazione o alla risoluzione dei problemi.

Blocchi immagine su dispositivi mobili

Ciascun layout di Blocco Immagine mantiene la formattazione su dispositivi mobili. Il testo si sposterà per adattarsi allo schermo del dispositivo, ma manterrà una posizione simile in relazione all'immagine.

  • Per avere un'idea di come verrà visualizzato il Blocco Immagine, utilizza l'Anteprima Dispositivi.
  • Ad eccezione dei layout In linea e A colonna, le didascalie mantengono la larghezza impostata rispetto all'immagine. Ciò significa che le didascalie più lunghe potrebbero risultare più difficili da leggere o essere tagliate sui dispositivi mobili. Ciò può essere particolarmente visibile nel layout Poster, progettato per poco testo.
  • Le didascalie per il layout Carta si spostano da accanto all'immagine sotto l'immagine. Per i layout Collage e Sovrapposizione, le didascalie si spostano da accanto all'immagine verso la parte inferiore dell'immagine.
  • I layout Cartolina, Collage, Sovrapposto e Impilato dispongono di un'opzione Ridimensionamento dinamico del carattere nel pannello Stili sito. Quando abilitata, il testo non verrà ridimensionato utilizzando una dimensione inferiore ai 14 pixel.
  • I Blocchi Immagine vengono impilati verticalmente su dispositivi mobili.

Risoluzione dei problemi relativi ai colori delle immagini

Se un'immagine viene salvata in modalitàCMYK piuttosto che RGB, i colori sul tuo sito Squarespace possono differire da quelli dell'immagine originale.

Salva sempre le tue immagini in modalità RGB o sRGB. La modalità a colori RGB è un formato sicuro per il web, mentre la modalità CMYK è destinata alla stampa e potrebbe non essere visualizzata correttamente nella maggior parte dei browser. Per maggiori informazioni sulla formattazione delle immagini, visita Formattare le immagini per la visualizzazione sul web.

Passaggi successivi

Dopo aver impostato il Blocco immagine, puoi riorganizzarlo, modificarlo o rimuoverlo:

Questo articolo ti è stato utile?
Utenti che ritengono sia utile: 97 su 399