Impostazioni tema

Puoi utilizzare le impostazioni personalizzate del tema nel menu sidebar dell'editor del tema per apportare modifiche ai caratteri tipografici, ai colori, ai link ai social media e alla pagina del carrello del tuo negozio online. Le modifiche alle impostazioni del tema vengono applicate a tutto il negozio online.

Anche le sezioni e i blocchi dispongono di impostazioni che puoi modificare per personalizzare singole sezioni del tuo tema. Scopri di più su sezioni e blocchi.

Puoi aggiungere al negozio online un logo per la tua attività. Il logo viene visualizzato:

  • nell'header, su tutte le pagine;
  • nella tua pagina protetta da password.

Personalizzazione del tuo logo

Le immagini del logo hanno una larghezza massima di 300 px.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Clicca su Logo.

  5. Nell'area Logo aggiungi la tua immagine o utilizza un'immagine gratuita:

    • Per aggiungere l'immagine, clicca su Seleziona immagine, quindi aggiungi un'immagine nuova o esistente:

      • Per utilizzare un'immagine che hai già caricato nel pannello di controllo Shopify, seleziona l'immagine e clicca su Fine.
      • Per utilizzare un'immagine dal tuo computer locale, clicca su Aggiungi immagini. Seleziona e aggiungi un'immagine, quindi clicca su Fatto.
    • Per utilizzare un'immagine gratuita, clicca su Esplora immagini gratuite. Trova un'immagine, clicca sull'immagine per selezionarla, quindi clicca su Seleziona.

  6. Facoltativo: aggiungi un testo alternativo all'immagine del logo:

    1. Nell'area Logo clicca su Modifica.
    2. Nel campo Testo alternativo inserisci una breve descrizione dell'immagine.
    3. Clicca su Salva.
  7. Facoltativo: nell'area Larghezza logo su desktop usa il cursore dell'intervallo per regolare la larghezza in pixel del logo.

  8. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Logo.

  7. Nell'area Logo aggiungi la tua immagine o utilizza un'immagine gratuita:

    • Per aggiungere l'immagine, tocca Seleziona immagine, quindi aggiungi un'immagine nuova o esistente:

      • Per utilizzare un'immagine che hai già caricato nel pannello di controllo Shopify, seleziona l'immagine e tocca Fine.
      • Per utilizzare un'immagine dal tuo dispositivo locale, tocca Aggiungi immagini. Seleziona e aggiungi un'immagine dal tuo dispositivo locale, tocca l'immagine per selezionarla, quindi tocca Fatto.
    • Per utilizzare un'immagine gratuita, tocca Esplora immagini gratuite. Trova un'immagine, toccala per selezionarla, quindi tocca Fatto.

  8. Facoltativo: aggiungi un testo alternativo all'immagine del logo:

    1. Nell'area Logo tocca Modifica.
    2. Nel campo Testo alternativo inserisci una breve descrizione dell'immagine.
    3. Tocca .
  9. Facoltativo: nell'area Larghezza logo su desktop usa il cursore dell'intervallo per regolare la larghezza in pixel del logo.

  10. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Logo.

  7. Nell'area Logo aggiungi la tua immagine o utilizza un'immagine gratuita:

    • Per aggiungere l'immagine, tocca Seleziona immagine, quindi aggiungi un'immagine nuova o esistente:

      • Per utilizzare un'immagine che hai già caricato nel pannello di controllo Shopify, seleziona l'immagine e tocca Fine.
      • Per utilizzare un'immagine dal tuo dispositivo locale, tocca Aggiungi immagini. Seleziona e aggiungi un'immagine dal tuo dispositivo locale, tocca l'immagine per selezionarla, quindi tocca Fatto.
    • Per utilizzare un'immagine gratuita, tocca Esplora immagini gratuite. Trova un'immagine, toccala per selezionarla, quindi tocca Fatto.

  8. Facoltativo: aggiungi un testo alternativo all'immagine del logo:

    1. Nell'area Logo tocca Modifica.
    2. Nel campo Testo alternativo inserisci una breve descrizione dell'immagine.
    3. Tocca .
  9. Facoltativo: nell'area Larghezza logo su desktop usa il cursore dell'intervallo per regolare la larghezza in pixel del logo.

  10. Tocca .

Aggiunta di una favicon

Puoi aggiungere un'icona dei preferiti o una favicon, utile per migliorare il branding del tuo negozio online. Una favicon appare nei seguenti punti:

  • scheda del browser
  • cronologia del browser
  • icone sul desktop
  • accanto al nome del negozio online quando il tuo sito web viene contrassegnato come preferito.

Scopri di più sulle favicon.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema per il quale desideri aggiungere una favicon e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. A seconda della versione del tema, clicca su Logo o su Favicon.

  5. Nella sezione Immagine favicon clicca su Seleziona immagine, quindi aggiungi un'immagine nuova o esistente:

    • Per selezionare un'immagine che hai già caricato nel pannello di controllo Shopify, cercala e selezionala con la casella di spunta.
    • Per selezionare un'immagine salvata nel tuo computer, clicca su Aggiungi immagini, apri l'immagine dal tuo computer e selezionala con la casella di spunta.
  6. Clicca su Done (Fatto).

  7. Facoltativo: aggiungi un testo alternativo all'immagine favicon:

    1. Nella sezione Immagine favicon clicca su Modifica.
    2. Nel campo Testo alternativo inserisci una breve descrizione dell'immagine.
    3. Clicca su Salva.
  8. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema per il quale desideri aggiungere una favicon, quindi tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. A seconda della versione del tema, clicca su Logo o su Favicon.

  7. Nella sezione Immagine favicon tocca Seleziona immagine, quindi aggiungi un'immagine nuova o esistente:

    • Per selezionare un'immagine che hai già caricato nel pannello di controllo Shopify, cercala e selezionala con la casella di spunta.
    • Per selezionare un'immagine salvata sul tuo dispositivo, tocca Aggiungi immagini, apri l'immagine dal tuo dispositivo e selezionala con la casella di spunta.
  8. Tocca Fatto.

  9. Aggiungi un testo alternativo all'immagine favicon:

    1. Nella sezione Favicon tocca Modifica.
    2. Nel campo Testo alternativo inserisci una breve descrizione dell'immagine.
    3. Tocca .
  10. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema per il quale desideri aggiungere una favicon, quindi tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. A seconda della versione del tema, clicca su Logo o su Favicon.

  7. Nella sezione Immagine favicon tocca Seleziona immagine, quindi aggiungi un'immagine nuova o esistente:

    • Per selezionare un'immagine che hai già caricato nel pannello di controllo Shopify, cercala e selezionala con la casella di spunta.
    • Per selezionare un'immagine salvata sul tuo dispositivo, tocca Aggiungi immagini, apri l'immagine dal tuo dispositivo e selezionala con la casella di spunta.
  8. Tocca Fatto.

  9. Aggiungi un testo alternativo all'immagine favicon:

    1. Nella sezione Favicon tocca Modifica.
    2. Nel campo Testo alternativo inserisci una breve descrizione dell'immagine.
    3. Tocca .
  10. Tocca .

Colori

Puoi definire diversi schemi di colori nelle impostazioni del tema e applicarli a sezioni diverse all'interno del negozio online con un selettore dello schema di colori. Uno schema di colori è una serie di colori. Il tema ha una serie di schemi di colori predefiniti che puoi modificare in qualsiasi momento nell'editor del tema. Puoi aggiungere i colori del tuo brand per garantire un'applicazione coerente della palette di colori in tutto il negozio online.

Per fare in modo che il design del negozio online sia uniforme in tutto il tuo sito web, i modelli non hanno impostazioni di colore individuali. Si considera un modello la pagina principale o il contenuto principale di un negozio. Avere differenti schemi di colori in tutto il negozio potrebbe causare una user experience negativa e spingere i clienti a lasciare il tuo negozio senza acquistare prodotti.

Puoi creare e personalizzare fino a 21 schemi di colori unici e applicarli a diverse sezioni all'interno del tuo negozio online.

Schemi di colori

Gli schemi di colori sono un'impostazione del tema che raggruppa gli elementi e i rispettivi colori in modo che siano ordinati visivamente. In uno schema di colori coerente puoi assegnare colori diversi a vari elementi, che possono essere applicati all'interno del tema in cui è disponibile un selettore dello schema di colori. Puoi avere fino a 21 schemi di colori. Puoi anche visualizzare un'anteprima di come vengono visualizzati i colori nello schema.

Elenco delle diverse impostazioni che puoi applicare alle combinazioni di colori nell'editor del tema.
ImpostazioneDescrizione
SfondoIl colore viene applicato allo sfondo di alcune sezioni e allo sfondo del contorno del pulsante.
Gradiente sfondoSullo sfondo di alcune sezioni viene applicato un gradiente di colore. I gradienti sfondo sostituiscono lo sfondo ove possibile.
TestoIl colore viene applicato alla sezione o al blocco di testo.
Sfondo pulsante in tinta unitaIl colore viene applicato allo sfondo del pulsante primario.
Etichetta pulsante in tinta unitaIl colore viene applicato al testo del pulsante primario.
Contorno pulsanteIl colore viene applicato al testo e al bordo del pulsante secondario.
OmbraIl colore viene applicato alle ombre.

Gestione dello schema di colori

Lo schema di colori e le opzioni di colore del tuo negozio sono impostati nelle impostazioni del tema. Per i colori a tinta unita, scegli il nuovo colore utilizzando il selettore di colori oppure inserisci il valore del colore nel campo di testo. Il campo del colore accetta i seguenti nomi e valori del colore:

  • Nomi di colore come red, black o blue.
  • Codici di colore RGB.
  • Valori di colore esadecimali.

Passaggi:

  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Clicca su Personalizza accanto al tema che desideri personalizzare.

  3. Clicca sull'icona impostazioni, quindi clicca su Colori.

  4. Nella sezione Schemi clicca su uno schema esistente o su Aggiungi schema per aggiungere un nuovo schema di colori.

  5. Clicca sul campione di colore corrispondente al colore del tipo di contenuto che desideri modificare.

  6. Per impostare il colore, inserisci un codice colore esadecimale o scegli il colore dal selettore di colori. Per impostare il colore su trasparente, elimina il codice esadecimale dal campo di testo.

  7. Clicca su Salva.

Applicazione dello schema di colori

Dopo aver definito lo schema di colori nelle impostazioni del tema, puoi assegnarne uno utilizzando l'apposito selettore nelle sezioni e blocchi del tema. Il selettore dello schema di colori è disponibile solo in determinate sezioni, blocchi e impostazioni generali del tema.

Selettore dello schema di colori

Gradienti

Puoi configurare un gradiente di colore in alcuni temi per ottenere opzioni di sfondo visivamente interessanti. L'impostazione color_background viene utilizzata per personalizzare le proprietà CSS dello sfondo.

Il selettore di gradiente ti consente di selezionare colori, stile, angolo, posizione e opacità del gradiente. Le opzioni selezionate vengono visualizzate in anteprima in tempo reale nell'editor del tema. Puoi anche creare uno sfondo con gradiente utilizzando il codice CSS, che include uno strumento di verifica della convalida.

Configurazione dei gradienti

  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Clicca su Personalizza accanto al tema che desideri personalizzare.

  3. Clicca sull'icona impostazioni, quindi clicca su Colori.

  4. Nella sezione Schemi clicca su uno schema esistente che desideri modificare.

  5. Clicca sull'opzione del campione di colore del gradiente, ad esempio Gradiente sfondo.

  6. Se precedentemente non hai configurato un gradiente, verranno visualizzate alcune opzioni preimpostate tra cui scegliere; seleziona un gradiente preimpostato per aprire il pannello delle opzioni.

  7. Seleziona le opzioni di gradiente:

    • Scegli tra un gradiente lineare o radiale. Utilizza i pulsanti per selezionare lo stile di gradiente che preferisci.
    • Imposta l'angolo del gradiente con le frecce verso l'alto e il basso. Clicca sulle frecce per aumentare o diminuire di cinque la percentuale dell'angolo.
    • Usa il cursore per selezionare la Posizione del gradiente o inserisci un valore numerico nel campo.
    • Inserisci il codice esadecimale di un colore specifico o utilizza il cursore del colore per scegliere una tonalità. I colori selezionati di recente vengono visualizzati nella parte inferiore del pannello delle opzioni di gradiente.
    • Per rendere il gradiente opaco, utilizza il cursore a destra per selezionarne la trasparenza. Puoi anche inserire una percentuale nel campo accanto al codice colore esadecimale.
  8. Clicca su Salva.

Selettore di gradiente nell'editor del tema

Utilizzo di CSS per la configurazione dei gradienti

La maggior parte dei valori delle proprietà CSS background può essere utilizzata per impostare un colore di sfondo. Puoi utilizzare questo campo per i colori a tinta unita (ad esempio, i codici #000000, black, rgb(0,0,0,0), rgba(0,0,0,0), hsl(0, 0%, 0%) e hsla(0, 0%, 0%, 1) produrranno tutti uno sfondo nero a tinta unita) oppure per i gradienti (ad esempio, inserendo linear-gradient(red, green), radial-gradient(red, green) o conic-gradient(red, green)). I gradienti possono anche essere ripetuti.

Passaggi:

  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Clicca su Personalizza accanto al tema che desideri personalizzare.

  3. Clicca sull'icona impostazioni, quindi clicca su Colori.

  4. Nella sezione Schemi clicca su uno schema esistente che desideri modificare.

  5. Clicca sul gradiente che desideri modificare.

  6. Clicca sulla freccia accanto a Gradiente, quindi seleziona CSS.

  7. Nel campo Codice CSS digita o incolla il codice del gradiente. L'anteprima dell'editor del tema mostra il gradiente nella posizione corretta.

  8. Clicca su Salva.

Campo Codice CSS del gradiente nell'editor del tema

Rimozione di un gradiente

  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Clicca su Personalizza accanto al tema che desideri personalizzare.

  3. Clicca sull'icona impostazioni, quindi clicca su Colori.

  4. Nella sezione Schemi clicca su uno schema esistente che desideri modificare.

  5. Clicca sul gradiente che desideri rimuovere.

  6. Clicca su Rimuovi gradiente.

  7. Clicca su Salva.

Caratteri tipografici

Puoi impostare stile e dimensione del font per il testo del tuo negozio online. Puoi scegliere un font di sistema o un font personalizzato.

Valuta la possibilità di utilizzare i font di sistema nel tuo negozio, perché i font di sistema sono già installati nei computer degli utenti. L'utilizzo dei font di sistema evita di scaricare nuovi font sul computer del cliente, il che può influire negativamente sulla velocità di caricamento del negozio. Il font che viene visualizzato sul computer del cliente dipende dal suo sistema operativo.

Personalizzazione dei tipi di font

Consulta la libreria dei font di Shopify per un elenco dei font disponibili.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Fai clic su Caratteri tipografici.

  5. Per modificare il tipo di font per i titoli o il corpo del testo del tuo negozio, clicca su Modifica nella sezione Titoli o Corpo.

  6. Clicca sul nome del font che desideri utilizzare, quindi clicca su Seleziona.

  7. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Caratteri tipografici.

  7. Per modificare il tipo di font per i titoli o il corpo del testo del tuo negozio, tocca Modifica nella sezione Titoli o Corpo.

  8. Tocca il nome del font che desideri utilizzare, quindi tocca Fatto.

  9. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Caratteri tipografici.

  7. Per modificare il tipo di font per i titoli o il corpo del testo del tuo negozio, tocca Modifica nella sezione Titoli o Corpo.

  8. Tocca il nome del font che desideri utilizzare, quindi tocca Fatto.

  9. Tocca .

Personalizzazione delle dimensioni dei font

Puoi impostare le dimensioni predefinite dei font per titoli e corpo del testo con l'impostazione del tema Caratteri tipografici.

La dimensione minima del font è 100%, mentre la dimensione massima è 150%. Ogni incremento della scalabilità aumenta la dimensione del font del 5%. L'impostazione predefinita è 100%.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Fai clic su Caratteri tipografici.

  5. Per modificare la dimensione predefinita dei font per il testo dei Titoli, usa il cursore dell'intervallo Scalabilità dimensione font per selezionare la dimensione predefinita del font.

  6. Per modificare la dimensione predefinita dei font per il testo del Corpo, usa il cursore dell'intervallo Scalabilità dimensione font per selezionare la dimensione predefinita del font.

  7. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Caratteri tipografici.

  7. Per modificare la dimensione predefinita dei font per il testo dei Titoli, usa il cursore dell'intervallo Scalabilità dimensione font per selezionare la dimensione predefinita del font.

  8. Per modificare la dimensione predefinita dei font per il testo del Corpo, usa il cursore dell'intervallo Scalabilità dimensione font per selezionare la dimensione predefinita del font.

  9. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Caratteri tipografici.

  7. Per modificare la dimensione predefinita dei font per il testo dei Titoli, usa il cursore dell'intervallo Scalabilità dimensione font per selezionare la dimensione predefinita del font.

  8. Per modificare la dimensione predefinita dei font per il testo del Corpo, usa il cursore dell'intervallo Scalabilità dimensione font per selezionare la dimensione predefinita del font.

  9. Tocca .

Layout

Puoi impostare la larghezza massima in cui verrà visualizzato il tuo negozio online e lo spazio verticale e orizzontale tra le sezioni.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Clicca su Layout.

  5. Usa il cursore dell'intervallo Larghezza pagina per scegliere una larghezza di pagina compresa tra 1.000 px e 1.600 px. L'impostazione predefinita è 1.600 px.

  6. Facoltativo: usa il cursore dell'intervallo per aggiungere Spazio tra le sezioni del modello verticalmente nelle pagine. Puoi aggiungere fino a un massimo di 100 px tra le sezioni.

  7. Facoltativo: se hai un layout a Griglia, usa i cursori di intervallo Spazio orizzontale e Spazio verticale per aggiungere spazio tra il contenuto della griglia delle pagine. L'aggiunta di uno spazio orizzontale aggiungerà un massimo di 40 px di spazio alle righe di contenuto delle pagine, mentre l'aggiunta di spazio verticale aggiungerà un massimo di 40 px di spazio alle colonne di contenuto delle pagine.

  8. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Layout.

  7. Usa il cursore dell'intervallo Larghezza pagina per scegliere una larghezza di pagina compresa tra 1.000 px e 1.600 px. L'impostazione predefinita è 1.600 px.

  8. Facoltativo: usa il cursore dell'intervallo per aggiungere Spazio tra le sezioni del modello verticalmente nelle pagine. Puoi aggiungere fino a un massimo di 100 px tra le sezioni.

  9. Facoltativo: se hai un layout a Griglia, usa i cursori di intervallo Spazio orizzontale e Spazio verticale per aggiungere spazio tra il contenuto della griglia delle pagine. L'aggiunta di uno spazio orizzontale aggiungerà un massimo di 40 px di spazio alle righe di contenuto delle pagine, mentre l'aggiunta di spazio verticale aggiungerà un massimo di 40 px di spazio alle colonne di contenuto delle pagine.

  10. Tocca Salva.

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Layout.

  7. Usa il cursore dell'intervallo Larghezza pagina per scegliere una larghezza di pagina compresa tra 1.000 px e 1.600 px. L'impostazione predefinita è 1.600 px.

  8. Facoltativo: usa il cursore dell'intervallo per aggiungere Spazio tra le sezioni del modello verticalmente nelle pagine. Puoi aggiungere fino a un massimo di 100 px tra le sezioni.

  9. Facoltativo: se hai un layout a Griglia, usa i cursori di intervallo Spazio orizzontale e Spazio verticale per aggiungere spazio tra il contenuto della griglia delle pagine. L'aggiunta di uno spazio orizzontale aggiungerà un massimo di 40 px di spazio alle righe di contenuto delle pagine, mentre l'aggiunta di spazio verticale aggiungerà un massimo di 40 px di spazio alle colonne di contenuto delle pagine.

  10. Tocca .

Animazioni

Le animazioni ti permettono di aggiungere movimento e interesse visivo al tuo negozio online. Puoi attivare un'animazione con dissolvenza in entrata che mostra le sezioni del tuo negozio durante lo scorrimento e un effetto hover per le schede e i pulsanti.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Clicca su Animazioni.

  5. Facoltativo: per attivare un'animazione che mostra le sezioni del tuo negozio online durante lo scorrimento, seleziona Mostra sezioni durante lo scorrimento.

  6. Facoltativo: per aggiungere un'animazione con effetto hover alle schede e ai pulsanti, seleziona una delle seguenti opzioni dall'impostazione Effetto hover:

    • Vertical lift: quando un cliente passa sopra una scheda o un pulsante, l'elemento si sposta verso l'alto.
    • 3D lift: quando un cliente passa sopra una scheda o un pulsante, l'elemento si sposta in avanti, dandogli un effetto 3D. Appare anche un effetto brillante sull'elemento che offre maggiore profondità alla dimensione.
  7. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Animazioni.

  7. Facoltativo: per attivare un'animazione che mostra le sezioni del tuo negozio online durante lo scorrimento, seleziona Mostra sezioni durante lo scorrimento.

  8. Facoltativo: per aggiungere un'animazione con effetto hover alle schede e ai pulsanti, seleziona una delle seguenti opzioni dall'impostazione Effetto hover:

    • Vertical lift: quando un cliente passa sopra una scheda o un pulsante, l'elemento si sposta verso l'alto.
    • 3D lift: quando un cliente passa sopra una scheda o un pulsante, l'elemento si sposta in avanti, dandogli un effetto 3D. Appare anche un effetto brillante sull'elemento che offre maggiore profondità alla dimensione.
  9. Tocca Salva.

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Animazioni.

  7. Facoltativo: per attivare un'animazione che mostra le sezioni del tuo negozio online durante lo scorrimento, seleziona Mostra sezioni durante lo scorrimento.

  8. Facoltativo: per aggiungere un'animazione con effetto hover alle schede e ai pulsanti, seleziona una delle seguenti opzioni dall'impostazione Effetto hover:

    • Vertical lift: quando un cliente passa sopra una scheda o un pulsante, l'elemento si sposta verso l'alto.
    • 3D lift: quando un cliente passa sopra una scheda o un pulsante, l'elemento si sposta in avanti, dandogli un effetto 3D. Appare anche un effetto brillante sull'elemento che offre maggiore profondità alla dimensione.
  9. Tocca .

Impostazioni di personalizzazione degli elementi visivi

Puoi modificare l'aspetto degli elementi del tuo tema, come pulsanti, schede prodotto e varianti, dalla pagina Impostazioni del tema. Ogni opzione contiene le impostazioni rilevanti per quell'elemento.

Puoi modificare le impostazioni per i seguenti elementi del tuo tema:

  • Pulsanti: i pulsanti includono i pulsanti call to action in sezioni quali una presentazione o un'immagine con testo, nonché i pulsanti in un modulo di contatto, nelle pagine dei prodotti e nelle pagine del carrello.

  • Pulsanti di selezione variante: i pulsanti di selezione variante ti consentono di mostrare le varianti di un prodotto in una pagina del prodotto o in una sezione di prodotti in primo piano. I clienti possono selezionare la variante desiderata per aggiungere il prodotto al carrello senza dover modificare le pagine dei prodotti. Puoi personalizzare il modo in cui i pulsanti di selezione variante vengono visualizzati nel tuo negozio online.

  • Input: gli input sono aree interattive che richiedono l'input dei clienti, come un selettore quantità, un modulo di iscrizione alla newsletter o le note carrello. Puoi modificare l'aspetto degli input del negozio online.

  • Le impostazioni per le schede prodotto, schede collezioni e schede blog ti permettono di personalizzare lo stile di ogni tipo di scheda quando vengono visualizzate nelle sezioni di pagina. - Schede prodotto: le schede prodotto mostrano informazioni sui tuoi prodotti in aree del tema che elencano più prodotti, come modelli di collezione, sezioni di collezione e risultati di ricerca. - Schede collezione: le schede collezione mostrano informazioni sulle tue collezioni nelle aree del tema in cui sono elencate le collezioni, ad esempio un modello o una sezione di elenco delle collezioni. - Schede del blog: le schede del blog visualizzano le informazioni sugli articoli del blog nelle aree del tema che elencano più prodotti, come i modelli di blog, le sezioni del blog e i risultati della ricerca.

  • Contenitori di contenuto: i contenitori sono utilizzati per l'elemento di testo delle sezioni di contenuto, come la casella di testo di una presentazione, su un banner immagine o nelle colonne delle sezioni multicolonna. Puoi personalizzare l'aspetto dei contenitori di contenuto per il negozio online.

  • Contenuti multimediali: i contenuti multimediali sono la componente visiva delle sezioni, come i contenuti multimediali di prodotto o un'immagine nella sezione Immagine con testo. Puoi aggiungere bordi e ombre ai contenuti multimediali.

  • Menu a discesa e pop up: puoi modificare l'aspetto dei menu a discesa, dei modali pop up e dei pop up del carrello nel tuo negozio online.

  • Finestre: le finestre sono contenitori interattivi e nascosti; vengono visualizzate quando vengono toccate o cliccate, come i menu comprimibili o le opzioni di filtro delle collezioni. Puoi personalizzare il bordo e l'ombra delle finestre nel tuo negozio online.

  • Badge: i badge In offerta ed Esaurito vengono aggiunti automaticamente alle immagini del prodotto quando riduci il prezzo o quando il conteggio delle scorte raggiunge il valore 0. Puoi regolare la posizione, la forma e il colore dei badge In offerta ed Esaurito singolarmente nelle impostazioni dei temi. I badge Pagina e Blog vengono visualizzati nei risultati di ricerca pertinenti. Puoi personalizzare la posizione e la forma di questi badge, ma non puoi modificare il colore dei badge Pagina e Blog.

  • Informazioni sul brand: puoi includere informazioni sul tuo brand nel tuo negozio online. Una volta completati i passaggi seguenti, puoi aggiungere il blocco di Informazioni sul brand nel footer del tuo negozio online.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Clicca su Personalizza accanto al tema che desideri modificare.

  3. Clicca sull'icona impostazioni.

  4. Clicca su un elemento per aprire le impostazioni.

  5. Modifica una qualsiasi delle impostazioni disponibili. Puoi rivedere le modifiche navigando tra le diverse aree del tema nella finestra di anteprima.

  6. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Personalizza accanto al tema che desideri modificare.

  4. Tocca l'icona impostazioni.

  5. Tocca un elemento per aprire le impostazioni.

  6. Modifica una qualsiasi delle impostazioni disponibili. Puoi rivedere le modifiche navigando tra le diverse aree del tema nella finestra di anteprima.

  7. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Personalizza accanto al tema che desideri modificare.

  4. Tocca l'icona impostazioni.

  5. Tocca un elemento per aprire le impostazioni.

  6. Modifica una qualsiasi delle impostazioni disponibili. Puoi rivedere le modifiche navigando tra le diverse aree del tema nella finestra di anteprima.

  7. Tocca .

Social media

Puoi aggiungere link ai tuoi account sui social media visualizzati nel footer del tuo negozio online.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Clicca su Social media.

  5. Per aggiungere link ai tuoi account sui social media, inserisci gli indirizzi del sito web dei tuoi account nei relativi campi Account social. Devi inserire link completi, ad esempio https://instagram.com/shopify o https://tiktok.com/@shopify.

  6. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Social media.

  7. Per aggiungere link ai tuoi account sui social media, inserisci gli indirizzi del sito web dei tuoi account nei relativi campi Account social. Devi inserire link completi, ad esempio https://instagram.com/shopify o https://tiktok.com/@shopify.

  8. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Social media.

  7. Per aggiungere link ai tuoi account sui social media, inserisci gli indirizzi del sito web dei tuoi account nei relativi campi Account social. Devi inserire link completi, ad esempio https://instagram.com/shopify o https://tiktok.com/@shopify.

  8. Tocca .

Comportamento di ricerca

Il negozio online include la ricerca predittiva, che mostra i suggerimenti quando i clienti iniziano a digitare nel campo di ricerca. I suggerimenti di ricerca possono aiutare i clienti a formulare e affinare le loro query di ricerca e fornire nuovi modi per esplorare il tuo negozio online. I suggerimenti di ricerca possono anche consentire ai clienti di sfogliare rapidamente i risultati di ricerca senza dover lasciare la pagina corrente per vedere un elenco separato dei risultati di ricerca.

Per maggiori informazioni sul funzionamento dei suggerimenti sui prodotti, consulta la pagina sulla ricerca predittiva.

Puoi personalizzare il modo in cui i suggerimenti di ricerca vengono visualizzati ai clienti.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Clicca su Comportamento di ricerca.

  5. Per attivare o disattivare i suggerimenti di ricerca, seleziona o deseleziona Abilita suggerimenti di ricerca.

  6. Facoltativo: per visualizzare o nascondere il fornitore del prodotto nei suggerimenti di ricerca, seleziona o deseleziona Mostra fornitore prodotto.

  7. Facoltativo: per mostrare o nascondere il prezzo del prodotto nei suggerimenti di ricerca, seleziona o deseleziona Mostra prezzo prodotto.

  8. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Comportamento di ricerca.

  7. Per attivare o disattivare i suggerimenti di ricerca, seleziona o deseleziona Abilita suggerimenti di ricerca.

  8. Facoltativo: per visualizzare o nascondere il fornitore del prodotto nei suggerimenti di ricerca, seleziona o deseleziona Mostra fornitore prodotto.

  9. Facoltativo: per mostrare o nascondere il prezzo del prodotto nei suggerimenti di ricerca, seleziona o deseleziona Mostra prezzo prodotto.

  10. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Comportamento di ricerca.

  7. Per attivare o disattivare i suggerimenti di ricerca, seleziona o deseleziona Abilita suggerimenti di ricerca.

  8. Facoltativo: per visualizzare o nascondere il fornitore del prodotto nei suggerimenti di ricerca, seleziona o deseleziona Mostra fornitore prodotto.

  9. Facoltativo: per mostrare o nascondere il prezzo del prodotto nei suggerimenti di ricerca, seleziona o deseleziona Mostra prezzo prodotto.

  10. Tocca .

Formato valuta

Puoi scegliere di mostrare il codice valuta con i prezzi dei tuoi prodotti.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Clicca su Formato valuta.

  5. Per visualizzare i codici valuta, seleziona Mostra i codici valuta.

  6. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Formato valuta.

  7. Per visualizzare i codici valuta, seleziona Mostra i codici valuta.

  8. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Formato valuta.

  7. Per visualizzare i codici valuta, seleziona Mostra i codici valuta.

  8. Tocca .

Carrello

Puoi modificare lo stile del carrello nel tuo negozio online. Quando un cliente aggiunge un prodotto del negozio al carrello, il carrello può essere visualizzato come finestra, pagina o pop up. Per mantenere il cliente sulla pagina del prodotto, utilizza l'opzione della finestra o del pop up. Per portare il cliente alla pagina del carrello, utilizza l'opzione della pagina. Quando il carrello del cliente è vuoto, puoi mostrare una collezione in evidenza nella finestra del carrello.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Clicca su Carrello.

  5. Utilizza il menu a discesa Tipo di carrello per selezionare lo stile del carrello a Finestra, Pagina o Notifica pop up.

  6. Facoltativo: per mostrare i fornitori degli articoli nel carrello di un cliente, seleziona Mostra fornitore.

  7. Facoltativo: per fornire ai clienti una casella di testo in cui inserire richieste speciali o aggiungere ulteriori informazioni sull'ordine, seleziona Abilita nota carrello.

  8. Facoltativo: se selezioni Finestra come Tipo di carrello, puoi mostrare una collezione nella finestra del carrello quando è vuota:

    1. Nell'area della Finestra del carrello clicca su Seleziona collezione.
    2. Clicca sul nome della collezione che desideri visualizzare, quindi clicca su Seleziona.
  9. Facoltativo: se selezioni Finestra come Tipo di carrello, puoi modificare lo schema di colori della finestra del carrello eseguendo i seguenti passaggi:

    1. Nella Finestra del carrello > area Schema di colori, clicca su Modifica.
    2. Seleziona uno schema di colori che desideri utilizzare per la finestra del carrello.
  10. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Carrello.

  7. Seleziona il Tipo di carrello tra le opzioni Finestra, Pagina o Notifica pop up.

  8. Facoltativo: per mostrare i fornitori degli articoli nel carrello di un cliente, seleziona Mostra fornitore.

  9. Facoltativo: per fornire ai clienti una casella di testo in cui inserire richieste speciali o aggiungere ulteriori informazioni sull'ordine, seleziona Abilita nota carrello.

  10. Facoltativo: se selezioni Finestra come Tipo di carrello, puoi mostrare una collezione nella finestra del carrello quando è vuota:

    1. Nell'area della Finestra del carrello tocca Seleziona collezione.
    2. Tocca il nome della collezione che desideri visualizzare, quindi tocca Fatto.
  11. Facoltativo: se selezioni Finestra come Tipo di carrello, puoi modificare lo schema di colori della finestra del carrello eseguendo i seguenti passaggi:

    1. Nella Finestra del carrello > area Schema di colori, tocca Modifica.
    2. Seleziona uno schema di colori che desideri utilizzare per la finestra del carrello, quindi tocca Fatto.
  12. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Carrello.

  7. Seleziona il Tipo di carrello tra le opzioni Finestra, Pagina o Notifica pop up.

  8. Facoltativo: per mostrare i fornitori degli articoli nel carrello di un cliente, seleziona Mostra fornitore.

  9. Facoltativo: per fornire ai clienti una casella di testo in cui inserire richieste speciali o aggiungere ulteriori informazioni sull'ordine, seleziona Abilita nota carrello.

  10. Facoltativo: se selezioni Finestra come Tipo di carrello, puoi mostrare una collezione nella finestra del carrello quando è vuota:

    1. Nell'area della Finestra del carrello tocca Seleziona collezione.
    2. Tocca il nome della collezione che desideri visualizzare, quindi tocca Fatto.
  11. Facoltativo: se selezioni Finestra come Tipo di carrello, puoi modificare lo schema di colori della finestra del carrello eseguendo i seguenti passaggi:

    1. Nella Finestra del carrello > area Schema di colori, tocca Modifica.
    2. Seleziona uno schema di colori che desideri utilizzare per la finestra del carrello, quindi tocca Fatto.
  12. Tocca .

Codice CSS personalizzato

La sezione Codice CSS personalizzato ti consente di inserire il tuo codice CSS, ad esempio per personalizzare l'aspetto dei pulsanti del negozio online oltre alle impostazioni predefinite disponibili o per applicare uno stile univoco a specifici elementi di testo.

Il codice CSS personalizzato nelle impostazioni del tema influisce su tutte le pagine del negozio online, a eccezione del check-out.

Scopri di più sull'Aggiunta di codice CSS personalizzato ai temi.

Stile del tema

Uno stile del tema è un insieme di impostazioni scelte dal designer di un tema. Puoi applicare lo stile del tema al negozio per dargli un nuovo aspetto. Ogni tema ha uno stile del tema applicato per impostazione predefinita. Le altre opzioni di stile del tema disponibili dipendono dal tema che utilizzi.

Quando personalizzi il tema, sostituisci le tue impostazioni a quelle dello stile del tema. Quando applichi uno stile al tuo tema, modifichi le impostazioni attuali, come colori e caratteri.

Passaggi:

Desktop
  1. Dal pannello di controllo Shopify, vai su Negozio online > Temi.

  2. Trova il tema che desideri modificare e clicca su Personalizza.

  3. Clicca sull'icona impostazioni Impostazioni tema.

  4. Clicca su Stile del tema.

  5. Seleziona lo stile del tema che desideri utilizzare, quindi clicca su Cambia stile.

  6. Clicca su Salva.

iPhone
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Stile del tema.

  7. Seleziona lo stile del tema che desideri utilizzare, quindi tocca Fatto.

  8. Tocca .

Android
  1. Dall'app di Shopify, tocca l'icona Menu.

  2. Nella sezione Canali di vendita, tocca Negozio online.

  3. Tocca Gestisci tutti i temi.

  4. Trova il tema che desideri modificare e tocca Personalizza.

  5. Tocca , poi tocca Impostazioni tema.

  6. Tocca Stile del tema.

  7. Seleziona lo stile del tema che desideri utilizzare, quindi tocca Fatto.

  8. Tocca .

Non trovi le risposte che stai cercando? Siamo qui per aiutarti.