Personalizzazione del tuo negozio online tramite l'editor del tema
Puoi utilizzare l'editor del tema per personalizzare le aree del tuo tema, come i colori, e gestire i contenuti del tuo tema con sezioni e blocchi. L'editor del tema include le seguenti sezioni:
- La barra dei menu visualizza gli strumenti che consentono di scoprire ulteriori informazioni sul tema, di navigare tra i diversi modelli del tema, come le pagine dei prodotti, di regolare la visualizzazione delle dimensioni dello schermo e di gestire le azioni di personalizzazione.
- Il menu sidebar mostra una vista ad albero di tutto il contenuto del modello che stai visualizzando nella barra laterale. Puoi gestire sezioni, blocchi e impostazioni dal menu sidebar.
- La finestra di anteprima mostra il tema e si aggiorna automaticamente quando apporti modifiche. Puoi selezionare diverse opzioni di visualizzazione nella barra dei menu per visualizzare in anteprima il tema sui layout per desktop o dispositivi mobili. Puoi anche attivare Preview Inspector per gestire il contenuto di un modello di tema nella finestra di anteprima.
Su questa pagina
- Accesso all'editor del tema
- Barra dei menu
- Visualizzare la documentazione, ricevere assistenza e controllare la versione del tema
- Ricevere assistenza per la personalizzazione
- Utilizzo delle scorciatoie da tastiera nell'editor del tema
- Modelli
- Anteprima del modello con risorse specifiche
- Preview Inspector
- Visualizzazione di dimensioni dello schermo diverse nell'editor del tema
- Menu sidebar
- Sezioni e blocchi
Accesso all'editor del tema
Puoi accedere all'editor del tema dal pannello di controllo Shopify.
Dal pannello di controllo Shopify, vai su Negozio online > Temi.
Accanto al tema che desideri modificare, clicca su Personalizza.
Barra dei menu
La barra dei menu contiene informazioni sul tema, i menu per accedere a informazioni più dettagliate e ad aree diverse del tema, oltre ai controlli per personalizzarlo.
La barra dei menu visualizza le seguenti informazioni aggiuntive e opzioni di navigazione:
- Utilizza il pulsante
per tornare al pannello di controllo Shopify. - Controlla il nome del tuo tema.
- Controlla lo stato del tuo tema. Il tema pubblicato visualizza l'etichetta di stato Live. I temi non pubblicati visualizzano l'etichetta di stato Bozza.
- Utilizza il menu
per accedere alle seguenti opzioni aggiuntive:
- Utilizza 
Modifica codice per aprire l’editor di codice.
- Utilizza 
Modifica contenuto tema predefinito per modificare le frasi predefinite del tuo tema.
- Utilizza 
per aprire un’anteprima del tema.
- Utilizza 
Visualizza documentazione per aprire la documentazione del tema.
- Utilizza 
per rivedere tutte le scorciatoie da tastiera disponibili per l'editor del tema.
- Utilizza 
Ricevi assistenza per ricevere assistenza.
Puoi accedere a diversi modelli e layout di mercato tramite i seguenti menu:
Puoi utilizzare i seguenti controlli nella barra dei menu per personalizzare il tuo tema:
- Attiva o disattiva Sidekick.
- Attiva o disattiva Preview inspector.
- Modifica le dimensioni dello schermo con i controlli delle dimensioni dello schermo.
- Gestisci la sessione di personalizzazione corrente con i controlli Annulla e Ripeti.
- Utilizza il pulsante Salva per salvare le modifiche.
Visualizzare la documentazione, ricevere assistenza e controllare la versione del tema
Puoi visualizzare le informazioni disponibili sul tuo tema, come la versione del tema e le informazioni sullo sviluppatore, nonché i link alla documentazione e alle informazioni di supporto del tema nel menu che si trova nella barra dei menu.
Ricevere assistenza per la personalizzazione
Se hai bisogno di aiuto per apportare modifiche al tema, puoi contattare lo sviluppatore del tema per assistenza.
Per verificare quali altre risorse sono disponibili per aiutarti con la personalizzazione del tema, consulta la sezione relativa alle risorse aggiuntive per l'assistenza con i temi.
Utilizzo delle scorciatoie da tastiera nell'editor del tema
Puoi utilizzare le scorciatoie da tastiera per navigare ed eseguire azioni nell'editor del tema.
| Categoria | Azione | Scorciatoia per Windows | Scorciatoia per macOS |
|---|---|---|---|
| Generale | Annulla |
CTRL + Z
|
⌘ + Z
|
| Ripeti |
CTRL + Y
|
⌘ + Y
| |
| Salva |
CTRL + S
|
⌘ + ⇧ + S
| |
| Vedi tutte le scorciatoie |
CTRL + /
|
⌘ + /
| |
| Strumenti | Preview Inspector |
CTRL + MAIUSC + |
|
⌘ + ⇧ + |
|
| Modalità anteprima |
⊞ + CTRL + |
|
⌘ + ⌃ + |
| |
| Sidekick |
CTRL + .
|
⌘ + .
| |
| Navigazione | Sezioni |
⊞ + CTRL + Z
|
⌘ + ⌃ + 1
|
| Impostazioni tema |
⊞ + CTRL + Z
|
⌘ + ⌃ + 2
| |
| Incorporazioni app |
⊞ + CTRL + Z
|
⌘ + ⌃ + 3
| |
| Sezioni e blocchi | Mostra e nascondi |
CTRL + MAIUSC + H
|
⌘ + ⇧ + H
|
| Rimuovi |
MAIUSC + ⭠
|
⇧ + ⌫
| |
| Seleziona precedente |
MAIUSC + ←
|
⇧ + ▲
| |
| Seleziona successivo |
MAIUSC + →
|
⇧ + ▼
| |
| Apri elemento selezionato |
MAIUSC + INVIO
|
⇧ + ▼
| |
| Espandi tutte le sezioni |
CTRL + MAIUSC + O
|
⌘ + ⇧ + O
| |
| Comprimi tutte le sezioni |
CTRL + MAIUSC + P
|
⌘ + ⇧ + P
|
Modelli
Puoi accedere a tutti i modelli del tema dal selettore di pagina nella barra in alto dell'editor del tema.
Se utilizzi un tema per Online Store 2.0, puoi anche creare un nuovo modello direttamente dal selettore di pagina cliccando sull'opzione New template (Nuovo modello).
Anteprima del modello con risorse specifiche
Puoi visualizzare l'anteprima del modello con qualsiasi risorsa compatibile nel tuo negozio. Ad esempio, se visualizzi un modello di prodotto puoi testarlo con qualsiasi prodotto del tuo negozio.
Devi comunque assegnare il modello alla risorsa nel pannello di controllo Shopify.
Puoi anche cercare modelli e risorse utilizzando la barra Cerca nel selettore di pagina, nello strumento Aggiungi sezione o Aggiungi blocco o nelle Incorporazioni app.
Passaggi:
Dal pannello di controllo Shopify, vai su Negozio online > Temi.
Accanto al tema che desideri modificare, clicca su Personalizza.
Nel menu dei modelli seleziona il modello che vuoi visualizzare in anteprima.
Nel menu sidebar, accedi alla sezione Anteprima e clicca su Modifica.
Dal menu Seleziona, seleziona la risorsa che desideri visualizzare in anteprima.
Preview Inspector
Preview Inspector permette di accedere a sezioni e blocchi direttamente dalla finestra di anteprima e di trovare le impostazioni corrispondenti in modo più rapido e intuitivo. Con Preview Inspector puoi riordinare, nascondere o duplicare sezioni e blocchi direttamente dalla finestra di anteprima.
Preview Inspector è disponibile per tutti i temi Shopify gratuiti ed è attivato per impostazione predefinita. Puoi cliccare sul pulsante 
per attivare o disattivare questa funzionalità durante la sessione di modifica.
Quando Preview Inspector è attivato, puoi cliccare su qualsiasi elemento evidenziato per aprire l'impostazione corrispondente. Su un dispositivo mobile, quando Preview Inspector è attivato, puoi cliccare su qualsiasi elemento per selezionare l'impostazione corrispondente. Puoi aprire la scheda in basso per apportare modifiche tramite questa impostazione selezionata.
Preview Inspector mostra uno dei due bordi riportati di seguito intorno alle sezioni e ai blocchi cliccati nella finestra di anteprima:
- La linea blu continua indica la sezione attiva. L'impostazione corrispondente nel menu sidebar viene evidenziata in grigio.
- La linea blu tratteggiata indica il blocco associato alla sezione. Clicca sull'articolo nella finestra di anteprima per aprire le impostazioni del blocco o della sezione.
Cliccando su qualsiasi punto del tuo sito web, nella finestra di anteprima verranno caricate le impostazioni corrispondenti della sidebar. Toccando due volte su un dispositivo mobile è possibile navigare sul sito come farebbe un cliente.
Aggiunta di sezioni e blocchi in Preview Inspector
Utilizzando l'ispettore di anteprima, puoi aggiungere sezioni e blocchi al tuo tema direttamente dalla finestra di anteprima. Per utilizzare l'ispettore di anteprima dall'app di Shopify, premi a lungo su una sezione per gestirla.
| Strumento | Descrizione |
|---|---|
| Aggiungi sezione | Il pulsante Aggiungi sezione viene visualizzato nella parte superiore e inferiore della sezione selezionata. Clicca sul pulsante Aggiungi sezione per inserire una nuova sezione sopra o sotto la sezione selezionata. |
| Aggiungi blocco | Il pulsante Aggiungi blocco viene visualizzato al passaggio del mouse su un blocco esistente. Per aggiungere un blocco, sposta il cursore sul pulsante  . Verrà visualizzato un menu popup con il tema e i blocchi delle app che possono essere aggiunti alla sezione selezionata. Clicca sul blocco che desideri aggiungere. La finestra delle impostazioni del nuovo blocco si carica nella sidebar di destra.
|
Strumenti Preview Inspector
Con Preview Inspector puoi spostare, nascondere, duplicare o eliminare sezioni e blocchi dall'editor del tema.
| Strumento | Azione | Descrizione |
|---|---|---|
 | Passa alla posizione precedente | Clicca su questo pulsante per spostare una sezione o un blocco nella posizione successiva o precedente, utilizzando le icone a forma di freccia in Preview Inspector. Se la sezione selezionata si trova nella parte superiore della pagina, il pulsante viene disattivato. Allo stesso modo, se la sezione si trova in fondo alla pagina, non puoi utilizzare il pulsante  . |
| Passa alla posizione successiva | |
 | Duplica sezione o blocco | Clicca su questo pulsante per duplicare una sezione o un blocco e il suo contenuto. |
 | Hide section or block (Nascondi sezione o blocco) | Clicca su questo pulsante per nascondere una sezione o un blocco. Se una sezione o un blocco sono nascosti, non sarà possibile visualizzarli nuovamente in Preview Inspector. Puoi cliccare sul pulsante  nella barra dei menu oppure cliccare sul pulsante nel menu sidebar accanto alla sezione o al blocco per mostrarli. |
 | Delete section or block (Elimina sezione o blocco) | Questo pulsante elimina la sezione o il blocco selezionati in Preview Inspector. |
Visualizzazione di dimensioni dello schermo diverse nell'editor del tema
Puoi visualizzare diverse dimensioni dello schermo nel tuo editor del tema. Puoi modificare l'editor del tema in modo da visualizzare il formato desktop, mobile o a schermo intero per assicurarti che le modifiche apportate al tema siano ottimali per le diverse dimensioni dello schermo e per verificare i layout alternativi per desktop e dispositivo mobile. Clicca sui seguenti pulsanti nella barra dei menu per modificare le dimensioni dello schermo:
- Clicca sul pulsante
per la visualizzazione desktop. - Clicca sul pulsante
per la visualizzazione su dispositivo mobile. - Clicca sul pulsante
per la visualizzazione a schermo intero.
Annullamento e ripetizione di azioni
Puoi usare i pulsanti e 
per annullare o ripristinare le personalizzazioni non salvate. Dopo aver salvato le modifiche, non sarà più possibile ripristinarle o annullarle.
Se non ci sono personalizzazioni non salvate da ripristinare, annullare o entrambe le operazioni, il pulsante corrispondente è disattivato.
Menu sidebar
Il menu sidebar mostra una vista ad albero di tutto il contenuto del modello che stai visualizzando nella barra laterale. Puoi gestire sezioni, blocchi e impostazioni dal menu sidebar.
Modalità della sidebar
L'editor del tema ha due modalità per utilizzare tutto lo spazio sullo schermo.
La Modalità a sidebar doppia è per le finestre del browser più larghe e per gli schermi più grandi, mentre la Modalità a sidebar singola è per le finestre più strette e per gli schermi più piccoli. La modalità della sidebar determina in che punto dell'editor viene visualizzato il pannello delle impostazioni.
Modalità a sidebar doppia
Se hai uno schermo di larghezza superiore a 1600 pixel e la finestra del browser è espansa completamente o fino a raggiungere almeno 1600 pixel di larghezza, saranno presenti due sidebar. Quella sulla sinistra contiene il pannello di navigazione, mentre quella sulla destra il pannello delle impostazioni.
Per visualizzare l'editor del tema in modalità sidebar singola su uno schermo grande, restringi la finestra del browser fino a quando il pannello delle impostazioni non si sposterà sopra la sidebar di navigazione o non scomparirà.
Modalità a sidebar singola
I browser più stretti dispongono di una sola sidebar per conservare spazio per l'anteprima del tema. Quando clicchi su una sezione o su un blocco per modificarli, il pannello delle impostazioni si apre sopra il pannello di navigazione nella sidebar.
Sezioni e blocchi
Nell'elenco di sezioni e blocchi, tutti i blocchi per le sezioni di una pagina vengono visualizzati per impostazione predefinita.
Le sezioni che compongono header o footer vengono compresse per impostazione predefinita. Puoi cliccare sul pulsante 
accanto al nome di una sezione per visualizzarne il contenuto.
Gruppi sezione
Le sezioni sono raggruppate nelle seguenti aree per ogni modello di pagina del tema:
- L'area Header include header, barra degli annunci e qualsiasi app o Liquid personalizzato.
- L'area Modello include le sezioni che costituiscono il corpo principale della pagina. Ad esempio, le sezioni dei modelli possono includere articoli del blog, collage, elenchi delle collezioni o Liquid personalizzati.
- L'area Footer include footer, iscrizione alla newsletter e qualsiasi app o Liquid personalizzato.
L'header e il footer sono comuni a tutte le pagine del tuo negozio online. Ad esempio, se aggiungi un blocco Liquid personalizzato all'header, tale Liquid personalizzato verrà visualizzato su tutte le pagine di prodotto, sulla homepage e su qualsiasi altra pagina.
Espansione e compressione di sezioni e blocchi
Espandi un nodo di sezione con il pulsante per visualizzarne i blocchi o comprimi con il pulsante 
per nascondere i blocchi. Puoi cliccare su qualsiasi sezione o blocco per visualizzarne le impostazioni.
Spostamento di sezioni e blocchi
Puoi spostare una sezione o un blocco da un'area della pagina a un'altra utilizzando il pulsante 
per cliccare e trascinare la sezione o il blocco e rilasciarli in un'altra posizione disponibile.
Se tenti di spostare una sezione o un blocco dove non è consentito, la sezione o il blocco verranno nuovamente spostati nella loro posizione originale.
Rimozione di sezioni e blocchi
Puoi rimuovere una sezione o un blocco da un modello in uno dei due modi seguenti:
Sposta il cursore accanto al nome della sezione, quindi fai clic sul pulsante
: 
Clicca sul nome della sezione, quindi su Rimuovi sezione nei dettagli delle impostazioni della sezione:
Passaggi:
Dal pannello di controllo Shopify, vai su Negozio online > Temi.
Accanto al tema che desideri modificare, clicca su Personalizza.
Nella sidebar dell'editor del tema, clicca sulla sezione o sul blocco che desideri rimuovere.
Clicca su Rimuovi sezione o su Rimuovi blocco.
Clicca su Salva. Se stai modificando un tema pubblicato, clicca su Pubblica per salvare le modifiche e renderle visibili nel negozio.
Nascondere sezioni e blocchi
Puoi nascondere le sezioni o i blocchi utilizzando il pulsante :
