Pop

Un tema minimalista, progettato per mantenere accessibili i tuoi contenuti. Pop è ideale per negozi con inventari di piccole e medie dimensioni. È basato su un’ampia sidebar di navigazione che rende i tuoi contenuti facilmente accessibili.

Esempio di negozio online con Pop

Editor del tema

Usa l'editor del tema per personalizzare il tuo tema. Utilizzando l'editor del tema, puoi modificare il contenuto che viene visualizzato nel tuo negozio aggiungendo e modificando le sezioni del tema. Puoi anche cambiare il look, lo stile e le funzionalità del negozio utilizzando le impostazioni del tema.

Il contenuto del tema viene creato utilizzando le sezioni, blocchi di contenuto personalizzabili che determinano il layout e l'aspetto di diverse pagine del negozio online. Puoi aggiungere, rimuovere, modificare e personalizzare le sezioni utilizzando l'editor del tema aggiornato.

I temi di Shopify hanno i tipi di sezioni seguenti:

  • Sezioni statiche: sezioni visualizzate in posizioni predeterminate nel negozio online. Queste sezioni non possono essere rimosse o riorganizzate e possono includere header, footer, sezioni di navigazione o di contenuto su pagine come pagine del prodotto e di collezione. Ad esempio, la sezione Prodotto determina l'aspetto di ciascuna pagina del prodotto nel negozio online.
  • Sezioni dinamiche: sezioni facoltative che puoi utilizzare per personalizzare il layout della home page. Nella home page del negozio puoi aggiungere, riorganizzare e rimuovere le sezioni dinamiche per creare il layout della pagina. Sulla tua home page puoi avere fino a 25 sezioni dinamiche.

Puoi scoprire l'esclusiva selezione di sezioni Pop e come personalizzarle in base alle esigenze della tua attività.

Pop include le sezioni statiche seguenti:

  • Logo e menu
  • Barra degli annunci
  • Footer
  • Pagine del prodotto
  • Pagine di collezioni
  • Pagina con l'elenco delle collezioni
  • Articolo

Sezioni dinamiche

Puoi aggiungere, ridisporre e rimuovere le sezioni dinamiche per personalizzare il layout della tua home page. Ogni tema offre una serie unica di sezioni dinamiche tra cui scegliere.

Pop include le sezioni dinamiche seguenti:

  • Articoli del blog
  • Elenco delle collezioni
  • Collezione in evidenza
  • Immagine con testo
  • Presentazione
  • Sezione "prodotto in primo piano"
  • Newsletter
  • Mappa
  • Rich text
  • Video
  • HTML personalizzato

Pagine del prodotto

Nella sezione pagina del Prodotto, puoi aggiungere o rimuovere i seguenti elementi:

  • Brand o fornitore del prodotto
  • Zoom immagine
  • Prodotti simili
  • Selettore di quantità
  • Pulsante di check-out dinamico
  • Icone per la condivisione sui social

Per modificare le impostazioni delle pagine del prodotto:

  1. Dal menu a discesa della barra in alto, seleziona Pagine di prodotto.

  2. Clicca su Sezioni.

  3. Clicca su Pagina del prodotto.

  4. Per mostrare il brand o il fornitore del prodotto, seleziona Mostra fornitore prodotto. Perché questi vengano mostrati, devi aggiungere un fornitore al prodotto.

  5. Per consentire ai clienti di ingrandire un'immagine del prodotto scorrendovi sopra con il mouse, seleziona Abilita zoom immagine.

  6. Per mostrare una selezione di prodotti simili in fondo alla pagina, seleziona Mostra prodotti simili. La collezione a cui appartiene il prodotto determina i prodotti simili visualizzati. Affinché vengano mostrati i prodotti simili, devi creare una collezione per il prodotto o aggiungerlo a una collezione esistente. Se il prodotto non fa parte di una collezione, non verranno visualizzati prodotti simili.

  7. Per mostrare un selettore di quantità, seleziona Mostra selettore quantità.

  8. Per mostrare un pulsante di check-out dinamico, seleziona Mostra pulsante di check-out dinamico.

  9. Per mostrare le icone per la condivisione sui social, seleziona Permetti condivisione del prodotto.

  10. Clicca su Salva.

Newsletter

Puoi aggiungere alla tua home page una sezione di iscrizione alla newsletter, in questo modo puoi raccogliere gli indirizzi email dei clienti per campagne di email marketing. Puoi scoprire di più sull'email marketing nel blog di Shopify.

Per inserire nella tua home page un'opzione per iscriversi a una newsletter:

  1. Clicca su Sezioni.

  2. Fai clic su Aggiungi sezione > Newsletter.

  3. Digita il titolo dell'opzione di iscrizione alla newsletter nel campo Titolo. Il titolo predefinito è "Iscriviti alla nostra newsletter".

  4. Inserisci un sottotitolo per l'opzione di iscrizione alla newsletter nel campo Sottotesto. Il testo predefinito è "Promozioni, nuovi prodotti e offerte. Direttamente nella tua casella di posta.".

  5. Imposta il colore di sfondo della sezione per l'iscrizione alla newsletter facendo clic sul campione Colore sfondo e scegliendo una tinta.

  6. Clicca su Salva.

Video

Puoi aggiungere un video di YouTube o Vimeo alla tua home page. I video coinvolgono i clienti e generano interesse verso la tua attività.

Per aggiungere un video alla tua home page:

  1. Clicca su Sezioni.

  2. Fai clic su Aggiungi sezione > Video.

  3. Digita il titolo del video nel campo Titolo.

  4. Inserisci il link di condivisione del video nel campo Link video.

  5. Clicca su Salva.

HTML personalizzato

Nella sezione HTML personalizzato, puoi utilizzare il codice HTML per creare un contenuto personalizzato per la tua home page. Ad esempio, puoi usare il codice HTML per formattare blocchi, creare tabelle o incorporare un contenuto da un sito web di terzi.

Aggiungi una sezione HTML personalizzata alla tua home page

  1. Clicca su Aggiungi sezione.

  2. Clicca su HTML personalizzato, quindi su Seleziona.

  3. Clicca su HTML personalizzato e inserisci il codice HTML che desideri aggiungere alla tua home page.

  4. Clicca su Salva.

Puoi utilizzare le impostazioni tema per personalizzare i colori e i caratteri tipografici nel tuo negozio online. Puoi anche configurare link ai tuoi account sui social media, modificare le impostazioni del tuo carrello e aggiungere una favicon.

Pop include le impostazioni del tema seguenti:

  • Colori

  • Caratteri tipografici

  • Favicon

  • Pagina del carrello

  • Social media

  • Check-out

Colori

Puoi scegliere i colori per le diverse parti del tuo negozio online.

Personalizza le impostazioni del colore

  1. Clicca su Impostazioni tema.
  2. Clicca su Colori.
  3. Per aprire il selettore di colore, clicca sul campione di colore per il tipo di contenuto che desideri modificare. Nell'area Selezionato di recente sono mostrati i colori selezionati di recente per il tema. Nell'area Attualmente utilizzato sono mostrati i colori attualmente utilizzati in altre parti del tema.

    Per impostare un codice colore esadecimale specifico, clicca sul campo di testo per inserire il colore.

    Per impostare il colore su trasparente, elimina il valore del codice esadecimale dal campo di testo.

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

Ti consigliamo di utilizzare i font di sistema nel tuo negozio, per evitare che vengano scaricati nuovi font sul computer del cliente, provocando un impatto negativo sulla velocità di caricamento del negozio. Il font che viene visualizzato sul computer del cliente dipende dal suo sistema operativo. Scopri di più sui font di sistema.

Personalizza le impostazioni dei caratteri tipografici

  1. Clicca su Impostazioni tema.

  2. Fai clic su Caratteri tipografici.

  3. Per ogni tipo di testo, clicca su Modifica per utilizzare il selettore di font.

  4. Esplora i font utilizzando il campo di ricerca o cliccando su Caricane altri.

    Per visualizzare tutti i font disponibili, controlla la Libreria dei font di Shopify.

  5. Clicca sul nome del font che desideri utilizzare.

  6. Per modificare il font con uno stile diverso, clicca sul nome dell'attuale stile di font e selezionane uno nuovo dal menu a discesa.

  7. Clicca su Seleziona.

  8. Clicca su Salva.

Social media

Puoi aggiungere pulsanti di condivisione sui social per i tuoi prodotti e articoli del blog e link ai tuoi account social media.

Per personalizzare le impostazioni dei social media:

  1. Clicca su Impostazioni tema.

  2. Clicca su Social media.

  3. Per caricare un’immagine per condivisione social, nell’area Immagine per condivisione social clicca su Seleziona immagine o Esplora immagini gratuite.

  4. Puoi aggiungere link ai tuoi account sui social media negli appositi campi all’interno dell’area Account social. Inserisci link completi, come ad esempio https://instagram.com/shopify o https://twitter.com/shopify.

  5. Per aggiungere pulsanti di condivisione social ai tuoi prodotti e agli articoli sul blog, seleziona una o tutte le caselle di spunta nell’area Opzioni di condivisione sui social.

- **Share on Facebook**
- **Tweet on Twitter**
- **Pin on Pinterest** (not available for blog post sharing)
  1. Clicca su Salva.

Aggiungi dei sottomenu alla sidebar

Per aggiungere dei menu a discesa al menu principale, devi creare dei menu dalla pagina Navigazione. Questo articolo ti guiderà in questo processo.

Dimensione ottimale per il logo del negozio

Un logo dalle proporzioni compatte è l'ideale per il tema Pop, che mostra il logo nella sidebar. I loghi rettangolari sviluppati in larghezza sono inadatti a questo tema.

La larghezza massima per il logo è di 450 pixel e l'altezza massima è di 200 pixel. Una volta caricato, il logo verrà ridimensionato perché si adatti a questi limiti.

Il formato ideale è il PNG.

Riduci lo spazio bianco attorno al logo nella sidebar

Prima di rimuovere l'eventuale bordo aggiunto dal tema Pop sopra e sotto il logo, è estremamente importante tagliare l'eventuale bordo incluso nell'immagine stessa. È necessario che tagli lo spazio negativo o i pixel trasparenti che circondano la grafica del logo prima di caricare il file su Shopify.

Ecco un logo con molto spazio negativo intorno:

Ecco lo stesso logo una volta rifilato — lo spazio negativo intorno ad esso è stato tagliato:

Ecco il risultato grafico che si ottiene inserendo sul tema Pop un logo non rifilato:

Invece, ecco il risultato grafico che si ottiene inserendo sul tema Pop un logo rifilato:

Una volta caricato nelle risorse del tema il logo rifilato, puoi modificare la larghezza della sidebar dall'editor del tema. Nella sezione Header e Navigazione, modifica a tuo piacimento il valore "Dimensioni > Larghezza menu desktop".

Come ultima alternativa non supportata, se desideri ridurre il bordo sopra e sotto il logo, procedi come segue:

  1. In Risorse, fai clic su timber.scss.liquid per aprire il foglio di stile del tema nell'editor di codice online o vai su questo URL.

  2. In fondo al file, aggiungi:

{% comment %}
  The following media query function produces this:
  @media screen and (min-width: 1025px) { ... }
  Sidebar is only shown when width > 1025 pixels.
{% endcomment %}

@include at-query ($min, $large) {
  .header-logo {
    margin-bottom: 30px /* original is 60px */;
  }

  .site-header {
    padding-top: 30px /* original is 90px */;

    .hr--small {
      margin: 0 auto 10px /* original is 15px auto 30px */;
    }
  }
}
  1. Salva il file.

Modifica le impostazioni della pagina del prodotto

Nella sezione pagina del Prodotto, puoi aggiungere o rimuovere i seguenti elementi:

  • Brand o fornitore del prodotto
  • Zoom immagine
  • Prodotti simili
  • Selettore di quantità
  • Pulsante di check-out dinamico
  • Icone per la condivisione sui social

Per modificare le impostazioni delle pagine del prodotto:

  1. Dal menu a discesa della barra in alto, seleziona Pagine di prodotto.

  2. Clicca su Sezioni.

  3. Clicca su Pagina del prodotto.

  4. Per mostrare il brand o il fornitore del prodotto, seleziona Mostra fornitore prodotto. Perché questi vengano mostrati, devi aggiungere un fornitore al prodotto.

  5. Per consentire ai clienti di ingrandire un'immagine del prodotto scorrendovi sopra con il mouse, seleziona Abilita zoom immagine.

  6. Per mostrare una selezione di prodotti correlati in fondo alla pagina, seleziona l'opzione Mostra prodotti correlati. La collezione a cui appartiene il prodotto determina i prodotti correlati visualizzati. Perché i prodotti correlati vengano mostrati, devi creare una collezione per il prodotto oppure aggiungerlo a una collezione esistente. Se il prodotto non fa parte di una collezione, non verranno visualizzati prodotti correlati.

  7. Per mostrare un selettore di quantità, seleziona Mostra selettore quantità.

  8. Per mostrare un pulsante di check-out dinamico, seleziona Mostra pulsante di check-out dinamico.

  9. Per mostrare le icone per la condivisione sui social, seleziona Permetti condivisione del prodotto.

  10. Clicca su Salva.

I migliori tipi di immagine del prodotto per Pop

Le foto ad alta risoluzione appaiono più eleganti e professionali nel tema Pop, pertanto dovresti utilizzare immagini di almeno 1024 pixel in larghezza e 1024 pixel in altezza. Se necessario, le immagini vengono automaticamente ridimensionate, perciò maggiore è la loro qualità meglio è.

Le foto ad alta risoluzione sono particolarmente importanti se utilizzi la funzione Zoom immagine, che puoi abilitare nell'editor del tema dalla sezione Pagine del prodotto.

Idealmente, le immagini in primo piano dei prodotti avranno tutte lo stesso rapporto tra larghezza e altezza, in modo da apparire al meglio sulle pagine di collezione.

Sei pronto per iniziare a vendere con Shopify?

Provalo, è gratis