Presentazione

Link in evidenza

1. Documentazione di Company XYZ sulle impostazioni dei controlli della presentazione
2. Documentazione di Company XYZ sul blocco Banner
3. Documentazione di Company XYZ sul blocco Blog post
4. Documentazione di Company XYZ sul blocco Image
5. Documentazione di Company XYZ sul blocco Product
6. Documentazione di Company XYZ sul blocco Rich text
7. Documentazione di Company XYZ sul blocco Testimonial
8. Documentazione di Company XYZ sul blocco Video
9. Documentazione di Company XYZ sulle impostazioni degli header
10. Documentazione di Company XYZ sulle impostazioni del padding della sezione
11. Documentazione di Company XYZ sulle impostazioni degli sfondi della sezione
12. Documentazione di Company XYZ sulle impostazioni dei separatori
13. Documentazione di Company XYZ sulle impostazioni di visibilità
14. Documentazione di Company XYZ sulle impostazioni delle larghezze del layout
15. Documentazione di Shopify sulle sezioni e i blocchi
16. Documentazione di Shopify sulla panoramica delle funzionalità dell’editor del tema

Video utili

Video di Shopify Academy: personalizzare il tuo negozio

Video di Shopify Academy: personalizzare il tuo negozio

Usa Slideshow per creare un’area di contenuto scorrevole o cliccabile con tipi di blocco misti, dalle semplici promozioni basate su immagini ai contenuti in evidenza multi-card. È una scelta ideale quando desideri varietà visiva pur controllando quanti elementi compaiono a ogni dimensione dello schermo e come i visitatori passano da una slide all’altra. Per una panoramica più ampia di come funzionano sezioni e blocchi nell’editor del tema, vedi documentazione Shopify su sezioni e blocchi

Impostazioni standard della sezione

Queste impostazioni definiscono il layout di base prima di rifinire il comportamento della presentazione. Controllano quanti blocchi sono visibili contemporaneamente e quanto uniformemente il contenuto si allinea in ogni riga.

Layout e comportamento reattivo

Imposta conteggi di colonne separati per desktop, tablet e mobile per controllare quanto densa risulta la presentazione a ogni dimensione dello schermo. Se il valore del tablet è impostato su 0, gli schermi tablet usano il conteggio di colonne del desktop, il che è utile quando vuoi gestire meno breakpoint.

Usa Stack on mobile quando ogni slide necessita di più spazio di lettura o quando i tipi di blocco misti risultano troppo stretti affiancati su schermi più piccoli. Questo crea un’esperienza più semplice a colonna singola.

Usa Stretch content vertically per fare in modo che i blocchi corrispondano all’altezza del blocco più alto in ogni riga. È particolarmente utile quando combini blocchi ricchi di testo con blocchi basati su immagini, perché mantiene l’aspetto generale della riga più pulito.

Consiglio

Se stai combinando prodotti, articoli e rich text nella stessa presentazione, inizia con meno colonne e mantieni abilitato lo stretching verticale per un layout più coerente.

Impostazioni della presentazione

Usa questi controlli per definire come i visitatori interagiscono con la sezione. Il riferimento ai controlli della presentazione è disponibile nelle impostazioni dei controlli della presentazione.

Animazione e transizioni

Scegli lo stile di animazione in base al tipo di presentazione che desideri. L’animazione predefinita funziona meglio per sfogliare più slide visibili, mentre Fade è adatta a uno storytelling più mirato in stile hero.

Fade impone un layout a slide singola e disattiva il comportamento in stile anteprima e la visualizzazione della paginazione.

La velocità dell’animazione cambia la rapidità con cui le slide passano da una all’altra. Un movimento più rapido può risultare più energico per le promozioni, mentre transizioni più lente di solito funzionano meglio per contenuti editoriali o visivi di fascia premium.

Autoplay e ripetizione

L’autoplay può rendere la sezione più dinamica, ma funziona meglio quando ogni slide è rapida da comprendere. Se le slide includono testo più lungo, dettagli di prodotto o video, un ritardo autoplay più esteso di solito offre un’esperienza migliore.

Pause on hover si applica solo su desktop e aiuta i visitatori a leggere o interagire senza che la presentazione si sposti. Loop slides è utile quando la sezione dovrebbe dare un’impressione di continuità invece di avere un punto finale chiaro.

Navigazione e paginazione

Usa Show navigation quando i visitatori devono avere un controllo manuale evidente. Questo è particolarmente importante per le presentazioni con contenuti misti o per qualsiasi layout in cui sono visibili più card contemporaneamente.

Navigation position ti permette di posizionare i controlli sopra o sotto il contenuto a seconda di quanto vuoi che risultino evidenti. Il posizionamento sotto il contenuto spesso appare più pulito nei layout basati sulle immagini, mentre il posizionamento sopra il contenuto può funzionare bene quando la sezione include anche un’heading.

La paginazione è più utile quando la presentazione mostra una sequenza o una sola slide principale alla volta. Gli stili frazione e barra di avanzamento sono spesso più facili da interpretare rispetto alla paginazione dinamica per slide ricche di contenuto.

Comportamento dell’anteprima delle slide

Show preview of next slides mostra una parte della card successiva per suggerire che è disponibile altro contenuto. Questo funziona meglio nei layout multi-card in cui vuoi incoraggiare la navigazione.

Se il layout già appare stretto, disattivare le anteprime può rendere la sezione più calma e più facile da leggere. Questa impostazione non si applica quando si usa l’animazione Fade.

Impostazioni dei colori

Queste sostituzioni di colore influenzano l’area dell’heading della sezione, non i singoli blocchi della slide. Usale quando il contenuto introduttivo deve distinguersi dalle impostazioni globali dei colori o da un trattamento di sfondo marcato.

Regola insieme i colori di icona, heading e sottotitolo in modo che l’introduzione rimanga leggibile. Se le tue slide usano già colori intensi o immagini forti, mantenere i colori dell’header della sezione più sobri di solito crea un equilibrio migliore.

Tipi di blocco supportati

1. Banner
2. Blog post
3. Image
4. Product
5. Rich text
6. Testimonial
7. Video

Banner

I blocchi Banner sono l’opzione più flessibile in questa sezione e sono ideali per promozioni, slide in stile hero e storytelling basato su immagini. Vedi il riferimento Banner block per le impostazioni specifiche del blocco.

Usa lo sfondo del blocco per la slide stessa, poi sovrapponi testo, pulsanti e media opzionali in primo piano. I blocchi Banner possono anche espandersi oltre il loro rapporto d’aspetto selezionato se il contenuto necessita di più spazio.

Articolo del blog

I blocchi Blog post mostrano card di articoli all’interno della presentazione. Vedi il riferimento Articolo del blog per i dettagli.

Funzionano bene per contenuti editoriali in evidenza o riepiloghi di articoli. Se ti serve un controllo visivo maggiore di quello offerto da una card articolo standard, usa invece un blocco Banner.

Immagine

I blocchi Image sono un modo semplice per aggiungere slide visive con didascalie, overlay, link e controllo dell’allineamento opzionali. Vedi il riferimento Immagine per i dettagli.

Sono utili per lookbook, immagini di campagna, slide con loghi o promozioni leggere. Aggiungi didascalie solo quando apportano un contesto chiaro.

Prodotto

I blocchi Product aggiungono card di prodotto acquistabili alla presentazione. Vedi il riferimento Prodotto per i dettagli.

Usali per articoli in evidenza, righe curate o selezioni correlate. Se mostri più dettagli del prodotto o controlli sulle varianti, riduci il numero di colonne visibili in modo che ogni card resti facile da leggere.

Testo ricco

I blocchi Rich text ti permettono di aggiungere slide orientate al messaggio con heading, testo principale, icone, pulsanti e sfondi di blocco opzionali. Vedi il riferimento Testo ricco per i dettagli.

Sono utili per annunci, proposte di valore o pause editoriali tra slide più visive. Poiché possono includere un proprio media di sfondo, possono risultare quasi simili a un banner pur rimanendo focalizzati sul testo.

Testimonianza

I blocchi Testimonial evidenziano citazioni dei clienti e possono facoltativamente collegare la citazione a un prodotto correlato. Vedi il riferimento Testimonianza per i dettagli.

Mantieni il testo della testimonianza piuttosto breve per ottenere i migliori risultati in un layout in movimento. Se aggiungi immagini o video, assicurati che la citazione resti la parte principale del messaggio.

Video

I blocchi Video ti permettono di inserire video ospitati o incorporati direttamente nella presentazione. Vedi il riferimento Video block per i dettagli.

Usa il video con moderazione nei caroselli con autoplay. Immagini poster, didascalie e overlay possono aiutare la slide a risultare più rifinita prima dell’inizio della riproduzione.

Attenzione

Evita un autoplay rapido della presentazione quando sono inclusi video, perché i visitatori hanno bisogno di tempo sufficiente per riconoscerli e interagirvi.

Impostazioni standard della sezione

Impostazioni dell’header

Usa le impostazioni condivise dell’header per introdurre la presentazione con una caption, un heading, testo di supporto, un’icona e un pulsante opzionale. La guida completa dell’header è disponibile nel riferimento alle impostazioni dell’header.

Un header di sezione è particolarmente utile quando la presentazione appare più in basso in una pagina o combina più tipi di contenuto. Mantienilo conciso così da incorniciare il contenuto senza competere con le slide.

Impostazioni di padding

Usa i controlli condivisi di padding per regolare lo spazio sopra e sotto il contenuto della sezione. Il riferimento completo al padding è disponibile nel riferimento al padding della sezione.

Aumenta il padding quando la presentazione dovrebbe sembrare un elemento autonomo. Riducilo quando la sezione deve integrarsi più strettamente in un layout di pagina più denso.

Impostazioni dello sfondo della sezione

Usa i controlli condivisi dello sfondo della sezione per aggiungere colore, gradienti, immagini, overlay o video dietro l’intera sezione. Il riferimento completo allo sfondo è disponibile nel riferimento agli sfondi della sezione.

Queste impostazioni influenzano il wrapper della sezione, non le singole slide. Sfondi marcati possono aggiungere profondità, ma rendono anche più importanti contrasto e spaziatura.

Se le singole slide usano già immagini forti, overlay o trattamenti cromatici, usa uno sfondo di sezione più sobrio per evitare competizione visiva.

Impostazioni dei separatori

Usa i controlli condivisi dei separatori per aggiungere una linea di divisione superiore o inferiore. Le opzioni dei separatori sono documentate nel riferimento ai separatori.

I separatori possono aiutare a definire la presentazione quando le sezioni circostanti usano sfondi simili. Usali con moderazione, così la pagina non sembra troppo incorniciata.

Impostazioni di visibilità

Usa i controlli condivisi di visibilità per decidere se la sezione appare su desktop, mobile o entrambi. Il comportamento della visibilità è documentato nel riferimento alle impostazioni di visibilità.

Questo è utile quando vuoi una presentazione mobile diversa altrove nella pagina o quando un layout complesso a più slide funziona bene solo su schermi più grandi.

Impostazioni di larghezza

Usa i controlli condivisi di larghezza per gestire sia la larghezza del contenuto sia la larghezza del wrapper della sezione. Le opzioni di larghezza sono documentate nel riferimento alle larghezze del layout.

La larghezza del contenuto controlla quanto può crescere il contenuto della presentazione, mentre la larghezza della sezione è più importante quando si usano sfondi. Poiché l’editor può limitare il modo in cui appaiono le modifiche alla larghezza, vale la pena controllare la pagina live prima di finalizzare le scelte di layout. Per un contesto correlato dell’editor del tema, vedi documentazione Shopify sulla panoramica delle funzionalità dell’editor del tema

Note sull’uso

1. Abbina le colonne al contenuto. Usa meno colonne quando le slide includono testo, pulsanti, valutazioni o video, così ogni elemento resta leggibile e facile da usare.
2. Scegli l’animazione con attenzione. Usa l’animazione predefinita per la navigazione tra più card e usa Fade solo quando vuoi una sola slide focalizzata alla volta.
3. Mantieni l’autoplay rilassato. Ritardi autoplay più lunghi funzionano meglio per presentazioni con contenuti misti, soprattutto quando le slide includono prodotti, testimonianze o video.
4. Evita sfondi in competizione. Se i blocchi usano già immagini forti o overlay, mantieni più semplice lo sfondo della sezione per migliorare contrasto e chiarezza.
5. Controlla il layout live. Rivedi lo stacking mobile, il comportamento delle colonne tablet, il posizionamento della navigazione e le modifiche alla larghezza sull’effettivo frontend prima di pubblicare.
6. Rivedi le modifiche guidate dai blocchi. Aggiungere o rimuovere blocchi può cambiare l’impressione complessiva della sezione, quindi ricontrolla spaziatura, equilibrio e utilità della navigazione dopo aver modificato l’elenco dei blocchi.