Tema Mythic per Shopify

Introduzione Documentazione Supporto

Benvenuto in Mythic!

Mythic è progettato per offrire una narrazione visiva moderna, velocità ad alte prestazioni e un layout completamente reattivo per il tuo negozio.

• Funzionalità Standard di Shopify: Questo tema include tutte le funzionalità e configurazioni standard dei Temi Shopify. Per leggere sulle funzionalità principali di Shopify, configurazioni del negozio e impostazioni standard di liquid, visita il Centro Assistenza Shopify per una panoramica dettagliata di ogni area e sezione standard.

• Ottimizzazione Mobile-First: Come tutti i Temi ufficiali Shopify, Mythic è completamente ottimizzato per dispositivi mobili, garantendo che ogni sezione, slider ed elemento interattivo offra un'esperienza fluida su tutte le dimensioni dello schermo.

Indice della Sezione

Elenco di tutte le funzionalit del tema disponibili, sezioni e guide alla personalizzazione.

Intestazione

La sezione Intestazione controlla la navigazione di primo livello, il branding e i controlli di utilità ad accesso rapido nel tuo negozio. Le impostazioni principali ti permettono di regolare il colore di sfondo, l'altezza dell'intestazione, la visualizzazione sticky, il layout del logo e controlli specifici per funzionalità chiave:

Barra di Ricerca:

Attiva o disattiva la visibilità della barra di ricerca centrale e personalizza il testo segnaposto.

Cassetto Menu:

Seleziona i menu di navigazione, personalizza il testo dei link e scegli di visualizzare la navigazione in un cassetto laterale (anche su desktop) posizionato a destra.

Cassetto Account e Carrello:

Imposta etichette personalizzate per i trigger dell'account cliente e del carrello, e definisci l'intestazione dello stato vuoto per il cassetto carrello.

Fisarmonica

La sezione Accordion ti permette di creare elenchi di testo a scomparsa, perfetti per Domande Frequenti o politiche del negozio. I visitatori possono cliccare su qualsiasi domanda per aprirla e leggere la risposta, mantenendo la tua pagina pulita e organizzata. Puoi facilmente impostare il titolo principale della sezione, cambiare il colore del testo e regolare lo spazio sopra e sotto il blocco usando semplici cursori nell'Editor del Tema.

Divisione Azione

La sezione Divisione Azione abbina un messaggio di testo dettagliato a sinistra con una casella funzionale dedicata o un menu di contatto diretto a destra. È ideale per mostrare servizi come valutazioni all'ingrosso, conto vendita o canali speciali di supporto clienti. Puoi personalizzare il titolo principale, il sottotitolo, la descrizione, i pulsanti tag e il titolo della barra laterale, oltre a regolare le dimensioni dei caratteri, la larghezza della barra laterale e i colori di sfondo e accento individuali direttamente nelle impostazioni.

Slider Blog

La sezione Slider Blog presenta gli ultimi post e storie del tuo negozio in un carosello pulito e scorrevole. Nelle impostazioni principali della sezione, puoi impostare un colore di sfondo o un gradiente, personalizzare il padding superiore e inferiore, regolare il peso dei caratteri e impostare etichette standard come il titolo della sezione, il testo del link e i pulsanti "leggi di più". Aggiungendo blocchi Articolo individuali, puoi mostrare post standard del blog o storie personalizzate con opzioni per layout a immagine intera o a scheda divisa, immagini personalizzate, sfondi video (YouTube, Vimeo o MP4) e link di reindirizzamento personalizzati.

Banner Call to Action

Il Banner Call to Action crea una sezione promozionale ampia e accattivante progettata per stimolare l'engagement dei clienti. Puoi personalizzare il sottotitolo, il titolo principale, la descrizione e il pulsante call-to-action con un link diretto. Puoi anche aggiungere blocchi Info individuali, che vengono visualizzati automaticamente sotto il testo con icone di spunta pulite per evidenziare punti chiave di fiducia o garanzie. Le impostazioni della sezione ti permettono anche di regolare il padding superiore e inferiore e scegliere un colore di sfondo o un gradiente personalizzato.

Centro Campagne

La sezione Centro Campagne mostra una griglia strutturata di schede promozionali per evidenziare offerte chiave del negozio, campagne e contenuti esclusivi. Le impostazioni della sezione controllano i titoli principali, le colonne per riga, lo stile di sfondo e gli effetti hover globali delle schede, mentre i blocchi Scheda individuali ti permettono di personalizzare titoli, descrizioni, link dei pulsanti e icone.

Come Ottenere Codici Icona SVG

Per aggiungere icone vettoriali personalizzate alle tue schede:

  1. Trova un'Icona: Visita una libreria di icone open-source gratuita (come Lucide Icons o Tabler Icons).
  2. Copia il Codice SVG: Cerca l'icona desiderata (es. un cuore, una stella o un diamante), cliccaci sopra e seleziona Copia SVG o Copia Codice.
  3. Incolla nelle Impostazioni: Incolla il blocco di codice raw ... direttamente nel campo Icona del tuo blocco Scheda.

Cassetto Carrello

Il Cassetto Carrello permette ai clienti di visualizzare in anteprima e gestire gli articoli tramite un menu a discesa a comparsa nell'intestazione o un cassetto a scorrimento con controlli di quantità, input promozionali e link al checkout (richiede l'aggiunta del blocco Cassetto Carrello sotto Intestazione). In Impostazioni Tema > Premi Carrello, puoi configurare fino a tre soglie di spesa a livelli (es. livelli di spesa per sconti del 30%, 50% o 70%) per mostrare una barra di progresso dinamica delle ricompense direttamente all'interno del cassetto.

Griglia Galleria Contenuti

La Griglia Galleria Contenuti abbina elementi multimediali in evidenza (video e immagini statiche) accanto a un carosello pulito di recensioni clienti.

• Impostazioni Generali della Sezione: Personalizza il padding superiore e inferiore, il sottotitolo della sezione (es. "RECENSIONI CLIENTI"), l'immagine principale, il media video e i colori del bordo del contenitore. Per i contenuti video, puoi caricare un file MP4 diretto tramite Shopify Video o inserire un URL YouTube (usato automaticamente se non è selezionato un video Shopify), con un'opzione per attivare/disattivare la Riproduzione Automatica Video.

• Blocchi Recensione: Aggiungi più blocchi Recensione per creare uno slider di testimonianze accanto alla tua griglia multimediale. Per ogni blocco recensione individuale, puoi regolare: valutazione a stelle, testo della recensione, autore ed etichetta.

Carosello Collezione

La sezione Carosello Collezione mostra prodotti da una collezione selezionata in uno slider pulito e scorrevole orizzontalmente con frecce di navigazione.

  • Collezione e Titolo: Scegli quale collezione del negozio mettere in evidenza e imposta un titolo personalizzato per la sezione (es. "Mythos Fantasy Cards").
  • Impostazioni Badge: Aggiungi un badge promozionale (es. "NUOVO") accanto al titolo, seleziona il colore di accento e attiva l'opzione Posiziona badge in alto per allinearlo.
  • Pulsanti e Navigazione: Personalizza le etichette predefinite per i pulsanti delle singole schede prodotto (es. "Aggiungi al carrello") e configura un pulsante della sezione indipendente con etichetta personalizzata (es. "Acquista Collezione") e link diretto.
  • Stile e Layout: Imposta colori personalizzati per lo sfondo della sezione, lo sfondo del pulsante e il testo del pulsante, insieme ai controlli di padding superiore e inferiore della sezione.

Lista Collezioni

La sezione Elenco Collezioni crea una griglia di schede interattive con gradienti personalizzati, icone vettoriali e link diretti alle collezioni. Puoi personalizzare il colore di sfondo della sezione, l'intestazione, le colonne per riga e i colori di accento al passaggio del mouse, quindi aggiungere singoli blocchi Scheda Collezione per rappresentare ogni collezione.

Impostazioni Blocco Scheda Collezione

Per ogni blocco scheda, puoi configurare:

  • Collezione: Seleziona la collezione di destinazione per il link di reindirizzamento.
  • Titolo Collezione: Inserisci l'etichetta personalizzata della scheda (es. "Nuovi Arrivi").
  • Icona: Incolla il codice grezzo per visualizzare un'icona personalizzata al centro della scheda.
  • Gradiente di Sfondo della Scheda: Aggiungi un codice CSS di gradiente lineare per dare a ogni scheda una transizione di colore di sfondo distinta. Formato: linear-gradient(direzione, colore1, colore2)

Griglia Collezioni

La sezione griglia Collezioni mostra un layout reattivo di schede collezione in evidenza con immagini in evidenza e titoli diretti delle collezioni. I controlli della sezione ti permettono di attivare la dimensione degli elementi della griglia (Piccola/Grande) e regolare la spaziatura della griglia, mentre i singoli blocchi collezione ti consentono di selezionare e mostrare specifiche collezioni del negozio.

Modulo di Contatto

La sezione Modulo di Contatto mostra un modulo di richiesta cliente semplificato inserito in un contenitore a scheda scura. Le impostazioni consentono la completa personalizzazione di titoli, sottotitoli, descrizioni, etichette del pulsante di invio e etichette o testo segnaposto personalizzati per i campi Oggetto, Email e Messaggio.

Eroe

La sezione Eroe presenta un banner di sfondo a tutta larghezza con sovrapposizioni di testo centrate e un pulsante call-to-action. I controlli della sezione consentono di selezionare l'immagine di sfondo e regolare l'altezza complessiva del banner, mentre i blocchi di contenuto permettono di aggiungere elementi personalizzabili come Titolo, Paragrafo e Pulsante.

Punti Caldi Eroe

La sezione Punti Caldi Eroe combina un banner eroe interattivo con icone hotspot puntuali (+ indicatori) che rivelano caroselli di collezioni collegate al passaggio del mouse. Le impostazioni della sezione controllano la tipografia dell'eroe, lo stile del pulsante, le immagini di sfondo per desktop/mobile e l'opacità della sovrapposizione, mentre i singoli blocchi Hotspot consentono di assegnare titoli, descrizioni, collezioni di destinazione e coordinate precise X/Y in percentuale per posizionare ogni puntina sull'immagine.

Vetrina con Suggerimenti

La sezione Vetrina con Suggerimenti abbina un banner di sfondo in evidenza con titoli allineati a sinistra, descrizioni e blocchi personalizzabili di Elementi Puntati. Le impostazioni della sezione consentono di regolare i media di sfondo, l'opacità della sovrapposizione e lo stile della scheda (colori e raggio del bordo), mentre i blocchi Hotspot permettono di posizionare puntine interattive sull'immagine con coordinate X/Y indipendenti per desktop e mobile per mostrare dettagli e link in schede pop-up.

Marquee di Testo

La sezione Marquee di Testo crea un banner di testo animato e in scorrimento continuo per annunci e avvisi del sito. Le impostazioni della sezione consentono di personalizzare il colore di sfondo, il colore del testo, la dimensione del carattere e la spaziatura tra gli elementi, mentre i singoli blocchi di Testo permettono di aggiungere messaggi promozionali unici, emoji o note di aggiornamento al ciclo del marquee.

Testo con Icone

La sezione Testo con Icone mostra schede funzionali con icone personalizzate, titoli e descrizioni disposte in una griglia multicolonna. Le impostazioni generali della sezione consentono di personalizzare titoli, colonne per riga, spaziatura della griglia, dimensioni delle icone e un badge opzionale per il conteggio dei passaggi, mentre i singoli blocchi Box permettono di caricare immagini o inserire icone vettoriali SVG raw, impostare sfondi a gradiente personalizzati e configurare colori specifici per le schede e pulsanti call-to-action.

Per ottenere il codice SVG, visita una libreria di icone open-source come Lucide Icons o Tabler Icons, cerca l'icona desiderata e clicca su Copia SVG o Copia Codice. Quindi, incolla il blocco di codice raw ... direttamente nel campo SVG del tuo blocco Box.

Multicolonna

La sezione Multicolonna consente di visualizzare contenuti affiancati per evidenziare vantaggi chiave, passaggi o caratteristiche del negozio in un layout pulito. Puoi impostare un titolo principale e un sottotitolo per l'intera sezione, oltre ad aggiungere o rimuovere singoli blocchi colonna per mostrare immagini, titoli e brevi descrizioni.

Lista Desideri

La sezione Lista Desideri crea uno spazio dedicato per mostrare tutti gli articoli che un cliente ha salvato durante la navigazione.

Quando un acquirente clicca sul pulsante utility Lista Desideri in qualsiasi pagina prodotto, quell'articolo viene salvato e automaticamente popolato come una griglia di schede all'interno di questa sezione—offrendo ai clienti un luogo facile e centralizzato per rivedere e acquistare in seguito i loro articoli preferiti.

Piè di Pagina

La sezione Piè di Pagina ancoraggio la parte inferiore del tuo negozio con link di navigazione, branding, dettagli di conformità e strumenti di coinvolgimento clienti. Qui puoi impostare il colore di sfondo, attivare Mostra icone di pagamento per visualizzare i metodi di pagamento accettati e abilitare le Politiche del negozio nella barra inferiore.

Blocchi del Piè di Pagina

• Blocco Logo: Carica il tuo logo, regola la sua dimensione e aggiungi un breve slogan. Puoi anche attivare le icone social o il nome del negozio.

• Blocco Link: Mostra un menu di navigazione dal tuo admin Shopify sotto un titolo personalizzato.

• Blocco Newsletter: Aggiungi una casella di iscrizione email con il tuo titolo, sottotitolo e testo segnaposto preferiti.

Sezione Prodotto

La sezione Prodotto presenta un layout a due colonne che mostra i media del prodotto insieme ai dettagli chiave e alle opzioni di acquisto. Le impostazioni principali consentono di regolare il colore di sfondo, la larghezza della sezione, le immagini sticky, il raggio del bordo e lo zoom dell'immagine, mentre blocchi come Titolo, Prezzo, Inventario, Selettore Variante e Pulsanti Acquista completano il layout core del prodotto.

Blocco: Scheda Dettagli

Il blocco Dettagli scheda organizza le informazioni sul prodotto in un'interfaccia a schede pulita per mantenere la pagina ordinata e facile da navigare. Puoi impostare titoli personalizzati per le schede (ad esempio, "Descrizione della carta" e "Panoramica della carta") e inserire testo arricchito per ogni area di contenuto corrispondente.

Consiglio: Per importare automaticamente la descrizione reale del tuo prodotto da Shopify, clicca sull'icona Connetti fonte dinamica (il simbolo del database accanto all'etichetta del campo) sopra la casella di contenuto e seleziona Descrizione.

Blocco: Caratteristiche del prodotto

Il blocco Caratteristiche del prodotto mostra attributi chiave—come Rarità della carta o Condizione—in un elenco pulito di etichette e valori (supporta fino a 6 coppie di caratteristiche personalizzate).

Come collegare dettagli personalizzati del prodotto

  1. Crea il campo dettaglio (configurazione una tantum)
    •Vai su Impostazioni > Dati personalizzati > Prodotti in Shopify.
    • Clicca su Aggiungi definizione, nomina il tuo dettaglio (come "Rarità della carta") e clicca Salva.
  2. Aggiungi dettagli a un prodotto
    • Apri la pagina del tuo prodotto in Shopify.
    • Scorri fino alla sezione Metafields in fondo, inserisci il valore (come "Raro") e salva.
  3. Mostralo nel tuo negozio
    • Nell'editor del tema, apri il blocco Caratteristiche del prodotto.
    • Digita l'etichetta (es. "Rarità della carta") nella casella Titolo.
    • Nella casella Testo, clicca sull'icona del database impilata nell'angolo e seleziona il nome del dettaglio per collegarlo automaticamente!

Blocco: Testo con icona

Il blocco Testo con icona mostra fino a 3 pillole compatte di caratteristiche affiancate all'interno della sezione prodotto per evidenziare i punti di forza principali (come spedizione veloce, garanzie sul prodotto o autenticità). Ogni blocco di testo consente di inserire testo personalizzato insieme al codice SVG grezzo per visualizzare l'icona vettoriale scelta.

Blocco: Pulsante di utilità

Il blocco Pulsante di utilità aggiunge azioni secondarie alla pagina del prodotto, permettendo ai clienti di salvare articoli o condividere prodotti con altri. Le impostazioni consentono di attivare o disattivare indipendentemente i pulsanti Lista dei desideri e Condividi e di personalizzare il testo dell'etichetta del pulsante per ciascuno.

Impostazioni tema

Tipografia

Le impostazioni di Tipografia controllano gli stili globali dei font in tutto il tuo negozio. Selezionare un font Primario (come Work Sans) stabilisce un'identità visiva coerente, applicando automaticamente il tipo di carattere scelto a titoli, testo del corpo, pulsanti ed elementi di navigazione in tutto il sito.

Layout

Le impostazioni di Layout definiscono le dimensioni strutturali e gli spazi del tuo negozio controllando la Larghezza della pagina (larghezza massima del contenitore per il contenuto principale) e il Margine della pagina (spaziatura laterale esterna per evitare che il contenuto tocchi i bordi dello schermo su display più piccoli).

Colori

Le impostazioni di Colori stabiliscono la palette di colori globale del tuo negozio per una completa coerenza del brand in ogni pagina:

  • Sfondo e Primo piano: Imposta il colore di sfondo principale della pagina e lo stile accentuato predefinito.
  • Primario e Secondario: Definisce i colori del font dei titoli principali (Primario) e del testo del corpo (Secondario).
  • Bordo e Accento: Controlla i divisori di linea, i bordi dei contenitori e gli accenti strutturali.
  • Controlli dei pulsanti: Personalizza i colori di sfondo, testo e bordo dei pulsanti.
  • Link e Hover: Imposta i colori predefiniti dei collegamenti ipertestuali e i loro stati interattivi al passaggio del mouse.

Social

Le impostazioni di Social ti permettono di aggiungere link ai profili social del tuo brand. Basta incollare gli URL dei profili nei campi corrispondenti alle piattaforme, e le icone social corrispondenti appariranno automaticamente nel footer.

Premi Carrello

Le impostazioni dei Premi Carrello ti permettono di incentivare ordini più grandi impostando fino a tre obiettivi di spesa a livelli. Definisci importi specifici del carrello e etichette personalizzate per ogni livello per mostrare una barra di progresso dinamica direttamente nel cassetto del carrello, incoraggiando i clienti ad aggiungere più articoli per sbloccare sconti o vantaggi.

POLITICA DI SUPPORTO

Il supporto del nostro tema copre correzioni di bug, risposte sulle funzionalità e impostazioni integrate del tema, e guida di base per la configurazione del negozio. Modifiche di design personalizzate, integrazioni di app di terze parti e migrazioni di aggiornamenti del tema per negozi personalizzati non sono incluse nel costo di acquisto del tema, ma possono essere richiesti servizi aggiuntivi separatamente tramite il nostro modulo di contatto.

Codice Personalizzato & Snippet di Codice

Qualsiasi tutorial di codice personalizzato o snippet di codice incluso in questa documentazione è fornito come guida opzionale e non è supportato nell'ambito del supporto standard del tema. Prima di effettuare modifiche manuali al codice del tema, si prega di duplicare il tema per creare una copia di backup.
Se hai bisogno di assistenza per sviluppo personalizzato o modifiche avanzate al codice, il nostro team è disponibile per assunzioni personalizzate. Come agenzia riconosciuta da Shopify, possiamo aiutarti a personalizzare il tema secondo le tue specifiche esatte—sentiti libero di contattarci tramite il nostro modulo di contatto qui sotto.

Domande Frequenti

Come installo il tema sul mio negozio Shopify?

  1. Scarica il file .zip del tema sul tuo computer.
  2. Nel tuo Admin Shopify, vai a Negozio Online > Temi.
  3. Nella sezione Libreria temi, clicca Aggiungi tema e seleziona Carica file zip.
  4. Carica il tuo file .zip. Una volta caricato, clicca Azioni > Pubblica quando sei pronto per renderlo attivo.

Dove posso trovare i codici SVG per le sezioni che li richiedono?

  • Dove trovare gli SVG: Puoi ottenere codice SVG pulito da piattaforme di icone gratuite come Heroicons o Font Awesome, oppure esportare icone vettoriali come SVG da Adobe Illustrator o Figma.

  • Come copiare il codice: Apri il tuo file .svg in un editor di testo (come Notepad o TextEdit), oppure clicca "Copia SVG" direttamente da siti come Heroicons.

  • Come applicarlo nelle impostazioni del tema: Apri le impostazioni del blocco (come il blocco Testo con Icona) nell'editor del tema. Incolla il codice grezzo ... direttamente nel campo di input Icona designato.

Dove dovrei usare le sezioni della pagina 404 e della pagina Password?

Queste due sezioni sono specifiche per il template e costruite esclusivamente per le rispettive pagine:

  • Sezione pagina 404: Usala solo nel template 404 del tuo sito per guidare i visitatori smarriti verso pagine attive quando atterrano su un URL rotto o inesistente.

  • Sezione pagina Password: Usala solo nel template Password del tuo sito per mostrare una schermata di accesso privata quando il tuo negozio è bloccato o in costruzione.

Perché le modifiche non si salvano o aggiornano nell'editor?

Svuota la cache del browser o apri l'editor del tema Shopify in una finestra in incognito/privata. Assicurati di cliccare Salva dopo aver effettuato modifiche al layout o al testo.

Perché i metafield dinamici non vengono visualizzati?

Assicurati che il metafield abbia un valore salvato nella pagina specifica del prodotto (Prodotti > [Nome Prodotto] > Metafields) e che il tipo di metafield corrisponda al tipo di input previsto dal blocco.

Le icone SVG non vengono visualizzate correttamente?

Verifica che il codice inizi con e finisca con . Assicurati che l'SVG contenga attributi validi come viewBox e fill="currentColor" o stroke="currentColor" in modo che erediti gli stili del tuo tema.

Hai altre domande?

Se riscontri problemi, hai domande specifiche sul design o hai bisogno di aiuto per configurare il tuo negozio, contattaci! Puoi metterti in contatto diretto con il nostro team di supporto utilizzando il Modulo di Contatto qui sotto, e ti risponderemo il prima possibile.

Hai bisogno di assistenza?

Compila il modulo qui sotto e ti aiuteremo con qualsiasi problema o domanda sul nostro tema.