Impostazioni tema

Puoi utilizzare le impostazioni 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 apportate alle impostazioni del tema vengono applicate a tutto il negozio online.

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.

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

Procedura:

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.

Procedura:

Colori

Puoi creare e personalizzare fino a 21 schemi di colori unici e applicarli a diverse sezioni all'interno del tuo negozio online. Scopri di più su opzioni, schemi e gradienti di colore.

Procedura:

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.

Procedura:

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%.

Procedura:

Layout

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

Procedura:

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.

Procedura:

Bordi e ombre

Puoi regolare i bordi e le ombre di alcuni tipi di contenuti interattivi, come finestre, pulsanti, pulsanti di selezione variante o input di quantità prodotto.

Le opzioni personalizzabili relative ai bordi sono:

  • Spessore, che cambia il contorno dell'oggetto
  • Opacità, che imposta la visibilità del contorno dell'oggetto
  • Raggio angolo, che arrotonda gli angoli degli oggetti.

Le opzioni personalizzabili relative alle ombre sono:

  • Opacità, che cambia la visibilità dell'ombra dell'oggetto: un'opacità dell'ombra pari allo 0% rimuove completamente l'ombra dell'oggetto.
  • Cursori di intervallo per lo scostamento Orizzontale o Verticale, che spostano la posizione dell'ombra intorno all'oggetto.
  • Cursore dell'intervallo Sfocatura, che cambia l'opacità dell'ombra dell'oggetto.

Pulsanti

Puoi personalizzare le impostazioni dei pulsanti call to action nel negozio online aggiungendo ombre, modificando la spaziatura o l'opacità e regolando la forma dei pulsanti.

Esempio di negozio online con pulsante call to action

Procedura:

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.

Esempio di negozio online con pulsanti di selezione variante selezionabili

Procedura:

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 del carrello. Puoi modificare l'aspetto degli input del negozio online.

Esempio di negozio online con input di quantità

Procedura:

Schede

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. Puoi modificare colore, allineamento, spaziatura, bordi e ombre di questi tre tipi di scheda della sezione.

Procedura:

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.

Procedura:

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.

Procedura:

Puoi modificare l'aspetto dei menu a discesa di navigazione, dei modali pop up e dei pop up del carrello nel tuo negozio online.

Procedura:

Finestre

Le finestre sono contenitori interattivi e nascosti che vengono visualizzate quando vengono toccate o cliccate, come un menu di navigazione comprimibile o le opzioni di filtro collezione. Puoi personalizzare il bordo e l'ombra delle finestre nel tuo negozio online.

Procedura:

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 lo zero. Puoi regolare la posizione, la forma e il colore dei badge In offerta ed Esaurito.

Esempio di negozio online con badge In offerta ed Esaurito

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.

Procedura:

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.

Procedura:

Social media

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

Procedura:

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.

Procedura:

Formato valuta

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

Procedura:

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.

Procedura:

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.

Procedura:

Annulla e ripeti le modifiche

Il pulsante Annulla elimina la modifica più recente mentre il pulsante Ripeti ripristina una modifica che era stata annullata. Cliccando più volte sul pulsante Annulla, continuerai ad annullare il tuo lavoro, una modifica alla volta. I pulsanti Annulla e Ripeti si trovano nella barra degli strumenti dell'editor del tema.

Pulsanti Annulla e Ripeti nella barra degli strumenti dell’editor del tema

Clicca sul pulsante Annulla per annullare le modifiche apportate al tema, inclusi i seguenti esempi:

  • aggiunta, riordino ed eliminazione di sezioni
  • Applicazione di colori, font e altre impostazioni del tema
  • ripristino dello stile del tema

Sei pronto per iniziare a vendere con Shopify?

Provalo, è gratis