Immagini con smarginatura completa

Per creare un forte impatto visivo, aggiungi immagini ampie che si estendano fino al bordo dello schermo.

Ultimo aggiornamento 22 agosto 2024

Un'immagine con smarginatura completa si estende da un bordo all'altro della finestra del browser, coprendo la larghezza del sito. Ciò crea un senso di espansione e mette l'accento sulle immagini del sito.

Nella versione 7.1, è possibile aggiungere immagini a smarginatura completa in qualsiasi pagina. Nella versione 7.0, la possibilità del sito di visualizzare immagini a smarginatura completa dipende dal modello adottato.

7.1_full_bleed.jpg

Prima di iniziare

  • Per creare un'immagine con smarginatura completa sul tuo sito, ti consigliamo di caricare un'immagine con una larghezza compresa tra 1500 pixel e 2500 pixel.
  • Poiché le immagini con smarginatura completa cambiano le dimensioni a seconda della larghezza del browser, avranno sempre qualche ritaglio.
  • Sebbene questi termini vengano talvolta utilizzati in modo intercambiabile, le immagini a "smarginatura completa" si estendono fino al bordo della schermata del browser, mentre quelle a"larghezza massima" si estendono solo fino al bordo dell'area principale in cui è presente il contenuto.

Immagini di sfondo

Le immagini di sfondo si comportano in modo diverso in base alla versione di Squarespace del tuo sito.

Crea un'immagine di sfondo con smarginatura completa in qualsiasi sezione impostando l'opzione Larghezza sfondo su Smarginatura completa negli stili di sezione.

Per far sì che un'immagine di sfondo riempia interamente la pagina, aggiungi tutti i contenuti di quella pagina a un'unica sezione.

Alcuni modelli sono stati progettati per contenere immagini grandi e audaci, mentre altri enfatizzano lo spazio vuoto e accentuano la spaziatura intorno ai blocchi.

Tutti i modelli che supportano un'immagine di sfondo del sito consentono di visualizzarla con la smarginatura completa. Per impostare un'immagine di sfondo su smarginatura completa, scegli la configurazione dello stile Dimensioni: copertina.

Puoi anche aggiungere una Pagina di copertina a qualsiasi modello. Molti layout di Pagine di copertina utilizzano immagini di sfondo con smarginatura completa.

Banner

Le immagini banner funzionano in modo diverso a seconda della versione di Squarespace del tuo sito.

Aggiungi un banner a qualsiasi sezione aggiungendo un video o un'immagine di sfondo, quindi imposta l'opzione Larghezza sfondo su Smarginatura completa negli stili di sezione.

I banner vengono visualizzati nella parte superiore del sito, sotto o dietro l'intestazione.

Nelle seguenti famiglie di modelli, i banner vengono visualizzati per tutta larghezza del browser:

  • Adirondack - I banner vengono visualizzati per tutta la larghezza del sito, ma non si espandono fino alla massima larghezza del browser.
  • Brine
  • Bedford
  • Five
  • Pacific
  • Supply - I banner verticali vengono visualizzati all'altezza del browser sui post del blog e sugli eventi.
  • Tremont
  • York - Seleziona gli stili sito Mostra banner della pagina e Banner con smarginatura completa in Stili sito.

Sezioni galleria e Pagine galleria

In base alla versione di Squarespace del tuo sito, questo presenterà diverse opzioni galleria.

Le immagini delle sezioni galleria possono essere visualizzate con smarginatura completa. Negli stili della sezione galleria, imposta l'opzione Larghezza su Smarginatura completa.

I layout della galleria con smarginatura completa vengono visualizzati nelle seguenti famiglie di modelli:

Modello Stile galleria
Ishimoto Carosello
Momentum Slideshow

Tremont

Grid (Griglia)
Wexley

Griglia. Regola la Spaziatura dell'elemento Indice e la Spaziatura esterna.

Pagine progetto

La famiglia di modelli York supporta un tipo di pagina speciale denominata Pagina del progetto, che combina testo e immagini in modo accattivante.

In Stili sito, seleziona Progetto con smarginatura completa e Consenti larghezza massima in modalità verticale e quadrata per fare in modo che tutte le immagini vengano visualizzate alla larghezza del browser.

Blocchi immagine

I Blocchi immagine vengono visualizzati con una larghezza standard all'interno dello spazio che comprende l'area di contenuto principale, alla stessa larghezza di tutti gli altri blocchi, quindi non offrono opzioni integrate per la visualizzazione con smarginatura completa.

Per maggiori informazioni, visita Blocchi immagine.

Immagini delle Pagine portfolio e delle Pagine indice

Pagine Indice e Portfolio funzionano in modi simili:

  • Nella versione 7.1, una Pagina portfolio si presenta come una griglia di immagini collegate ad altre pagine del tuo sito. Tutti i siti in versione 7.1 supportano le Pagine portfolio.
  • Nella versione 7.0, una Pagina indice si presenta come un layout univoco di immagini collegate ad altre pagine del tuo sito. Solo alcuni modelli della versione 7.0 supportano le Pagine indice e ogni Indice è caratterizzato da un proprio stile.

Le Pagine portfolio possono essere visualizzate con smarginatura completa nel layout Sfondo dell'indice del portfolio.

Le Pagine indice presentano immagini con smarginatura completa o collage di immagini in queste famiglie di modelli:

Modello

Opzioni

Avenue

Griglia per miniature. Seleziona Indice con larghezza massima e regola la Spaziatura delle miniature su 0% e la Spaziatura del canvas su 0px (inserire manualmente 0px).

Brine

Banner impilati e sezioni della galleria.

Bedford

Banner impilati

Flatiron

Griglia per miniature o mosaico

Forte

Slideshow

Momentum

Slideshow

Pacific

Banner impilati

Tremont

Slideshow

York

Banner impilati. Scegli Spaziatura esterna del sito: personalizzata e imposta la Spaziatura personalizzata del sito su 0px

Footer Image
  • Ricevi assistenza dalla nostra community

  • Ricevi assistenza dalla nostra community in merito alle personalizzazioni avanzate.

  • Affidati a uno Squarespace Expert

  • Fatti notare online con l'aiuto di un designer o di uno sviluppatore esperto.