La pagina del prodotto è un elemento cruciale di qualsiasi negozio online. Personalizzandone le sezioni e i blocchi, puoi creare una pagina che sia informativa e persuasiva e che incoraggi gli utenti ad acquistare i tuoi prodotti o servizi.
La pagina Prodotto contiene più sezioni, costituite da blocchi. Questo articolo fornisce una panoramica del gruppo di sezioni del modello incluso in questi modelli.
Per impostazione predefinita, la pagina Prodotto ha le seguenti sezioni:
- Informazioni sul prodotto
- Cassetto dell'aiuto
- Eroe del video
- Collage
- Immagine con testo
- Testo scorrevole
- Dettagli del prodotto
- FAQ
- App
- Prodotti correlati
- Visualizzato recentemente
1. Informazioni sul prodotto
Questa sezione mostra le informazioni sul prodotto.
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| Informazioni sul prodotto | Abilita i contenuti permanenti sul desktop | Appone il contenuto del prodotto sullo schermo quando il cliente scorre verso il basso (o verso l'alto) le immagini del prodotto in evidenza. |
| Media | ||
| Larghezza del supporto desktop | La larghezza dei media sul desktop, che può essere regolata dal 35% al 70% per modificare la dimensione di questa sezione. | |
| Disposizione della scrivania | Visualizza il layout del desktop:
| |
| Zoom dell'immagine | 3 opzioni disponibili:
| |
| Nascondi i media di altre varianti dopo aver selezionato una variante | Quando viene selezionata una variante, le immagini di altre varianti vengono nascoste alla vista. Le immagini riappaiono quando la variante viene deselezionata. | |
| Abilita la riproduzione automatica del video | Riproduce il video automaticamente. | |
| Abilita il looping video | Riproduce il video ripetutamente. | |
| Disposizione mobile | Seleziona una delle due opzioni seguenti:
| |
| Mostra le miniature sui dispositivi mobili | Visualizza le miniature sul cellulare. | |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione stretta | Rende il contenitore stretto. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. |
Blocchi disponibili:
- 1.1 Pangrattato
- 1.2 Testo
- 1.3 Titolo
- 1.4 Prezzo
- 1.5 SKU
- 1.6 Stato dell'inventario
- 1.7 Selettore quantità
- 1.8 Selettore di varianti
- 1.9 Variazioni dei prodotti
- 1.10 Acquista pulsanti
- 1.11 Disponibilità del ritiro
- 1.12 Descrizione
- 1.13 Condividi
- 1.14 Help desk
- 1.15 Liquido personalizzato
- 1.16 Valutazione del prodotto
- 1.17 Prodotto complementare
- 1.18 Fila pieghevole
1.1 Le impostazioni per il blocco breadcrumb.
Abilita per mostrare la pagina delle raccolte nell'elenco breadcrumb.
1.2 Le impostazioni per il blocco Testo.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Testo | ||
| Testo | Aggiunge il tuo testo. | |
| Dimensione del testo | La dimensione del testo può essere impostata su una delle seguenti opzioni:
|
1.3 Le impostazioni per il cartiglio.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Titolo | ||
| Dimensione del titolo | La dimensione del titolo:
| |
| Mostra il prezzo del prodotto | Consente di visualizzare il prezzo del prodotto | |
| Mostra la valutazione del prodotto | Consente di visualizzare la valutazione del prodotto. |
1.4 Le impostazioni per il Blocco prezzo.
Abilita Mostra avviso tasse per visualizzare l'avviso tasse.
1.5 Le impostazioni per il blocco SKU.
Nessuna impostazione personalizzabile disponibile.
1.6 Le impostazioni per il blocco Stato inventario.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Stato dell'inventario | ||
| Soglia di inventario bassa | La quantità minima di un prodotto specifico che un'azienda desidera avere a disposizione in un dato momento. Scegli 0 per mostrare sempre in stock se disponibile. | |
| Mostra l'avviso di trasferimento di inventario | Visualizza l'avviso di trasferimento di inventario | |
| Combinazione di colori | Scegli una delle 6 opzioni seguenti:
|
1.7 Le impostazioni per il blocco selettore Qualità.
Nessuna impostazione personalizzabile disponibile.
1.8 Le impostazioni per il blocco selezione varianti.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Selettori di varianti | ||
| Mostra etichette delle varianti | Visualizza l'etichetta delle varianti. | |
| Tipo | Lo stile del selettore di varianti. Scegli Menu a discesa o Pulsante . | |
| Abilita campioni di colore Richiede che il tipo di selettore di varianti sia "Pulsante". | Visualizza le varianti di colore nei campioni. Ciò richiede il tipo di selezione della variante "Pulsante". Scopri come impostare i campioni . | |
| Tipo di campione | Scegli Campione colore o Immagine variante . | |
| Tabella di formato | Pagina della tabella delle taglie | Se vendi articoli di abbigliamento che richiedono ai clienti di conoscere la propria taglia prima di effettuare un acquisto, puoi aggiungere una tabella delle taglie personalizzata alla pagina del prodotto. Ecco come scegliere la pagina che rappresenta il contenuto della tabella delle taglie. |
1.9 Le impostazioni per il blocco Variazioni prodotto.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Variazioni del prodotto | ||
| Nome dell'opzione | Aggiunge il nome dell'opzione (Es: Colore, Stile... ) | |
| Metacampo del valore dell'opzione | Immette lo spazio dei nomi e la chiave del metacampo che contiene il valore. Ad esempio: custom.color | |
| Prodotto | Scegli i prodotti che desideri mettere in evidenza. Seleziona tutte le varianti (incluso il prodotto stesso). | |
| Campioni di colore | ||
| Abilita campioni di colore | Consente di visualizzare i campioni di colore. | |
| Tipo di campione | Seleziona una delle due opzioni seguenti: Campione colore o Immagine prodotto . | |
| Tabella di formato | Pagina della tabella delle taglie | Se vendi articoli di abbigliamento che richiedono ai clienti di conoscere la propria taglia prima di effettuare un acquisto, puoi aggiungere una tabella delle taglie personalizzata alla pagina del prodotto. Ecco come scegliere la pagina che rappresenta il contenuto della tabella delle taglie |
1.10 Le impostazioni per il blocco dei pulsanti Acquista.
In questo blocco viene visualizzato il pulsante "Aggiungi al carrello" e tutte le informazioni sul ritiro in negozio. Può anche mostrare eventuali pulsanti di pagamento dinamico.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Acquista bottoni | ||
| Mostra il selettore della quantità | Consente di visualizzare il selettore della quantità. | |
| Mostra i pulsanti di check-out dinamico | Utilizzando i metodi di pagamento disponibili nel tuo negozio, i clienti vedono la loro opzione preferita, come PayPal o Apple Pay. | |
| Mostra il modulo delle informazioni sul destinatario per i buoni regalo. | Consente agli acquirenti di inviare buoni regalo in una data programmata insieme a un messaggio personale. |
1.11 Le impostazioni per il blocco Disponibilità ritiro.
Consente ai tuoi clienti di visualizzare la disponibilità nei negozi al dettaglio impostando il ritiro locale .
1.12 Le impostazioni per il blocco Descrizione.
Seleziona la dimensione del testo descrittivo:
- Piccolo
- medio
- Grande
- Extra grande
1.13 Le impostazioni per il blocco Condividi.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Condividere | Testo | Aggiunge testo per il blocco. |
| Helpdesk | ||
| Mostra helpdesk | Consente di visualizzare l'help desk | |
| Etichetta di aiuto | Il testo descrive il blocco dell'etichetta della Guida. | |
| Tipo di aiuto | Seleziona tra Cassetto stile e Pagina stile per la pagina della Guida. | |
| Pagina di aiuto | Aggiunge l'URL che desideri collegare. |
1.14 Le impostazioni per il blocco Help Desk.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Helpdesk | ||
| Etichetta di aiuto | Il testo descrive il blocco dell'etichetta della Guida. | |
| Tipo di aiuto | Seleziona tra Cassetto stile e Pagina stile per la pagina della Guida. | |
| Pagina di aiuto | Seleziona una pagina a cui collegare il blocco Help desk. |
1.15 Le impostazioni per il blocco liquido personalizzato.
Puoi aggiungere il tuo codice Liquid per creare un blocco personalizzato. Saperne di più .
1.16 Le impostazioni per il blocco Valutazione del prodotto.
Visualizza la valutazione media del prodotto in stelle con il numero di recensioni tra parentesi, ad esempio: ★★★★★ (8). Richiede inoltre un'app per la revisione dei prodotti come Shopify Product Reviews e le definizioni dei metafield per Reviews.rating_count e Reviews.rating. Saperne di più .
1.17 Le impostazioni per il blocco Prodotti Complementari.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Prodotti complementari | ||
| Intestazione | Immette il testo per il prodotto complementare. | |
| Numero massimo di prodotti da mostrare | Il numero di prodotti complementari può variare da 1 a 10. | |
| Mostra venditore | Visualizza i fornitori dei prodotti. | |
| Mostra prezzo | Visualizza i prezzi dei prodotti. |
1.18 Le impostazioni per il blocco riga pieghevole.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Fila pieghevole | ||
| Icona | Scegli un'icona SVG predefinita che si adatti alla tua scheda pieghevole. L'opzione Nessuna disabiliterà l'icona. | |
| Intestazione | Il titolo della scheda. Viene visualizzato quando compresso ed espanso. | |
| Contenuto della riga | Il contenuto della scheda. Viene visualizzato solo quando la scheda viene espansa. | |
| Riga contenuto dalla pagina | Visualizza il contenuto di una pagina nella scheda. Visualizza solo il contenuto della pagina dall'editor della pagina, in questo blocco non viene visualizzato lo stile Liquid dal modello della pagina. Qualsiasi contenuto immesso nel contenuto della scheda viene visualizzato sopra il contenuto della pagina. |
2. Cassetto della guida
Questa sezione offre ai clienti un accesso rapido e semplice alle informazioni, come i prodotti, i servizi e le politiche del negozio .
| Impostazioni della sezione | Impostazioni | Descrizione | Cassetto dell'aiuto |
|---|---|---|
| Intestazione | Il titolo della sezione. | |
| Descrizione | Il testo descrittivo dell'intestazione viene posizionato sotto l'intestazione. |
Blocco disponibile: blocco di contenuti.
Le impostazioni per il blocco Contenuto.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Contenuto | ||
| Icona | Seleziona l'icona per il contenuto nell'elenco. | |
| Intestazione | Testo di grandi dimensioni per il titolo del contenuto. | |
| Testo | Aggiunta del testo. Esempio: condividere informazioni di contatto, dettagli del negozio e contenuti del marchio con i tuoi clienti. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
|
3. Eroe del video
.
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| Eroe del video | Consenti intestazione trasparente | Questa impostazione si applica solo quando questa sezione è la prima. |
| Video ospitato da Shopify | video | Sceglie un video dal video ospitato da Shopify. |
| Incorpora video dall'URL | ||
| URL | Il collegamento YouTube o Vimeo al video. Il video deve essere disponibile al pubblico. | |
| Immagine di copertina | L'immagine visualizzata prima che il cliente riproduca il video. | |
| Testo alternativo del video | Descrive il video per renderlo accessibile ai clienti che utilizzano le utilità per la lettura dello schermo. | |
| Abilita la riproduzione automatica del video | Riproduce il video automaticamente. | |
| Larghezza del contenuto del desktop | Determina la larghezza dell'immagine quando viene visualizzata sul desktop:
| |
| Disposizione mobile | ||
| Videomobile | Scegli/carica un video caricandolo su un browser mobile. | |
| Oppure incorpora video dall'URL | Incorpora un video dall'URL su un browser mobile. | |
| Immagine di copertina del cellulare | L'immagine che viene visualizzata prima che un cliente riproduca il video sul browser del dispositivo mobile. | |
| Altezza mobile | Determina l'altezza dell'immagine quando viene visualizzata su dispositivo mobile:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione a larghezza intera | Rendi il contenitore a tutta larghezza. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. | |
| CSS personalizzato | Aggiunge CSS personalizzato a questa sezione. |
Blocco disponibile: blocco scorrevole.
Le impostazioni per il blocco Diapositiva.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Diapositiva | ||
| Intestazione | Il titolo del blocco. | |
| Dimensione dell'intestazione | La dimensione dell'intestazione può essere impostata su una delle seguenti opzioni: Piccola , Media , Grande o Extragrande . | |
| Etichetta di intestazione | Seleziona il tag di intestazione per strutturare e organizzare i tuoi contenuti per il SEO. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
|
4. Collage
Questa sezione crea un collage di video o immagini in due colonne. Per impostazione predefinita, la sezione contiene un blocco video, prodotto e raccolta.
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| Intestazione | ||
| Intestazione | Il titolo della sezione. | |
| Dimensione dell'intestazione | La dimensione dell'intestazione può essere impostata su una delle seguenti opzioni: Piccola , Media , Grande o Extralarge . | |
| Allineamento della rotta | L'intestazione può essere allineata a sinistra , al centro o a destra . | |
| Etichetta di intestazione | Seleziona il tag di intestazione per strutturare e organizzare i tuoi contenuti per il SEO. | |
| Sottotitolo | Il sottotitolo dell'intestazione è posizionato sopra l'intestazione. | |
| Descrizione | Il testo descrittivo dell'intestazione viene posizionato sotto l'intestazione. | |
| Etichetta del pulsante | Il testo visualizzato sul pulsante. | |
| Collegamento pulsante | L'URL del pulsante. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione stretta | Rende il contenitore stretto. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. | |
| Abilita l'effetto parallasse | Abilita l'effetto parallasse, che crea l'illusione della profondità in un'immagine o scena bidimensionale. | |
| CSS personalizzato | Aggiunge CSS personalizzato a questa sezione. | |
Blocchi disponibili:
- 4.1 Blocco immagine
- 4.2 Blocco video
4.1 Le impostazioni per il blocco Immagine.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Immagine | ||
| Sottotitolo | Il sottotitolo dell'intestazione è posizionato sopra l'intestazione. | |
| Intestazione | Il titolo del blocco. | |
| Collegamento | Il collegamento a cui vuoi che i clienti indirizzino se fanno clic. | |
| Invertire sottotitolo e titolo | Gli scambi posizionano l'intestazione e il sottotitolo. | |
| Immagine | Scegli/carica un'immagine per il blocco. | |
| Rapporto immagine | Le proporzioni delle immagini per le immagini dei post del blog:
| |
| Posizione del contenuto del desktop | La posizione del contenuto sul desktop:
| |
| Allineamento dei contenuti del desktop | L'allineamento del contenuto sul desktop:
| |
| Disposizione mobile | ||
| Immagine mobile | L'immagine del blocco visualizzata sul cellulare. | |
| Rapporto immagine mobile | Il rapporto immagine per le immagini sul browser mobile:
| |
| Posizione dei contenuti mobili | La posizione del contenuto sul browser mobile:
| |
| Allineamento dei contenuti mobili | L'allineamento del contenuto sul browser mobile:
| |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
4.2 Le impostazioni per il blocco Video.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| video | ||
| Sottotitolo | Il sottotitolo dell'intestazione è posizionato sopra l'intestazione. | |
| Intestazione | Il titolo del blocco. | |
| Collegamento | Il collegamento a cui vuoi che i clienti indirizzino se fanno clic. | |
| Invertire sottotitolo e titolo | Gli scambi posizionano l'intestazione e il sottotitolo. | |
| Video ospitato da Shopify | video | Sceglie un video dal video ospitato da Shopify |
| Incorpora video dall'URL | ||
| URL | Il collegamento YouTube o Vimeo al video. Il video deve essere disponibile al pubblico. | |
| Immagine di copertina | L'immagine visualizzata prima della riproduzione del video. | |
| Testo alternativo del video | Descrivi il video per renderlo accessibile ai clienti che utilizzano gli screen reader. | |
| Abilita la riproduzione automatica del video | Riproduzione automatica del video. | |
| Abilita il looping video | Riproduzione ripetuta del video. | |
| Rapporto immagine | Le proporzioni delle immagini per le immagini dei post del blog:
| |
| Posizione del contenuto del desktop | Imposta la posizione del contenuto sul desktop:
| |
| Allineamento dei contenuti del desktop | Imposta l'allineamento del contenuto sul desktop:
| |
| Disposizione mobile | ||
| Videomobile | Scegli/carica un video caricandolo per il browser mobile. | |
| Oppure incorpora video dall'URL | Incorpora un video da un URL su un browser mobile. | |
| Immagine di copertina del cellulare | L'immagine visualizzata prima della riproduzione del video sul dispositivo mobile. | |
| Rapporto immagine mobile | Il rapporto immagine per le immagini sul browser desktop:
| |
| Posizione dei contenuti mobili | Imposta la posizione del contenuto sul browser mobile:
| |
| Allineamento dei contenuti mobili | Imposta l'allineamento del contenuto sul browser mobile:
| |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
5. Immagine con testo
Puoi aggiungere una sezione che contiene un'immagine e un blocco di testo con un pulsante opzionale per collegare i clienti a una nuova pagina. Abbina il testo a un'immagine per concentrarti sul prodotto, sulla collezione o sul post del blog che hai scelto. Aggiungi dettagli su disponibilità, stile o fornisci anche una recensione.
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| Immagine con testo | ||
| Immagine | L'immagine per la sezione visualizzata sul browser desktop. | |
| Altezza del tavolo | Determina l'altezza dell'immagine quando viene visualizzata sul desktop:
| |
| Larghezza dell'immagine del desktop | Determina la larghezza dell'immagine quando viene visualizzata sul desktop: Piccola, Media o Grande | |
| Posizionamento delle immagini sul desktop | Il layout della sezione sul desktop:
| |
| Allineamento dei contenuti del desktop | Imposta l'allineamento del contenuto sul desktop:
| |
| Disposizione mobile | ||
| Immagine mobile | L'immagine per la sezione visualizzata sul browser mobile. | |
| Altezza mobile | Determina l'altezza dell'immagine quando viene visualizzata su dispositivo mobile:
| |
| Allineamento dei contenuti mobili | Imposta l'allineamento del contenuto sul browser mobile:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione stretta | Rende il contenitore stretto. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. | |
| Abilita l'effetto parallasse | Abilita la visualizzazione dell'effetto parallasse, che crea l'illusione della profondità in un'immagine o scena bidimensionale. | |
| CSS personalizzato | Aggiunge CSS personalizzato a questa sezione. | |
Blocchi disponibili:
- 5.1 Intestazione
- 5.2 Testo
- 5.3 Pulsante
- 5.4 Collegamento
- 5.5 Immagine
- 5.6 Liquido personalizzato
- 5.7 Spazio vuoto
5.1 Le impostazioni per il blocco Titolo.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Intestazione | ||
| Intestazione | Il titolo del blocco. | |
| Dimensione dell'intestazione | La dimensione dell'intestazione può essere impostata su una delle seguenti opzioni: Piccola , Media , Grande o Extragrande . | |
| Etichetta di intestazione | Seleziona il tag di intestazione per strutturare e organizzare i tuoi contenuti per il SEO. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
|
5.2 Le impostazioni per il blocco Testo.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Testo | ||
| Testo | Aggiunta del testo. | |
| Dimensione del testo | La dimensione del testo può essere impostata su una delle seguenti opzioni:
L'opzione personalizzata ti consente di impostare la dimensione del testo su qualsiasi valore desideri, da 12px a 128px, aumentando aritmeticamente di 2 px. | |
| Carattere del testo | Scegli tra 2 opzioni per la formattazione del testo: Corpo o Intestazione . | |
| Usa il colore secondario | Abilita colore secondario. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
|
5.3 Le impostazioni per il blocco Button.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Pulsante | ||
| Etichetta del pulsante | Il testo visualizzato sul pulsante. | |
| Collegamento pulsante | L'URL del pulsante. | |
| Dimensione del pulsante | Regola la dimensione del pulsante in 3 opzioni: Piccolo, Medio o Grande | |
| Utilizza lo stile del pulsante di contorno | Utilizza lo stile di struttura per il pulsante. |
5.4 Le impostazioni per il blocco Link.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Collegamento | ||
| Testo | Il testo del collegamento, che si trova proprio accanto al pulsante. | |
| Collegamento | Aggiungi l'URL che desideri collegare. |
5.5 Le impostazioni per il blocco Immagine.
| Impostazioni di blocco | Impostazioni | Descrizione | Immagine |
|---|---|---|
| Immagine | Seleziona un'immagine per il blocco. | |
| Larghezza dell'immagine | Sceglie una delle due opzioni di larghezza dell'immagine:
|
5.6 Le impostazioni per il blocco liquido personalizzato.
Puoi aggiungere il tuo codice Liquid per creare un blocco personalizzato.
5.7 Le impostazioni per il blocco Spazio vuoto.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Spazio vuoto | ||
| Altezza del tavolo | Determina l'altezza dello spazio vuoto quando visualizzato sul desktop. Può variare da 0 px a 120 px, aumentando aritmeticamente di 4 px. L'impostazione predefinita è 40 px. | |
| Altezza mobile | Determina l'altezza dello spazio vuoto quando visualizzato su dispositivo mobile. Può variare da 0 px a 120 px, aumentando aritmeticamente di 4 px. L'impostazione predefinita è 28 px. |
6. Testo scorrevole
Questa sezione consente la creazione di testo scorrevole che si muove sullo schermo. Può essere utilizzato per visualizzare molte informazioni in un piccolo spazio, attirare l'attenzione o per altri scopi.
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| Testo scorrevole | ||
| Direzione | Selezionare la direzione di scorrimento desiderata:
| |
| Velocità | Determina la velocità del testo scorrevole. Può variare da 0,5/100px a 2,5/100px, aumentando aritmeticamente di 0,1/100px. | |
| Spazio orizzontale | La spaziatura tra i testi varia da 50px a 200px, aumentando con incrementi di 5px. | |
| Abilita i tendoni gemelli | Visualizza due selezioni contemporaneamente | |
| Abilita l'effetto parallasse | Abilita l'effetto parallasse, che crea l'illusione della profondità in un'immagine o scena bidimensionale. Questa impostazione può essere utilizzata per evidenziare il testo scorrevole. | |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione stretta | Rende il contenitore stretto. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. | |
| CSS personalizzato | Aggiunge CSS personalizzato a questa sezione. | |
Blocchi disponibili:
- Blocco di testo
- Blocco immagine
6.1 Le impostazioni per il blocco Testo.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Testo | ||
| Testo | Aggiunta del testo. | |
| Dimensione del testo | La dimensione del testo può essere impostata da 12px a 180px. | |
| Carattere del testo | Scegli tra 2 opzioni per la formattazione del testo: Corpo o Intestazione . | |
| Testo dello stampino | Abilita testo stencil. Potrebbe non funzionare in tutti i browser. |
6.2 Le impostazioni per il blocco Immagine.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Testo | ||
| Immagine | Seleziona un'immagine per il blocco. | |
| Altezza dell'immagine | L'altezza dell'immagine può essere impostata tra 12px e 180px. |
7. Dettagli del prodotto
Questa sezione mostra le informazioni sul prodotto.
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| Dettagli del prodotto | ||
| Apri la prima riga pieghevole | Consente di aprire la prima riga pieghevole. | |
| Rubrica specifiche | Aggiunge il tuo testo, che verrà incluso nella casella. | |
| Intestazione | ||
| Intestazione | Il titolo della sezione. | |
| Dimensione dell'intestazione | La dimensione dell'intestazione può essere impostata su una delle seguenti opzioni: Piccola , Media , Grande o Extragrande . | |
| Allineamento della rotta | L'intestazione può essere allineata a sinistra , al centro o a destra . | |
| Etichetta di intestazione | Seleziona il tag di intestazione per strutturare e organizzare i tuoi contenuti per il SEO. | |
| Sottotitolo | Il sottotitolo dell'intestazione è posizionato sopra l'intestazione. | |
| Descrizione | Il testo descrittivo dell'intestazione viene posizionato sotto l'intestazione. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione stretta | Rende il contenitore stretto. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. | |
| CSS personalizzato | Aggiunge CSS personalizzato a questa sezione. | |
Blocchi disponibili:
- 7.1 Descrizione
- 7.2 Riga pieghevole
- 7.3 Specifica
7.1 Le impostazioni per il blocco Descrizione.
Intestazione : aggiunge il testo dell'intestazione.
7.2 Le impostazioni per il blocco riga pieghevole.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| fila pieghevole | ||
| Intestazione | Il titolo della scheda. Viene visualizzato quando compresso ed espanso. | |
| Contenuto della riga | Il contenuto della scheda. Viene visualizzato solo quando la scheda viene espansa. | |
| Metacampi | Inserisci lo spazio dei nomi e la chiave del metafield che contiene il valore. Ogni metafield deve trovarsi nella propria riga. |
7.3 Le impostazioni per il blocco Specifica.
| Impostazioni di blocco | Impostazioni | Descrizione | | Icona | Seleziona/carica l'immagine di un'icona. | Intestazione | Il titolo del blocco. | |
|---|
8. Domande frequenti
Questa sezione mostra informazioni sulle domande frequenti.
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| FAQ | Stile | Scegli Con stile bordo o Con stile sfondo per visualizzare la sezione |
| Intestazione | ||
| Intestazione | Il titolo della sezione. | |
| Dimensione dell'intestazione | La dimensione dell'intestazione può essere impostata su una delle seguenti opzioni: Piccola , Media , Grande o Extragrande . | |
| Allineamento della rotta | L'intestazione può essere allineata a sinistra , al centro o a destra . | |
| Etichetta di intestazione | Seleziona il tag di intestazione per strutturare e organizzare i tuoi contenuti per il SEO. | |
| Sottotitolo | Il sottotitolo dell'intestazione è posizionato sopra l'intestazione. | |
| Descrizione | Il testo descrittivo dell'intestazione viene posizionato sotto l'intestazione. | |
| Etichetta del pulsante | Il testo visualizzato sul pulsante. | |
| Collegamento pulsante | L'URL del pulsante. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione stretta | Rende il contenitore stretto. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. | |
| CSS personalizzato | Aggiunge CSS personalizzato a questa sezione. | |
Blocchi disponibili:
- 8.1 Testo ricco
- 8.2 Domanda
- 8.3 Modulo di contatto
8.1 Le impostazioni per il blocco Rich text.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Testo ricco | ||
| Titolo | Il titolo del blocco. | |
| Testo | Aggiunge testo descrittivo per questo blocco. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
|
8.2 Le impostazioni per il blocco Domande.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Domanda | ||
| Domanda | Aggiunge una domanda frequente. | |
| Risposta | Aggiunge la risposta. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
|
8.3 Le impostazioni per il blocco del modulo di contatto.
| Impostazioni di blocco | Impostazioni | Descrizione |
|---|---|---|
| Modulo di Contatto | ||
| Intestazione | Il titolo del blocco. | |
| Testo | Il testo da visualizzare nel blocco. | |
| Mostra il numero di telefono | Visualizza il numero di telefono. | |
| Avatar della squadra | Scegli/carica un'immagine per visualizzare l'avatar della squadra. | |
| Altezza dell'avatar della squadra | L'altezza dell'avatar della squadra può essere regolata da 20px a 100px. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
|
9. App
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| Shopify Recensioni dei prodotti | Abilita l'integrazione delle recensioni dei prodotti Installa l' app Shopify Product Reviews per utilizzare questa funzionalità. Viene visualizzato solo sulle pagine dei prodotti. | Consente di mostrare l'integrazione delle recensioni dei prodotti. Adatta l'app Recensioni prodotti all'aspetto del tema. Disattiva per utilizzare il design originale dell'app. |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione stretta | Rende il contenitore stretto. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. | |
| CSS personalizzato | Aggiunge CSS personalizzato a questa sezione. | |
Questa sezione non supporta l'aggiunta di blocchi.
10. Prodotti correlati
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| Prodotti correlati | ||
| Numero di prodotti correlati | Seleziona da 2 a 12 prodotti da visualizzare in questa sezione. | |
| Numero di colonne sul desktop | Personalizza il numero di colonne visualizzate sul desktop da 1 a 5. | |
| Abilita il carosello sul desktop | Visualizza un carosello di prodotti sul desktop. | |
| Disposizione mobile | ||
| Numero di colonne su dispositivi mobili | Personalizza il numero di colonne visualizzate sul cellulare: 1 colonna o 2 colonne . | |
| Abilita lo scorrimento sul cellulare | ||
| Intestazione | ||
| Intestazione | Il titolo della sezione. | |
| Dimensione dell'intestazione | La dimensione dell'intestazione può essere impostata su una delle seguenti opzioni: Piccola , Media , Grande o Extragrande . | |
| Allineamento della rotta | L'intestazione può essere allineata a sinistra , al centro o a destra . | |
| Etichetta di intestazione | Seleziona il tag di intestazione per strutturare e organizzare i tuoi contenuti per il SEO. | |
| Sottotitolo | Il sottotitolo dell'intestazione è posizionato sopra l'intestazione. | |
| Descrizione | Il testo descrittivo dell'intestazione viene posizionato sotto l'intestazione. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione stretta | Rende il contenitore stretto. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. | |
| CSS personalizzato | Aggiunge CSS personalizzato a questa sezione. | |
Questa sezione non supporta l'aggiunta di blocchi.
11. Visti di recente
Aiuta i tuoi clienti a trovare i prodotti che avevano precedentemente visitato e spingerli all'acquisto. In questo modo è più facile per i tuoi clienti ritrovarli piuttosto che orientarsi attraverso il menu di navigazione.
| Impostazioni della sezione | Impostazioni | Descrizione |
|---|---|---|
| Visualizzato recentemente | ||
| Numero di prodotti recenti | Il numero di prodotti complementari può variare da 2 a 12. | |
| Numero di colonne sul desktop | Personalizza il numero di colonne visualizzate sul browser desktop da 1 colonna a 5 colonne | |
| Abilita il carosello sul desktop | Visualizza un carosello di prodotti della collezione su un browser desktop. | |
| Disposizione mobile | ||
| Numero di colonne su dispositivi mobili | Personalizza il numero di colonne visualizzate sul browser mobile: 1 colonna o 2 colonne . | |
| Abilita lo scorrimento sul cellulare | Imposta la visualizzazione mobile su una riga con scorrimento orizzontale. | |
| Intestazione | ||
| Intestazione | Il titolo della sezione. | |
| Dimensione dell'intestazione | La dimensione dell'intestazione può essere impostata su una delle seguenti opzioni: Piccola , Media , Grande o Extragrande . | |
| Allineamento della rotta | L'intestazione può essere allineata a sinistra , al centro o a destra . | |
| Etichetta di intestazione | Seleziona il tag di intestazione per strutturare e organizzare i tuoi contenuti per il SEO. | |
| Sottotitolo | Il sottotitolo dell'intestazione è posizionato sopra l'intestazione. | |
| Descrizione | Il testo descrittivo dell'intestazione viene posizionato sotto l'intestazione. | |
| Testo evidenziato | ||
| Testo evidenziato | Scegli tra una delle 6 opzioni seguenti per formattare il testo:
| |
| Scarabocchio evidenziato Richiede che lo stile del testo evidenziato sia impostato su Scarabocchio disegnato a mano. | Questa impostazione offre 5 modi per evidenziare il testo:
| |
| Colore | Facoltativamente è possibile personalizzare i colori della sezione, inclusi i seguenti:
| |
| Sezione | ||
| Può regolare l'imbottitura nell'imbottitura superiore e nell'imbottitura inferiore da 0px a 120px, aumentando aritmeticamente di 4px. | ||
| Mostra divisore di sezione | Mostra un divisore di linea sopra questa sezione. | |
| Rendi la sezione stretta | Rende il contenitore stretto. | |
| Rendi la sezione arrotondata | Applica un bordo arrotondato ai due angoli superiori. | |
| CSS personalizzato | Aggiunge CSS personalizzato a questa sezione. | |
Questa sezione non supporta l'aggiunta di blocchi.
Speriamo che questo articolo sia stato utile. Se hai domande o dubbi su questa funzionalità, non esitare a contattare il nostro team per ricevere supporto.
