> ## Knowledge Base Index > Fetch the complete knowledge base index at: https://help.hoppyapps.com/sitemap.xml > Use this file to discover available pages before exploring further. > Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash). # 🎨 Convertitore di valute – Design & Styling > ℹ️ **Note:** Questo articolo è stato tradotto automaticamente utilizzando AI e può contenere imprecisioni. Se qualcosa sembra sbagliato, si prega di contattare il nostro team di supporto. La sezione Design & Styling ti dà il controllo completo sull'aspetto del Convertitore valuta sul tuo negozio. Da stili di bandiera e tipografia a colori, confini e preferenze di visualizzazione, queste impostazioni aiutano a creare un Convertitore di valute che si sente come una parte naturale del tuo negozio, mantenendo un'esperienza fluida per acquirenti internazionali. # **⚠️ Prima di iniziare** Per accedere alle impostazioni di Design & Styling: → Aperto **Hoppy Currency Converter** → Completare il processo di bordo → Aprire il **Design** scheda 💡 Tutti i cambiamenti di progettazione diventano visibili sul negozio dopo il salvataggio. --- ## **🏳️ Personalizzazione della bandiera** Questa sezione controlla come le bandiere appaiono durante il Convertitore di valute. Le modifiche si applicano a entrambi: * Visualizzazione valuta selezionata * L'elenco delle valute a discesa --- ### **🎨 Stile di bandiera** Controlla l'aspetto visivo delle bandiere. #### **Tradizionale** Visualizza immagini di bandiera standard senza ulteriori styling. **Il meglio per:** Minimal e professionali storefront dove si desidera che le bandiere si mescolino naturalmente nel design. --- #### **Moderno** Visualizza bandiere con: * angoli arrotondati * Ombre morbide * Bordi sottili * Trattamento visivo migliorato **Il meglio per:** Moderni negozi che vogliono che il Convertitore di valute si distingua come un elemento di design premium. 💡 Lo stile selezionato si applica ad ogni bandiera visualizzata dal Convertitore di valute. --- ### **🔘 Tema della bandiera** Controlla la forma delle bandiere. #### **Round** Le bandiere appaiono con angoli arrotondati. #### **Circolo** Bandiere appaiono all'interno di una forma circolare. #### **Appartamento** Bandiere appaiono con angoli affilati e un look tradizionale. Il tema selezionato aiuta a determinare la personalità visiva generale del widget. --- ## **🔘 Personalizzazione del selettore di valuta** Queste impostazioni controllano l'aspetto del widget principale del Convertitore di valute. --- ### **🎨 Tema** Controlla lo stile visivo generale del contenitore Convertitore di valute. #### **Predefinito** Un aspetto pulito e semplice che si fonde naturalmente nella maggior parte Shopify temi. #### **Modern Layer** Crea un effetto visivo stratificato dietro il widget per ulteriore profondità e enfasi. 💡 L'effetto Modern Layer utilizza automaticamente il colore di sfondo selezionato. --- ### **👀 Modalità di visualizzazione** Controlla quali informazioni appaiono all'interno del Convertitore di valute. #### **Mostra Bandiera e Valuta** Visualizza sia le informazioni sulla bandiera che sulla valuta. #### **Mostra solo la bandiera** Visualizza solo bandiere. #### **Mostra solo la valuta** Visualizza solo informazioni sulla valuta. Questa impostazione si applica sia al selettore che all'elenco a discesa. --- ### **🌓 Tema di colore** Controlla se il Convertitore di valute utilizza un aspetto leggero o scuro. #### **Luce** Utilizza uno sfondo leggero con testo più scuro. #### **Oscuro** Utilizza uno sfondo scuro con testo più leggero. #### **Automatico** Risponde automaticamente alle preferenze del cliente. 💡 La modalità automatica aiuta il Convertitore di valute ad adattarsi naturalmente a diversi dispositivi e ambienti di navigazione. --- ### **🔤 Visualizza solo i codici di valuta** Controlla come appaiono i nomi delle valute. #### **Abilitato** Visualizza i codici di valuta brevi. Esempi: * USD * EUR * GBP #### **Disabili** Visualizza i nomi e i codici valutari completi. Esempi: * Dollaro americano (USD) * Euro (EUR) * British Pound (GBP) Questo può aiutare a rendere la discesa più compatta quando supporta molte valute. --- ## **🎨 Personalizzazione del tema** Questa sezione controlla il core styling del Convertitore di valute. --- ### **📦 Stile di confine** Controlla come viene visualizzato il bordo del widget. #### **Box Ombra** Aggiunge un'ombra sottile intorno al Convertitore di valute. #### **Linea di trasporto** Aggiunge un bordo visibile intorno al widget. #### **No Border** Rimuove completamente i confini e le ombre. Ogni opzione crea una diversa enfasi visiva a seconda del tuo stile storefront. --- ### **🔤 Font Family** Controlla il carattere utilizzato durante il Convertitore di valute. #### **Utilizzare il carattere tema** Abbina il tuo Shopify tipografia tematica automaticamente. #### **Google Fonts** Scegli tra una varietà di caratteri supportati. Esempi includono: * Robot * Apri Sans * Montserrat * Poppins 💡 Utilizzando il tuo carattere a tema, in genere crea l'esperienza di storefront più senza soluzione di continuità. --- ### **🎨 Colore dello sfondo** Controlla il colore di sfondo del Convertitore di valute. Potete: * Utilizzare il raccoglitore di colore * Inserisci un valore di colore Hex Scegli un colore che completa il tuo negozio rimanendo facile da identificare. --- ### **🖊️ Colore del testo** Controlla il colore del testo durante il Convertitore di valute. Questo include: * Moneta selezionata * Opzioni di discesa * Etichette Per una migliore leggibilità, assicura un contrasto sufficiente tra il testo e i colori di sfondo. --- ### **🖱️ Colore del mouseover** Controlla il colore indicato quando i clienti superano le opzioni di valuta. Questo aiuta i clienti a identificare chiaramente quale opzione stanno per selezionare. Un sottile contrasto dal colore di sfondo di solito funziona meglio. --- ### **🔽 Colore dell'icona a goccia** Controlla il colore dell'icona a discesa. Abbinando questo colore con il colore del testo spesso crea l'aspetto più coerente. --- ## **⚠️ Note importanti** ### **Tema scuro sovrascrive alcuni colori** Quando si utilizza: * Tema scuro * Automatico Tema (mentre un shopper utilizza la modalità scura) Il Convertitore di valute può utilizzare colori ottimizzati dark-mode invece dei colori di sfondo e testo selezionati. Per la personalizzazione avanzata della modalità oscura, utilizzare Custom CSS. --- ### **Layer Theme utilizza il colore di sfondo** Il tema Modern Layer genera automaticamente il suo effetto stratificato utilizzando il colore di sfondo selezionato. Cambiare il colore di sfondo cambia anche l'aspetto dello strato. --- ### **Modalità di visualizzazione si applica ovunque** Visualizza Le impostazioni della modalità influiscono: * Visualizzazione valuta selezionata * Opzioni di valuta a discesa Entrambe le posizioni rimangono sempre sincronizzate. --- ### **Cambiamenti di carattere Applicare globalmente** Il carattere selezionato colpisce tutto il testo Convertitore di valute, tra cui: * Moneta selezionata * Opzioni di discesa * Risultati della ricerca (se applicabile) --- ### **Hai bisogno di più personalizzazione?** Per lo styling avanzato oltre la scheda Design, utilizzare: **Avanzato → CSS personalizzato** Questo consente agli sviluppatori di applicare stili completamente personalizzati al Convertitore di valute. --- # **🚀 Risultato finale** Una volta configurato con successo: ✅ Il Convertitore di valute corrisponde al tuo marchio di negozio ✅ Bandiere display nel tuo stile e forma preferito ✅ Colori e tipografia si sentono coerenti con il vostro tema ✅ La selezione della valuta rimane chiara e facile da usare ✅ Gli acquirenti internazionali godono di un'esperienza più lucida ✅ Il Convertitore di valute si sente come una parte naturale del tuo negozio Un Convertitore di valute ben progettato non solo sembra meglio - aiuta anche a creare un'esperienza di shopping più fluida e affidabile per i clienti di tutto il mondo. 🌍 ---